v1.42.0

microsoft/playwrightv1.42.0Feb 27, 2024by yury-s

AI Summary

Added test tags, annotations, and an experimental overlay handler for managing popups. Added project wildcard filtering and new PDF options.

Key Highlights

  • New test tag syntax and CLI filtering
  • Experimental page.addLocatorHandler for overlays
  • Project wildcard filter support
  • New PDF tagging and outlining options

Breaking Changes

  • Mixing test instances in the same suite is no longer supported

New Features

  • Test tags and annotations
  • page.addLocatorHandler()
  • Project wildcard filtering
  • expect.toPass timeout configuration
  • electronApplication.on('console') event
  • page.pdf() tagged and outline options

Full Release Notes

## New APIs
- **Test tags**

  [New tag syntax](https://playwright.dev/docs/test-annotations#tag-tests) for adding tags to the tests (@-tokens in the test title are still supported).
  
  ```js
  test('test customer login', { tag: ['@fast', '@login'] }, async ({ page }) => {
    // ...
  });
  ```
  
  Use `--grep` command line option to run only tests with certain tags.
  
  ```sh
  npx playwright test --grep @fast
  ```

- **Annotating skipped tests**

  [New annotation syntax](https://playwright.dev/docs/test-annotations#annotate-tests) for test annotations allows annotating the tests that do not run.
  
  ```js
  test('test full report', {
    annotation: [
      { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/23180' },
      { type: 'docs', description: 'https://playwright.dev/docs/test-annotations#tag-tests' },
    ],
  }, async ({ page }) => {
    // ...
  });
  ```

- **page.addLocatorHandler()**

> [!WARNING]
This feature is experimental, we are actively looking for the feedback based on your scenarios.

  New method [page.addLocatorHandler()](https://playwright.dev/docs/api/class-page#page-add-locator-handler) registers a callback that will be invoked when specified element becomes visible and may block Playwright actions. The callback can get rid of the overlay. Here is an example that closes a cookie dialog when it appears.
  
  ```js
  // Setup the handler.
  await page.addLocatorHandler(
      page.getByRole('heading', { name: 'Hej! You are in control of your cookies.' }),
      async () => {
        await page.getByRole('button', { name: 'Accept all' }).click();
      });
  // Write the test as usual.
  await page.goto('https://www.ikea.com/');
  await page.getByRole('link', { name: 'Collection of blue and white' }).click();
  await expect(page.getByRole('heading', { name: 'Light and easy' })).toBeVisible();
  ```

- **Project wildcard filter**
  Playwright command line [flag](https://playwright.dev/docs/test-cli#reference) now supports '*' wildcard when filtering by project.
  
  ```sh
  npx playwright test --project='*mobile*'
  ```

- **Other APIs**
  - expect(callback).toPass({ timeout })
    The timeout can now be configured by `expect.toPass.timeout` option [globally](https://playwright.dev/docs/api/class-testconfig#test-config-expect) or in [project config](https://playwright.dev/docs/api/class-testproject#test-project-expect)
    
  - electronApplication.on('console')
    [electronApplication.on('console')](https://playwright.dev/docs/api/class-electronapplication#electron-application-event-console) event is emitted when Electron main process calls console API methods.
  
    ```js
    electronApp.on('console', async msg => {
      const values = [];
      for (const arg of msg.args())
        values.push(await arg.jsonValue());
      console.log(...values);
    });
    await electronApp.evaluate(() => console.log('hello', 5, { foo: 'bar' }));
    ```
  - [page.pdf()](https://playwright.dev/docs/api/class-page#page-pdf) accepts two new options [`tagged`](https://playwright.dev/docs/api/class-page#page-pdf-option-tagged) and [`outline`](https://playwright.dev/docs/api/class-page#page-pdf-option-outline).

## Breaking changes

Mixing the test instances in the same suite is no longer supported. Allowing it was an oversight as it makes reasoning about the semantics unnecessarily hard.

```js
const test = baseTest.extend({ item: async ({}, use) => {} });
baseTest.describe('Admin user', () => {
  test('1', async ({ page, item }) => {});
  test('2', async ({ page, item }) => {});
});
```

## Announcements
* ⚠️ Ubuntu 18 is not supported anymore.

## Browser Versions
* Chromium 123.0.6312.4
* Mozilla Firefox 123.0
* WebKit 17.4

This version was also tested against the following stable channels:
* Google Chrome 122
* Microsoft Edge 123