Releases: microsoft/playwright
v1.48.0
WebSocket routing
New methods page.routeWebSocket() and browserContext.routeWebSocket() allow to intercept, modify and mock WebSocket connections initiated in the page. Below is a simple example that mocks WebSocket communication by responding to a "request"
with a "response"
.
await page.routeWebSocket('/ws', ws => {
ws.onMessage(message => {
if (message === 'request')
ws.send('response');
});
});
See WebSocketRoute for more details.
UI updates
- New "copy" buttons for annotations and test location in the HTML report.
- Route method calls like route.fulfill() are not shown in the report and trace viewer anymore. You can see which network requests were routed in the network tab instead.
- New "Copy as cURL" and "Copy as fetch" buttons for requests in the network tab.
Miscellaneous
- Option
form
and similar ones now accept FormData. - New method page.requestGC() may help detect memory leaks.
- New option
location
to pass custom step location. - Requests made by APIRequestContext now record detailed timing and security information in the HAR.
Browser Versions
- Chromium 130.0.6723.19
- Mozilla Firefox 130.0
- WebKit 18.0
This version was also tested against the following stable channels:
- Google Chrome 129
- Microsoft Edge 129
v1.47.2
Highlights
#32699 [REGRESSION]: fix(codegen): use content_frame property in python/.NET
#32706 [REGRESSION]: page.pause() does not pause test timeout after 1.47
#32661 - fix(trace-viewer): time delta between local and remote actions
Browser Versions
- Chromium 129.0.6668.29
- Mozilla Firefox 130.0
- WebKit 18.0
This version was also tested against the following stable channels:
- Google Chrome 128
- Microsoft Edge 128
v1.47.1
Highlights
#32480 - [REGRESSION]: tsconfig.json's compilerOptions.paths no longer working in 1.47
#32552 - [REGRESSION]: broken UI in Trace Viewer while showing network response body
Browser Versions
- Chromium 129.0.6668.29
- Mozilla Firefox 130.0
- WebKit 18.0
This version was also tested against the following stable channels:
- Google Chrome 128
- Microsoft Edge 128
v1.47.0
Network Tab improvements
The Network tab in the UI mode and trace viewer has several nice improvements:
- filtering by asset type and URL
- better display of query string parameters
- preview of font assets
Credit to @kubajanik for these wonderful improvements!
--tsconfig
CLI option
By default, Playwright will look up the closest tsconfig for each imported file using a heuristic. You can now specify a single tsconfig file in the command line, and Playwright will use it for all imported files, not only test files:
# Pass a specific tsconfig
npx playwright test --tsconfig tsconfig.test.json
APIRequestContext now accepts URLSearchParams
and string
as query parameters
You can now pass URLSearchParams
and string
as query parameters to APIRequestContext:
test('query params', async ({ request }) => {
const searchParams = new URLSearchParams();
searchParams.set('userId', 1);
const response = await request.get(
'https://jsonplaceholder.typicode.com/posts',
{
params: searchParams // or as a string: 'userId=1'
}
);
// ...
});
Miscellaneous
- The
mcr.microsoft.com/playwright:v1.47.0
now serves a Playwright image based on Ubuntu 24.04 Noble.
To use the 22.04 jammy-based image, please usemcr.microsoft.com/playwright:v1.47.0-jammy
instead. - The
:latest
/:focal
/:jammy
tag for Playwright Docker images is no longer being published. Pin to a specific version for better stability and reproducibility. - New option
behavior
in page.removeAllListeners(), browser.removeAllListeners() and browserContext.removeAllListeners() to wait for ongoing listeners to complete. - TLS client certificates can now be passed from memory by passing
cert
andkey
as buffers instead of file paths. - Attachments with a
text/html
content type can now be opened in a new tab in the HTML report. This is useful for including third-party reports or other HTML content in the Playwright test report and distributing it to your team. noWaitAfter
in locator.selectOption() was deprecated.- We've seen reports of WebGL in Webkit misbehaving on GitHub Actions
macos-13
. We recommend upgrading GitHub Actions tomacos-14
.
Browser Versions
- Chromium 129.0.6668.29
- Mozilla Firefox 130.0
- WebKit 18.0
This version was also tested against the following stable channels:
- Google Chrome 128
- Microsoft Edge 128
v1.46.1
Highlights
#32004 - [REGRESSION]: Client Certificates don't work with Microsoft IIS
#32004 - [REGRESSION]: Websites stall on TLS handshake errors when using Client Certificates
#32146 - [BUG]: Credential scanners warn about internal socks-proxy TLS certificates
#32056 - [REGRESSION]: 1.46.0 (TypeScript) - custom fixtures extend no longer chainable
#32070 - [Bug]: --only-changed flag and project dependencies
#32188 - [Bug]: --only-changed with shallow clone throws "unknown revision" error
Browser Versions
- Chromium 128.0.6613.18
- Mozilla Firefox 128.0
- WebKit 18.0
This version was also tested against the following stable channels:
- Google Chrome 127
- Microsoft Edge 127
v1.46.0
TLS Client Certificates
Playwright now allows to supply client-side certificates, so that server can verify them, as specified by TLS Client Authentication.
When client certificates are specified, all browser traffic is routed through a proxy that establishes the secure TLS connection, provides client certificates to the server and validates server certificates.
The following snippet sets up a client certificate for https://example.com
:
import { defineConfig } from '@playwright/test';
export default defineConfig({
// ...
use: {
clientCertificates: [{
origin: 'https://example.com',
certPath: './cert.pem',
keyPath: './key.pem',
passphrase: 'mysecretpassword',
}],
},
// ...
});
You can also provide client certificates to a particular test project or as a parameter of browser.newContext() and apiRequest.newContext().
--only-changed
cli option
New CLI option --only-changed
allows to only run test files that have been changed since the last git commit or from a specific git "ref".
# Only run test files with uncommitted changes
npx playwright test --only-changed
# Only run test files changed relative to the "main" branch
npx playwright test --only-changed=main
Component Testing: New router
fixture
This release introduces an experimental router
fixture to intercept and handle network requests in component testing.
There are two ways to use the router fixture:
- Call
router.route(url, handler)
that behaves similarly to page.route(). - Call
router.use(handlers)
and pass MSW library request handlers to it.
Here is an example of reusing your existing MSW handlers in the test.
import { handlers } from '@src/mocks/handlers';
test.beforeEach(async ({ router }) => {
// install common handlers before each test
await router.use(...handlers);
});
test('example test', async ({ mount }) => {
// test as usual, your handlers are active
// ...
});
This fixture is only available in component tests.
UI Mode / Trace Viewer Updates
- Test annotations are now shown in UI mode.
- Content of text attachments is now rendered inline in the attachments pane.
- New setting to show/hide routing actions like route.continue().
- Request method and status are shown in the network details tab.
- New button to copy source file location to clipboard.
- Metadata pane now displays the
baseURL
.
Miscellaneous
- New
maxRetries
option in apiRequestContext.fetch() which retries on theECONNRESET
network error. - New option to box a fixture to minimize the fixture exposure in test reports and error messages.
- New option to provide a custom fixture title to be used in test reports and error messages.
Possibly breaking change
Fixture values that are array of objects, when specified in the test.use()
block, may require being wrapped into a fixture tuple. This is best seen on the example:
import { test as base } from '@playwright/test';
// Define an option fixture that has an "array of objects" value
type User = { name: string, password: string };
const test = base.extend<{ users: User[] }>({
users: [ [], { option: true } ],
});
// Specify option value in the test.use block.
test.use({
// WRONG: this syntax may not work for you
users: [
{ name: 'John Doe', password: 'secret' },
{ name: 'John Smith', password: 's3cr3t' },
],
// CORRECT: this syntax will work. Note extra [] around the value, and the "scope" property.
users: [[
{ name: 'John Doe', password: 'secret' },
{ name: 'John Smith', password: 's3cr3t' },
], { scope: 'test' }],
});
test('example test', async () => {
// ...
});
Browser Versions
- Chromium 128.0.6613.18
- Mozilla Firefox 128.0
- WebKit 18.0
This version was also tested against the following stable channels:
- Google Chrome 127
- Microsoft Edge 127
v1.45.3
Highlights
#31764 - [Bug]: some actions do not appear in the trace file
microsoft/playwright-java#1617 - [Bug]: Traceviewer not reporting all actions
Browser Versions
- Chromium 127.0.6533.5
- Mozilla Firefox 127.0
- WebKit 17.4
This version was also tested against the following stable channels:
- Google Chrome 126
- Microsoft Edge 126
v1.45.2
Highlights
#31613 - [REGRESSION]: Trace is not showing any screenshots nor test name
#31601 - [REGRESSION]: missing trace for 2nd browser
#31541 - [REGRESSION]: Failing tests have a trace with no images and with steps missing
Browser Versions
- Chromium 127.0.6533.5
- Mozilla Firefox 127.0
- WebKit 17.4
This version was also tested against the following stable channels:
- Google Chrome 126
- Microsoft Edge 126
v1.45.1
Highlights
#31473 - [REGRESSION]: Playwright raises an error ENOENT: no such file or directory, open 'test-results/.playwright-artifacts-0/hash.zip' with Electron
#31442 - [REGRESSION]: Locators of elements changing from/to hidden have operations hanging when using --disable-web-security
#31431 - [REGRESSION]: NewTab doesn't work properly with Chrome with --disable-web-security
#31425 - [REGRESSION]: beforeEach hooks are not skipped when describe condition depends on fixtures
#31491 - [REGRESSION]: @playwright/experimental-ct-react
doesn't work with VSCode extension and PNPM
Browser Versions
- Chromium 127.0.6533.5
- Mozilla Firefox 127.0
- WebKit 17.4
This version was also tested against the following stable channels:
- Google Chrome 126
- Microsoft Edge 126
v1.45.0
Clock
Utilizing the new Clock API allows to manipulate and control time within tests to verify time-related behavior. This API covers many common scenarios, including:
- testing with predefined time;
- keeping consistent time and timers;
- monitoring inactivity;
- ticking through time manually.
// Initialize clock and let the page load naturally.
await page.clock.install({ time: new Date('2024-02-02T08:00:00') });
await page.goto('http://localhost:3333');
// Pretend that the user closed the laptop lid and opened it again at 10am,
// Pause the time once reached that point.
await page.clock.pauseAt(new Date('2024-02-02T10:00:00'));
// Assert the page state.
await expect(page.getByTestId('current-time')).toHaveText('2/2/2024, 10:00:00 AM');
// Close the laptop lid again and open it at 10:30am.
await page.clock.fastForward('30:00');
await expect(page.getByTestId('current-time')).toHaveText('2/2/2024, 10:30:00 AM');
See the clock guide for more details.
Test runner
-
New CLI option
--fail-on-flaky-tests
that sets exit code to1
upon any flaky tests. Note that by default, the test runner exits with code0
when all failed tests recovered upon a retry. With this option, the test run will fail in such case. -
New enviroment variable
PLAYWRIGHT_FORCE_TTY
controls whether built-inlist
,line
anddot
reporters assume a live terminal. For example, this could be useful to disable tty behavior when your CI environment does not handle ANSI control sequences well. Alternatively, you can enable tty behavior even when to live terminal is present, if you plan to post-process the output and handle control sequences.# Avoid TTY features that output ANSI control sequences PLAYWRIGHT_FORCE_TTY=0 npx playwright test # Enable TTY features, assuming a terminal width 80 PLAYWRIGHT_FORCE_TTY=80 npx playwright test
-
New options testConfig.respectGitIgnore and testProject.respectGitIgnore control whether files matching
.gitignore
patterns are excluded when searching for tests. -
New property
timeout
is now available for custom expect matchers. This property takes into accountplaywright.config.ts
andexpect.configure()
.import { expect as baseExpect } from '@playwright/test'; export const expect = baseExpect.extend({ async toHaveAmount(locator: Locator, expected: number, options?: { timeout?: number }) { // When no timeout option is specified, use the config timeout. const timeout = options?.timeout ?? this.timeout; // ... implement the assertion ... }, });
Miscellaneous
-
Method locator.setInputFiles() now supports uploading a directory for
<input type=file webkitdirectory>
elements.await page.getByLabel('Upload directory').setInputFiles(path.join(__dirname, 'mydir'));
-
Multiple methods like locator.click() or locator.press() now support a
ControlOrMeta
modifier key. This key maps toMeta
on macOS and maps toControl
on Windows and Linux.// Press the common keyboard shortcut Control+S or Meta+S to trigger a "Save" operation. await page.keyboard.press('ControlOrMeta+S');
-
New property
httpCredentials.send
in apiRequest.newContext() that allows to either always send theAuthorization
header or only send it in response to401 Unauthorized
. -
New option
reason
in apiRequestContext.dispose() that will be included in the error message of ongoing operations interrupted by the context disposal. -
New option
host
in browserType.launchServer() allows to accept websocket connections on a specific address instead of unspecified0.0.0.0
. -
Playwright now supports Chromium, Firefox and WebKit on Ubuntu 24.04.
-
v1.45 is the last release to receive WebKit update for macOS 12 Monterey. Please update macOS to keep using the latest WebKit.
Browser Versions
- Chromium 127.0.6533.5
- Mozilla Firefox 127.0
- WebKit 17.4
This version was also tested against the following stable channels:
- Google Chrome 126
- Microsoft Edge 126