[BUG] "Test timeout of XXXms exceeded while tearing down "context"." when trace is enabled

[moshikd]

Context:

• Playwright Version: v1.27
• Operating System: Mac
• Node.js version: v16.17.0
• Browser: Chromium

Describe the bug

I encountered an issue while trying to test loading chrome extension with playwright BUT it seems not related to the chrome extension that i try to load.

i have the following code snippet that basically, navigate to site and wait for 5 sec. when the trace is set to 'on' or 'retain on failure' - timeout issue will occur ( although the test succeed very quickly) IF the trace is set to 'off' - no timeout issue

Code Snippet

const { test: base, chromium } = require('@playwright/test')
const path = require('path')

// const extensionPath = path.join(__dirname, '../data/GeoEdge SafeBrowser') 

const test = base.extend({
  context: async ({ browserName }, use) => {
    const browserTypes = { chromium }
    const launchOptions = {
      headless: false,
      // args: [
      //   `--disable-extensions-except=${extensionPath}`
      // ],
      viewport: {
        width: 1920,
        height: 1080
      }
    }
    const context = await browserTypes[browserName].launchPersistentContext(
      '',
      launchOptions
    )
    await use(context)
    await context.close()
  }
})

  test(`RBU test  `, async ({ page }) => {
    await page.goto("https://www.teamtalk.com/", { waitUntil: "domcontentloaded" })
    await page.waitForTimeout(5000);
    // await page.frameLocator("//iframe[contains(@id, 'google_ads_iframe')]").first().locator("//img[contains(@style, 'width: 15px')]").click(); 
  })

NOTE: i commented out the lines related to the extension that i load because i cannot share it, BUT the issue is not related to the extension load.

playwright.config.ts - this is the config that i use

import type { PlaywrightTestConfig } from '@playwright/test';
import { devices } from '@playwright/test';

/**
 * Read environment variables from file.
 * https://github.com/motdotla/dotenv
 */
// require('dotenv').config();

/**
 * See https://playwright.dev/docs/test-configuration.
 */
const config: PlaywrightTestConfig = {
  testDir: './tests',
  /* Maximum time one test can run for. */
  timeout: 60 * 1000,
  expect: {
    /**
     * Maximum time expect() should wait for the condition to be met.
     * For example in `await expect(locator).toHaveText();`
     */
    timeout: 10000
  },
  /* Run tests in files in parallel */
  fullyParallel: true,
  /* Fail the build on CI if you accidentally left test.only in the source code. */
  forbidOnly: !!process.env.CI,
  /* Retry on CI only */
  retries: process.env.CI ? 2 : 0,
  /* Opt out of parallel tests on CI. */
  workers: process.env.CI ? 1 : undefined,
  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
  reporter: [['html'], ['allure-playwright']],
  //use html for using playwright default reporting
  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
  use: {
    headless: false,
    viewport: { width: 1920, height: 1080 },
    video: "retain-on-failure",
    screenshot: "only-on-failure",
    channel: "chrome",
    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
    actionTimeout: 0,
    /* Base URL to use in actions like `await page.goto('/')`. */
    // baseURL: 'http://localhost:3000',

    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
    trace: "on",
  },

  /* Configure projects for major browsers */
  projects: [
    {
      name: 'chromium',
      use: {
        ...devices['Desktop Chrome'],
        viewport: { width: 1920, height: 1080 }
         //{ width: 1280, height: 720 },
      }
    }

    // {
    //   name: 'firefox',
    //   use: {
    //     ...devices['Desktop Firefox'],
    //     viewport: { width: 1920, height: 1080 },
    //   },
    // },

    // {
    //   name: 'webkit',
    //   use: {
    //     ...devices['Desktop Safari'],
    //     viewport: { width: 1920, height: 1080 }
    //   },
    //}

    /* Test against mobile viewports. */
    // {
    //   name: 'Mobile Chrome',
    //   use: {
    //     ...devices['Pixel 5'],
    //   },
    // },
    // {
    //   name: 'Mobile Safari',
    //   use: {
    //     ...devices['iPhone 12'],
    //   },
    // },

    /* Test against branded browsers. */
    // {
    //   name: 'Microsoft Edge',
    //   use: {
    //     channel: 'msedge',
    //   },
    // },
    // {
    //   name: 'Google Chrome',
    //   use: {
    //     channel: 'chrome',
    //   },
    // },
  ],

  /* Folder for test artifacts such as screenshots, videos, traces, etc. */
  //outputDir: 'test-results/',

  /* Run your local dev server before starting the tests */
  // webServer: {
  //   command: 'npm run start',
  //   port: 3000,
  // },
};

export default config;

it seems like a bug to me. ( maybe it related to https://github.com/microsoft/playwright/issues/16143 ) if additional info is needed please let me know.

[pavelfeldman]

You are recording 5 seconds of video, and it might be encoding it, could you remove video: "retain-on-failure",? You don't need the video if you are recording the trace.

[moshikd]

@pavelfeldman thanks for your reply. i have tested it video: 'off' & trace 'retain on failure' - still i get the timeouts. once i set trace to 'off' the test is executed fast and context teardown is without any issues.

another question: why i get 2 tabs while using the code snippet? i get one tab with blank page and the other tab where the test is running. thanks in advance

[yury-s]

@pavelfeldman thanks for your reply. i have tested it video: 'off' & trace 'retain on failure' - still i get the timeouts. once i set trace to 'off' the test is executed fast and context teardown is without any issues.

We cannot act on this without a repro, is there any chance you can share a minimal example that doesn't include any privacy sensitive code?

another question: why i get 2 tabs while using the code snippet? i get one tab with blank page and the other tab where the test is running. thanks in advance

Launching Chromium with persistent context always opens a tab by default, this is the blank page that you see.

i commented out the lines related to the extension that i load because i cannot share it, BUT the issue is not related to the extension load.

Sorry, can you clarify if the issue reproduces without the extension ?

[moshikd]

@yury-s , i have shared the code snippet above but i will add it here again ( without the extension part - it is not related to the loading chrome extension)

const { test: base, chromium } = require('@playwright/test')
const path = require('path')

const test = base.extend({
  context: async ({ browserName }, use) => {
    const browserTypes = { chromium }
    const launchOptions = {
      headless: false,
      viewport: {
        width: 1920,
        height: 1080
      }
    }
    const context = await browserTypes[browserName].launchPersistentContext(
      '',
      launchOptions
    )
    await use(context)
    await context.close()
  }
})

  test(`RBU test  `, async ({ page }) => {
    await page.goto("https://www.teamtalk.com/", { waitUntil: "domcontentloaded" })
    await page.waitForTimeout(5000);
  })

I have changed in my playwright.config.ts file to use a specific project with the config as pavel mentioned ( video:'off' & trace:'retain-on-failure' ) see screenshot attached

i also executed the test with the the fo;;owing command: npx playwright test tests/TestrbuExtension.test.ts --project=chromium

i still get the issues:

let me know if additional info is needed.

regarding the blank page tab- how can i avoid loading the blank tab page? i get an empty tab and another tab where the test is running. i need to load my chrome extension but i would not like to get the blank page tab

[yury-s]

let me know if additional info is needed.

I created a project with the same test file and config as you described and it works just fine. There must be something else in your project that causes the error. Can you share entire project so that we can repeat this locally?

regarding the blank page tab- how can i avoid loading the blank tab page?

This is a known limitation of the persistent context. You can use ephemeral context (launch instead of launchPersistentContext) where no pages are created by default.

[moshikd]

i also created new project and still i get this issue. this is the project: playwrightTEST.zip

i used this command to run the test: npx playwright test tests/rbutest.test.ts --project=chromium

according to the documentation (on loading chrome extension) :

there is no other way to load extension without getting additional the blank page ? when i use ephemeral context (launch instead of launchPersistentContext) i cannot seem to load the extension.

[yury-s]

i also created new project and still i get this issue. this is the project: playwrightTEST.zip

The test passes for me locally in 9s, perhaps you just need to increase the timeout?

$ npx playwright test tests/rbutest.test.ts --project=chromium

Running 1 test using 1 worker

  1 passed (9s)

To open last HTML report run:

The difference may be that you have some extension loaded unconditionally due to Chrome policy. Can you go to chrome://extensions and see if there are any extensions in the browser launched by playwright? Can you also try running the test in headless mode and see if it still fails?

there is no other way to load extension without getting additional the blank page ? when i use ephemeral context (launch instead of launchPersistentContext) i cannot seem to load the extension.

Someone recently reported that they were able to load extension in ephemeral context, the steps are described in this post, you can give it a try. There is an open issue about integrating this into our docs: https://github.com/microsoft/playwright/issues/16798.

As I mentioned blank page is a side effect of using persistent context, we have no plans fixing that due to its low priority.

[moshikd]

@yury-s I looked into it again and i increased the timeout but still same issue.

the issue is not related to the extension - i removed the extension code and the issue still occur. in addition, i looked into other extension , just in case , but they are not loaded on playwright.

the issue occur also on headless mode.

the issue does not occur when trace is set to off. i addition , i noticed that when video is On , there is no video file recorded.. :(

what else can be the issue or how can we further investigate it?

[dgozman]

Could this be the same as #18126? If you could run under debugger and pause after the test while the trace file is being saved, perhaps we'll see what Playwright is doing?

[moshikd]

@dgozman i'm not sure i did it correctly. i run it on debugger and it was stuck on the following line -

i will be glad to assist if needed

[dgozman]

@moshikd You did the right thing, but this particular place does not help much. Out of curiosity, could you hover the apiName? Otherwise, try stopping a few more times, in the hopes we'll find a place that could be the culprit.

[moshikd]

@dgozman maybe you meant this?

[dgozman]

@moshikd Thank you for your efforts. Unfortunately, I still don't have an idea what could this be, except for #18126. Could you please try with npm i --save-dev @playwright/test@next version and see whether that helps? If not, we would need a repro we can run locally to be able to debug the issue.

[moshikd]

@dgozman sorry for the delay (holiday season) i used the command (npm i --save-dev @playwright/test@next)

and i executed the test and still the same issue occur.

i already shared the project with the test. i will be glad to assist in any other way. can we debug the issue over zoom/ Teams session? i'm available any time and will appreciate your assistance on this.

[aslushnikov]

i will be glad to assist in any other way. can we debug the issue over zoom/ Teams session?

Unfortunately we don't practice this.

i also created new project and still i get this issue. this is the project: playwrightTEST.zip

I tried this locally and it completes for me in 8 seconds too. It does look like something's going on with your particular setup. Could you try running your tests on MacOS Github Actions runners?

[aslushnikov]

I'll close this for now since noone was able to reproduce in our team so we can't proceed.

[udayraj-rzp]

Adding my 2 cents for anyone looking - I had forgotten to add an await in the test.beforeEach() before calling waitForSelectorToBeVisible, which led to this error

Test timeout of 0ms exceeded while tearing down "context".