New APIs
- New property [`TestProject.dependencies`](https://playwright.dev/docs/api/class-testproject#test-project-dependencies) to configure dependencies between projects.
Using dependencies allows global setup to produce traces and other artifacts,
see the setup steps in the test report and more.
js
// playwright.config.ts
import { defineConfig } from 'playwright/test';
export default defineConfig({
projects: [
{
name: 'setup',
testMatch: /global.setup\.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 assertion [`expect(locator).toBeInViewport()`](https://playwright.dev/docs/api/class-locatorassertions#locator-assertions-to-be-in-viewport) ensures that locator points to an element that intersects viewport, according to the [intersection observer API](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API).
js
const button = page.getByRole('button');
// Make sure at least some part of element intersects viewport.
await expect(button).toBeInViewport();
// Make sure element is fully outside of viewport.
await expect(button).not.toBeInViewport();
// Make sure that at least half of the element intersects viewport.
await expect(button).toBeInViewport({ ratio: 0.5 });
Miscellaneous
- DOM snapshots in trace viewer can be now opened in a separate window.
- New method `defineConfig` to be used in `playwright.config`.
- New option `maxRedirects` for method [`Route.fetch`](https://playwright.dev/docs/api/class-route#route-fetch).
- Playwright now supports Debian 11 arm64.
- Official [docker images](https://playwright.dev/docs/docker) now include Node 18 instead of Node 16.
⚠️ Breaking change in component tests
Note: **component tests only**, does not affect end-to-end tests.
`playwright-ct.config` configuration file for [component testing](https://playwright.dev/docs/test-components) now requires calling `defineConfig`.
js
// Before
import { type PlaywrightTestConfig, devices } from 'playwright/experimental-ct-react';
const config: PlaywrightTestConfig = {
// ... config goes here ...
};
export default config;
Replace `config` variable definition with `defineConfig` call:
js
// After
import { defineConfig, devices } from 'playwright/experimental-ct-react';
export default defineConfig({
// ... config goes here ...
});
Browser Versions
* Chromium 111.0.5563.19
* Mozilla Firefox 109.0
* WebKit 16.4
This version was also tested against the following stable channels:
* Google Chrome 110
* Microsoft Edge 110