v1.23.3

Highlights

This patch includes the following bug fixes:

#15557 - [REGRESSION]: Event Listeners not being removed if same handler is used for different events

Browser Versions

• Chromium 104.0.5112.20
• Mozilla Firefox 100.0.2
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 103
• Microsoft Edge 103

v1.23.2

Highlights

This patch includes the following bug fixes:

#15273 - [BUG] LaunchOptions config has no effect after update to v1.23.0
#15351 - [REGRESSION]: Component testing project does not compile anymore
#15431 - [BUG] Regression: page.on('console') is ignored in 1.23

Browser Versions

• Chromium 104.0.5112.20
• Mozilla Firefox 100.0.2
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 103
• Microsoft Edge 103

v1.23.1

Highlights

This patch includes the following bug fixes:

#15219 - [REGRESSION]: playwright-core 1.23.0 issue with 'TypeError [ERR_INVALID_ARG_TYPE]: The "listener" argument'

Browser Versions

• Chromium 104.0.5112.20
• Mozilla Firefox 100.0.2
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 103
• Microsoft Edge 103

v1.23.0

Playwright v1.23 updates

Network Replay

Now you can record network traffic into a HAR file and re-use the data in your tests.

To record network into HAR file:

npx playwright open --save-har=github.har.zip https://github.com/microsoft

Alternatively, you can record HAR programmatically:

const context = await browser.newContext({
  recordHar: { path: 'github.har.zip' }
});
// ... do stuff ...
await context.close();

Use the new methods page.routeFromHAR() or browserContext.routeFromHAR() to serve matching responses from the HAR file:

await context.routeFromHAR('github.har.zip');

Read more in our documentation.

Advanced Routing

You can now use route.fallback() to defer routing to other handlers.

Consider the following example:

// Remove a header from all requests.
test.beforeEach(async ({ page }) => {
  await page.route('**/*', route => {
    const headers = route.request().headers();
    delete headers['if-none-match'];
    route.fallback({ headers });
  });
});

test('should work', async ({ page }) => {
  await page.route('**/*', route => {
    if (route.request().resourceType() === 'image')
      route.abort();
    else
      route.fallback();
  });
});

Note that the new methods page.routeFromHAR() and browserContext.routeFromHAR() also participate in routing and could be deferred to.

Web-First Assertions Update

• New method expect(locator).toHaveValues() that asserts all selected values of <select multiple> element.
• Methods expect(locator).toContainText() and expect(locator).toHaveText() now accept ignoreCase option.

Component Tests Update

• Support for Vue2 via the @playwright/experimental-ct-vue2 package.
• Support for component tests for create-react-app with components in .js files.

Read more about component testing with Playwright.

Miscellaneous

• If there's a service worker that's in your way, you can now easily disable it with a new context option serviceWorkers:

  // playwright.config.ts
  export default {
    use: {
      serviceWorkers: 'block',
    }
  }

• Using .zip path for recordHar context option automatically zips the resulting HAR:

  const context = await browser.newContext({
    recordHar: {
      path: 'github.har.zip',
    }
  });

• If you intend to edit HAR by hand, consider using the "minimal" HAR recording mode
  that only records information that is essential for replaying:

  const context = await browser.newContext({
    recordHar: {
      path: 'github.har.zip',
      mode: 'minimal',
    }
  });

• Playwright now runs on Ubuntu 22 amd64 and Ubuntu 22 arm64. We also publish new docker image mcr.microsoft.com/playwright:v1.23.0-focal.

⚠️ Breaking Changes ⚠️

WebServer is now considered "ready" if request to the specified port has any of the following HTTP status codes:

• 200-299
• 300-399 (new)
• 400, 401, 402, 403 (new)

v1.22.2

Highlights

This patch includes the following bug fixes:

#14254 - [BUG] focus() function in version 1.22 closes dropdown (not of select type) instead of just focus on the option

Browser Versions

• Chromium 102.0.5005.40
• Mozilla Firefox 99.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 101
• Microsoft Edge 101

v1.22.1

Highlights

This patch includes the following bug fixes:

#14186 - [BUG] expect.toHaveScreenshot() generates an argument error

Browser Versions

• Chromium 102.0.5005.40
• Mozilla Firefox 99.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 101
• Microsoft Edge 101

v1.22.0

Introducing Component Testing (preview)

Playwright Test can now test your React, Vue.js or Svelte components. You can use all the features of Playwright Test (such as parallelization, emulation & debugging) while running components in real browsers.

Component Tests (Preview)

Here is what a typical component test looks like:

// App.spec.tsx
import { test, expect } from '@playwright/experimental-ct-react';
import App from './App';

// Let's test component in a dark scheme!
test.use({ colorScheme: 'dark' });

test('should render', async ({ mount }) => {
  const component = await mount(<App></App>);

  // As with any Playwright test, assert locator text.
  await expect(component).toContainText('React');
  // Or do a screenshot 🚀
  await expect(component).toHaveScreenshot();
  // Or use any Playwright method
  await component.click();
});

Read more in our documentation.

---

Playwright v1.22 updates

Locators Update

• Role selectors allow selecting elements by their ARIA role, ARIA attributes and accessible name.

  // Click a button with accessible name "log in"
  await page.click('role=button[name="log in"]')

  Read more in our documentation.

• New locator.filter([options]) API to filter an existing locator

  const buttons = page.locator('role=button');
  // ...
  const submitButton = buttons.filter({ hasText: 'Submit' });
  await submitButton.click();

Screenshots Update

New web-first assertions expect(page).toHaveScreenshot() and expect(locator).toHaveScreenshot() that wait for screenshot stabilization and enhances test reliability.

The new assertions has screenshot-specific defaults, such as:

• disables animations
• uses CSS scale option

await page.goto('https://playwright.dev');
await expect(page).toHaveScreenshot();

The new expect(page).toHaveScreenshot() saves screenshots at the same location as expect(screenshot).toMatchSnapshot().

Browser Versions

• Chromium 102.0.5005.40
• Mozilla Firefox 99.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 101
• Microsoft Edge 101

v1.21.1

Highlights

This patch includes the following bug fixes:

#13597 - [BUG] fullyParallel created too many workers, slowing down test run
#13530 - [REGRESSION]: Pull request #12877 prevents the library from being used on any linux distro that is not Ubuntu

Browser Versions

• Chromium 101.0.4951.26
• Mozilla Firefox 98.0.2
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 100
• Microsoft Edge 100

v1.21.0

Playwright v1.21 updates

Highlights

• New experimental role selectors that allow selecting elements by their ARIA role, ARIA attributes and accessible name.

  // Click a button with accessible name "log in"
  await page.click('role=button[name="log in"]')

  To use role selectors, make sure to pass PLAYWRIGHT_EXPERIMENTAL_FEATURES=1 environment variable:

  // playwright.config.js
  process.env.PLAYWRIGHT_EXPERIMENTAL_FEATURES = '1';
  module.exports = {
    /* ... */
  };

  Read more in our documentation.

• New scale option in Page.screenshot for smaller sized screenshots.

• New caret option in Page.screenshot to control text caret. Defaults to "hide".

• New method expect.poll to wait for an arbitrary condition:

  // Poll the method until it returns an expected result.
  await expect.poll(async () => {
    const response = await page.request.get('https://api.example.com');
    return response.status();
  }).toBe(200);

  expect.poll supports most synchronous matchers, like .toBe(), .toContain(), etc.
  Read more in our documentation.

Behavior Changes

• ESM support when running TypeScript tests is now enabled by default. The PLAYWRIGHT_EXPERIMENTAL_TS_ESM env variable is
  no longer required.
• The mcr.microsoft.com/playwright docker image no longer contains Python. Please use mcr.microsoft.com/playwright/python
  as a Playwright-ready docker image with pre-installed Python.
• Playwright now supports large file uploads (100s of MBs) via Locator.setInputFiles API.

Browser Versions

• Chromium 101.0.4951.26
• Mozilla Firefox 98.0.2
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 100
• Microsoft Edge 100

v1.20.2

Highlights

This patch includes the following bug fixes:

#13078 - [BUG] Extension required when importing other files with type="module"
#13099 - [BUG] beforeAll is called before each test (fullyParallel)
#13204 - [BUG] mask stalls the screenshot

Browser Versions

• Chromium 101.0.4921.0
• Mozilla Firefox 97.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 99
• Microsoft Edge 99