v1.36.0

Watch the overview: Playwright 1.36 & 1.37

Highlights

🏝️ Summer maintenance release.

Browser Versions

• Chromium 115.0.5790.75
• Mozilla Firefox 115.0
• WebKit 17.0

This version was also tested against the following stable channels:

• Google Chrome 114
• Microsoft Edge 114

v1.35.1

Highlights

#23622 - [Docs] Provide a description how to correctly use expect.configure with poll parameter
#23666 - [BUG] Live Trace does not work with Codespaces
#23693 - [BUG] attachment steps are not hidden inside expect.toHaveScreenshot()

Browser Versions

• Chromium 115.0.5790.13
• Mozilla Firefox 113.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 114
• Microsoft Edge 114

v1.35.0

Playwright v1.35 updates

Highlights

• UI mode is now available in VSCode Playwright extension via a new "Show trace viewer" button:

  

• UI mode and trace viewer mark network requests handled with page.route() and browserContext.route() handlers, as well as those issued via the API testing:

  

• New option maskColor for methods page.screenshot(), locator.screenshot(), expect(page).toHaveScreenshot() and expect(locator).toHaveScreenshot() to change default masking color:

  await page.goto('https://playwright.dev');
  await expect(page).toHaveScreenshot({
    mask: [page.locator('img')],
    maskColor: '#00FF00', // green
  });

• New uninstall CLI command to uninstall browser binaries:

  $ npx playwright uninstall # remove browsers installed by this installation
  $ npx playwright uninstall --all # remove all ever-install Playwright browsers

• Both UI mode and trace viewer now could be opened in a browser tab:

  $ npx playwright test --ui-port 0 # open UI mode in a tab on a random port
  $ npx playwright show-trace --port 0 # open trace viewer in tab on a random port

⚠️ Breaking changes

• playwright-core binary got renamed from playwright to playwright-core. So if you use playwright-core CLI, make sure to update the name:

  $ npx playwright-core install # the new way to install browsers when using playwright-core

  This change does not affect @playwright/test and playwright package users.

Browser Versions

• Chromium 115.0.5790.13
• Mozilla Firefox 113.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 114
• Microsoft Edge 114

v1.34.3

Highlights

#23228 - [BUG] Getting "Please install @playwright/test package..." after upgrading from 1.34.0 to 1.34.1

Browser Versions

• Chromium 114.0.5735.26
• Mozilla Firefox 113.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 113
• Microsoft Edge 113

v1.34.2

Highlights

#23225 - [BUG] VSCode Extension broken with Playwright 1.34.1

Browser Versions

• Chromium 114.0.5735.26
• Mozilla Firefox 113.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 113
• Microsoft Edge 113

v1.34.1

Highlights

#23186 - [BUG] Container image for v1.34.0 missing library for webkit
#23206 - [BUG] Unable to install supported browsers for v1.34.0 from playwright-core
#23207 - [BUG] importing ES Module JSX component is broken since 1.34

Browser Versions

• Chromium 114.0.5735.26
• Mozilla Firefox 113.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 113
• Microsoft Edge 113

v1.34.0

Playwright v1.33 & v1.34 updates

Highlights

• UI Mode now shows steps, fixtures and attachments:
  

• New property testProject.teardown to specify a project that needs to run after this
  and all dependent projects have finished. Teardown is useful to cleanup any resources acquired by this project.

  A common pattern would be a setup dependency with a corresponding teardown:

  // playwright.config.ts
  import { defineConfig } from '@playwright/test';
  
  export default defineConfig({
    projects: [
      {
        name: 'setup',
        testMatch: /global.setup\.ts/,
        teardown: 'teardown',
      },
      {
        name: 'teardown',
        testMatch: /global.teardown\.ts/,
      },
      {
        name: 'chromium',
        use: devices['Desktop Chrome'],
        dependencies: ['setup'],
      },
      {
        name: 'firefox',
        use: devices['Desktop Firefox'],
        dependencies: ['setup'],
      },
      {
        name: 'webkit',
        use: devices['Desktop Safari'],
        dependencies: ['setup'],
      },
    ],
  });

• New method expect.configure to create pre-configured expect instance with its own defaults such as timeout and soft.

  const slowExpect = expect.configure({ timeout: 10000 });
  await slowExpect(locator).toHaveText('Submit');
  
  // Always do soft assertions.
  const softExpect = expect.configure({ soft: true });

• New options stderr and stdout in testConfig.webServer to configure output handling:

  // playwright.config.ts
  import { defineConfig } from '@playwright/test';
  
  export default defineConfig({
    // Run your local dev server before starting the tests
    webServer: {
      command: 'npm run start',
      url: 'http://127.0.0.1:3000',
      reuseExistingServer: !process.env.CI,
      stdout: 'pipe',
      stderr: 'pipe',
    },
  });

• New locator.and() to create a locator that matches both locators.

  const button = page.getByRole('button').and(page.getByTitle('Subscribe'));

• New events browserContext.on('console') and browserContext.on('dialog') to subscribe to any dialogs
  and console messages from any page from the given browser context. Use the new methods consoleMessage.page()
  and dialog.page() to pin-point event source.

⚠️ Breaking changes

• npx playwright test no longer works if you install both playwright and @playwright/test. There's no need
  to install both, since you can always import browser automation APIs from @playwright/test directly:

  // automation.ts
  import { chromium, firefox, webkit } from '@playwright/test';
  /* ... */

• Node.js 14 is no longer supported since it reached its end-of-life on April 30, 2023.

Browser Versions

• Chromium 114.0.5735.26
• Mozilla Firefox 113.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 113
• Microsoft Edge 113

v1.33.0

Playwright v1.33 & v1.34 updates

Locators Update

• Use locator.or() to create a locator that matches either of the two locators.
  Consider a scenario where you'd like to click on a "New email" button, but sometimes a security settings dialog shows up instead.
  In this case, you can wait for either a "New email" button, or a dialog and act accordingly:

  const newEmail = page.getByRole('button', { name: 'New' });
  const dialog = page.getByText('Confirm security settings');
  await expect(newEmail.or(dialog)).toBeVisible();
  if (await dialog.isVisible())
    await page.getByRole('button', { name: 'Dismiss' }).click();
  await newEmail.click();

• Use new options hasNot and hasNotText in locator.filter()
  to find elements that do not match certain conditions.

  const rowLocator = page.locator('tr');
  await rowLocator
      .filter({ hasNotText: 'text in column 1' })
      .filter({ hasNot: page.getByRole('button', { name: 'column 2 button' }) })
      .screenshot();

• Use new web-first assertion locatorAssertions.toBeAttached() to ensure that the element
  is present in the page's DOM. Do not confuse with the locatorAssertions.toBeVisible() that ensures that
  element is both attached & visible.

New APIs

• locator.or()
• New option hasNot in locator.filter()
• New option hasNotText in locator.filter()
• locatorAssertions.toBeAttached()
• New option timeout in route.fetch()
• reporter.onExit()

⚠️ Breaking change

• The mcr.microsoft.com/playwright:v1.33.0 now serves a Playwright image based on Ubuntu Jammy.
  To use the focal-based image, please use mcr.microsoft.com/playwright:v1.33.0-focal instead.

Browser Versions

• Chromium 113.0.5672.53
• Mozilla Firefox 112.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 112
• Microsoft Edge 112

v1.32.3

Highlights

#22144 - [BUG] WebServer only starting after timeout
#22191 - chore: allow reusing browser between the tests
#22215 - [BUG] Tests failing in toPass often marked as passed

Browser Versions

• Chromium 112.0.5615.29
• Mozilla Firefox 111.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 111
• Microsoft Edge 111

v1.32.2

Highlights

#21993 - [BUG] Browser crash when using Playwright VSC extension and trace-viewer enabled in config
#22003 - [Feature] Make Vue component mount props less restrictive
#22089 - [REGRESSION]: Tests failing with "Error: tracing.stopChunk"

Browser Versions

• Chromium 112.0.5615.29
• Mozilla Firefox 111.0
• WebKit 16.4

This version was also tested against the following stable channels:

• Google Chrome 111
• Microsoft Edge 111