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

v1.20.1

Highlights

This patch includes the following bug fixes:

#12711 - [REGRESSION] Page.screenshot hangs on some sites
#12807 - [BUG] Cookies get assigned before fulfilling a response
#12814 - [Question] how to use expect.any in playwright
#12821 - [BUG] Chromium: Cannot click, element intercepts pointer events
#12836 - [REGRESSION]: Tests not detected as ES module in v1.20
#12862 - [Feature] Allow to use toMatchSnapshot for file formats other than txt (e.g. csv)
#12887 - [BUG] Locator.count() with _vue selector with Repro
#12940 - [BUG] npm audit - High Severity vulnerability in json5 package forcing to install Playwright 1.18.1
#12974 - [BUG] Regression - chromium browser closes during test or debugging session on macos

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

v1.20.0

Playwright v1.20 updates

Highlights

• New options for methods page.screenshot(), locator.screenshot() and elementHandle.screenshot():

  • Option animations: "disabled" rewinds all CSS animations and transitions to a consistent state.
  • Option mask: Locator[] masks given elements, overlaying them with pink #FF00FF boxes.

• expect().toMatchSnapshot() now supports anonymous snapshots: when snapshot name is missing, Playwright Test will generate one
  automatically:

  expect('Web is Awesome <3').toMatchSnapshot();

• New maxDiffPixels and maxDiffPixelRatio options for fine-grained screenshot comparison using expect().toMatchSnapshot():

  expect(await page.screenshot()).toMatchSnapshot({
    maxDiffPixels: 27, // allow no more than 27 different pixels.
  });

  It is most convenient to specify maxDiffPixels or maxDiffPixelRatio once in TestConfig.expect.

• Playwright Test now adds TestConfig.fullyParallel mode. By default, Playwright Test parallelizes between files. In fully parallel mode, tests inside a single file are also run in parallel. You can also use --fully-parallel command line flag.

  // playwright.config.ts
  export default {
    fullyParallel: true,
  };

• TestProject.grep and TestProject.grepInvert are now configurable per project. For example, you can now
  configure smoke tests project using grep:

  // playwright.config.ts
  export default {
    projects: [
      {
        name: 'smoke tests',
        grep: /@smoke/,
      },
    ],
  };

• Trace Viewer now shows API testing requests.

• locator.highlight() visually reveals element(s) for easier debugging.

Announcements

• We now ship a designated Python docker image mcr.microsoft.com/playwright/python. Please switch over to it if you use Python. This is the last release that includes Python inside our javascript mcr.microsoft.com/playwright docker image.
• v1.20 is the last release to receive WebKit update for macOS 10.15 Catalina. Please update MacOS to keep using latest & greatest WebKit!

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

v1.19.2

Highlights

This patch includes the following bug fixes:

#12091 - [BUG] playwright 1.19.0 generates more than 1 trace file per test
#12106 - [BUG] Error: EBUSY: resource busy or locked when using volumes in docker-compose with playwright 1.19.0 and mcr.microsoft.com/playwright:v1.15.0-focal

Browser Versions

• Chromium 100.0.4863.0
• Mozilla Firefox 96.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 98
• Microsoft Edge 98

v1.19.1

Highlights

This patch includes the following bug fixes:

#12075 - [Question] After update to 1.19 firefox fails to run
#12090 - [BUG] did something change on APIRequest/Response APIs ?

Browser Versions

• Chromium 100.0.4863.0
• Mozilla Firefox 96.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 98
• Microsoft Edge 98

v1.19.0

Playwright v1.19 updates

Playwright Test Updates

Soft assertions

Playwright Test v1.19 now supports soft assertions. Failed soft assertions do not terminate test execution, but mark the test as failed. Read more in our documentation.

// Make a few checks that will not stop the test when failed...
await expect.soft(page.locator('#status')).toHaveText('Success');
await expect.soft(page.locator('#eta')).toHaveText('1 day');

// ... and continue the test to check more things.
await page.locator('#next-page').click();
await expect.soft(page.locator('#title')).toHaveText('Make another order');

Custom error messages

You can now specify a custom error message as a second argument to the expect and expect.soft functions, for example:

await expect(page.locator('text=Name'), 'should be logged in').toBeVisible();

The error would look like this:

    Error: should be logged in

    Call log:
      - expect.toBeVisible with timeout 5000ms
      - waiting for selector "text=Name"


      2 |
      3 | test('example test', async({ page }) => {
    > 4 |   await expect(page.locator('text=Name'), 'should be logged in').toBeVisible();
        |                                                                  ^
      5 | });
      6 |

Parallel mode in file

By default, tests in a single file are run in order. If you have many independent tests in a single file, you can now
run them in parallel with method: test.describe.configure:

import { test } from '@playwright/test';

test.describe.configure({ mode: 'parallel' });

test('parallel 1', async () => {});
test('parallel 2', async () => {});

⚠️ Potentially breaking change in Playwright Test Global Setup

It is unlikely that this change will affect you, no action is required if your tests keep running as they did.

We've noticed that in rare cases, the set of tests to be executed was configured in the global setup by means of the environment variables. We also noticed some applications that were post processing the reporters' output in the global teardown. If you are doing one of the two, learn more

Locator Updates

Locator now supports a has option that makes sure it contains another locator inside:

await page.locator('article', {
  has: page.locator('.highlight'),
}).locator('button').click();

The snippet above will select article that has highlight in it and will press the button in it.
Read more in locator documentation

Other Updates

• New method: Locator.page
• method: Page.screenshot and method: Locator.screenshot now automatically hides blinking caret
• Playwright Codegen now generates locators and frame locators
• New option url in testConfig.webServer to ensure your web server is ready before running the tests
• New property: TestInfo.errors and property: TestResult.errors that contain all failed assertions and soft assertions.

Browser Versions

• Chromium 100.0.4863.0
• Mozilla Firefox 96.0.1
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 98
• Microsoft Edge 98

---

v1.18.1

Highlights

This patch includes improvements to the TypeScript support and the following bug fixes:

#11550 - [REGRESSION]: Errors inside route handler does not lead to unhandled rejections anymore
#11552 - [BUG] Could not resolve "C:\repo\framework\utils" in file C:\repo\tests\test.ts.

Browser Versions

• Chromium 99.0.4812.0
• Mozilla Firefox 95.0
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 97
• Microsoft Edge 97

v1.18.0

Playwright v1.18 updates

Locator Improvements

• locator.dragTo(locator)
• expect(locator).toBeChecked({ checked })
• Each locator can now be optionally filtered by the text it contains:

  await page.locator('li', { hasText: 'my item' }).locator('button').click();

  Read more in locator documentation.

Testing API improvements

• expect(response).toBeOK()
• testInfo.attach()
• test.info()

Improved TypeScript Support

1. Playwright Test now respects tsconfig.json's baseUrl and paths, so you can use aliases
2. There is a new environment variable PW_EXPERIMENTAL_TS_ESM that allows importing ESM modules in your TS code, without the need for the compile step. Don't forget the .js suffix when you are importing your esm modules. Run your tests as follows:

npm i --save-dev @playwright/test@1.18.0
PW_EXPERIMENTAL_TS_ESM=1 npx playwright test

Create Playwright

The npm init playwright command is now generally available for your use:

# Run from your project's root directory
npm init playwright
# Or create a new project
npm init playwright new-project

This will scaffold everything needed to get started with Playwright Test: configuration file, optionally add examples, a GitHub Action workflow and a first test example.spec.ts.

New APIs & changes

• new testCase.repeatEachIndex API
• acceptDownloads option now defaults to true

Breaking change: custom config options

Custom config options are a convenient way to parametrize projects with different values. Learn more in the parametrization guide.

Previously, any fixture introduced through test.extend could be overridden in the testProject.use config section. For example,

// WRONG: THIS SNIPPET DOES NOT WORK SINCE v1.18.

// fixtures.js
const test = base.extend({
  myParameter: 'default',
});

// playwright.config.js
module.exports = {
  use: {
    myParameter: 'value',
  },
};

The proper way to make a fixture parametrized in the config file is to specify option: true when defining the fixture. For example,

// CORRECT: THIS SNIPPET WORKS SINCE v1.18.

// fixtures.js
const test = base.extend({
  // Fixtures marked as "option: true" will get a value specified in the config,
  // or fallback to the default value.
  myParameter: ['default', { option: true }],
});

// playwright.config.js
module.exports = {
  use: {
    myParameter: 'value',
  },
};

Browser Versions

• Chromium 99.0.4812.0
• Mozilla Firefox 95.0
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 97
• Microsoft Edge 97

---

(1.18.0-beta-1642620709000)

v1.18.0-rc1

Locator Improvements

• locator.dragTo(locator)
• expect(locator).toBeChecked({ checked })
• Each locator can now be optionally filtered by the text it contains:

  await page.locator('li', { hasText: 'my item' }).locator('button').click();

  Read more in locator documentation.

Testing API improvements

• expect(response).toBeOK()
• testInfo.attach()
• test.info()

Improved TypeScript Support

1. Playwright Test now respects tsconfig.json's baseUrl and paths, so you can use aliases
2. There is a new environment variable PW_EXPERIMENTAL_TS_ESM that allows importing ESM modules in your TS code, without the need for the compile step. Don't forget the .js suffix when you are importing your esm modules. Run your tests as follows:

npm i --save-dev @playwright/test@1.18.0-rc1
PW_EXPERIMENTAL_TS_ESM=1 npx playwright test

Create Playwright

The npm init playwright command is now generally available for your use:

# Run from your project's root directory
npm init playwright
# Or create a new project
npm init playwright new-project

This will scaffold everything needed to get started with Playwright Test: configuration file, optionally add examples, a GitHub Action workflow and a first test example.spec.ts.

New APIs & changes

• new testCase.repeatEachIndex API
• new option fixtures
• acceptDownloads option now defaults to true

Browser Versions

• Chromium 99.0.4812.0
• Mozilla Firefox 95.0
• WebKit 15.4

This version was also tested against the following stable channels:

• Google Chrome 97
• Microsoft Edge 97

---