From a0101740de04fb82ccb103541439e9977ee85a84 Mon Sep 17 00:00:00 2001 From: "microsoft-playwright-automation[bot]" <203992400+microsoft-playwright-automation[bot]@users.noreply.github.com> Date: Wed, 15 Jul 2026 10:43:21 +0000 Subject: [PATCH] feat(roll): roll to ToT Playwright (15-07-26) --- nodejs/docs/api/class-locatorassertions.mdx | 13 ++++++++++++- nodejs/docs/api/class-pageassertions.mdx | 13 ++++++++++++- nodejs/docs/test-snapshots.mdx | 6 ++++++ 3 files changed, 30 insertions(+), 2 deletions(-) diff --git a/nodejs/docs/api/class-locatorassertions.mdx b/nodejs/docs/api/class-locatorassertions.mdx index 3e84fbf037..f697e0a01b 100644 --- a/nodejs/docs/api/class-locatorassertions.mdx +++ b/nodejs/docs/api/class-locatorassertions.mdx @@ -833,6 +833,9 @@ This function will wait until two consecutive locator screenshots yield the same ```js const locator = page.getByRole('button'); await expect(locator).toHaveScreenshot('image.png'); + +// Store the snapshot in the WebP format. +await expect(locator).toHaveScreenshot('image.webp'); ``` Note that screenshot assertions only work with Playwright test runner. @@ -840,7 +843,7 @@ Note that screenshot assertions only work with Playwright test runner. **Arguments** - `name` [string] | [Array]<[string]># - Snapshot name. + Snapshot name. Must have a `.png` or `.webp` extension, the screenshot is captured in the corresponding format. Both formats are lossless. - `options` [Object] *(optional)* - `animations` "disabled" | "allow" *(optional)*# @@ -872,6 +875,9 @@ Note that screenshot assertions only work with Playwright test runner. When set to `"css"`, screenshot will have a single pixel per each css pixel on the page. For high-dpi devices, this will keep screenshots small. Using `"device"` option will produce a single pixel per each device pixel, so screenshots of high-dpi devices will be twice as large or even larger. Defaults to `"css"`. + - `signal` [AbortSignal] *(optional)* Added in: v1.62# + + An optional [`AbortSignal`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that can cancel the assertion. Aborting the signal fails the assertion like a timeout: if the signal is aborted while the assertion is retrying, or is already aborted before the assertion starts, the assertion fails without retrying further. - `stylePath` [string] | [Array]<[string]> *(optional)* Added in: v1.41# File name containing the stylesheet to apply while making the screenshot. This is where you can hide dynamic elements, make elements invisible or change their properties to help you creating repeatable screenshots. This stylesheet pierces the Shadow DOM and applies to the inner frames. @@ -893,6 +899,8 @@ Note that screenshot assertions only work with Playwright test runner. This function will wait until two consecutive locator screenshots yield the same result, and then compare the last screenshot with the expectation. +The snapshot is stored in the PNG format. To store it in the WebP format instead, pass a snapshot name with the `.webp` extension. + **Usage** ```js @@ -934,6 +942,9 @@ Note that screenshot assertions only work with Playwright test runner. When set to `"css"`, screenshot will have a single pixel per each css pixel on the page. For high-dpi devices, this will keep screenshots small. Using `"device"` option will produce a single pixel per each device pixel, so screenshots of high-dpi devices will be twice as large or even larger. Defaults to `"css"`. + - `signal` [AbortSignal] *(optional)* Added in: v1.62# + + An optional [`AbortSignal`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that can cancel the assertion. Aborting the signal fails the assertion like a timeout: if the signal is aborted while the assertion is retrying, or is already aborted before the assertion starts, the assertion fails without retrying further. - `stylePath` [string] | [Array]<[string]> *(optional)* Added in: v1.41# File name containing the stylesheet to apply while making the screenshot. This is where you can hide dynamic elements, make elements invisible or change their properties to help you creating repeatable screenshots. This stylesheet pierces the Shadow DOM and applies to the inner frames. diff --git a/nodejs/docs/api/class-pageassertions.mdx b/nodejs/docs/api/class-pageassertions.mdx index 0d95cc1b63..79270651b6 100644 --- a/nodejs/docs/api/class-pageassertions.mdx +++ b/nodejs/docs/api/class-pageassertions.mdx @@ -34,6 +34,9 @@ This function will wait until two consecutive page screenshots yield the same re ```js await expect(page).toHaveScreenshot('image.png'); + +// Store the snapshot in the WebP format. +await expect(page).toHaveScreenshot('image.webp'); ``` Note that screenshot assertions only work with Playwright test runner. @@ -41,7 +44,7 @@ Note that screenshot assertions only work with Playwright test runner. **Arguments** - `name` [string] | [Array]<[string]># - Snapshot name. + Snapshot name. Must have a `.png` or `.webp` extension, the screenshot is captured in the corresponding format. Both formats are lossless. - `options` [Object] *(optional)* - `animations` "disabled" | "allow" *(optional)*# @@ -91,6 +94,9 @@ Note that screenshot assertions only work with Playwright test runner. When set to `"css"`, screenshot will have a single pixel per each css pixel on the page. For high-dpi devices, this will keep screenshots small. Using `"device"` option will produce a single pixel per each device pixel, so screenshots of high-dpi devices will be twice as large or even larger. Defaults to `"css"`. + - `signal` [AbortSignal] *(optional)* Added in: v1.62# + + An optional [`AbortSignal`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that can cancel the assertion. Aborting the signal fails the assertion like a timeout: if the signal is aborted while the assertion is retrying, or is already aborted before the assertion starts, the assertion fails without retrying further. - `stylePath` [string] | [Array]<[string]> *(optional)* Added in: v1.41# File name containing the stylesheet to apply while making the screenshot. This is where you can hide dynamic elements, make elements invisible or change their properties to help you creating repeatable screenshots. This stylesheet pierces the Shadow DOM and applies to the inner frames. @@ -112,6 +118,8 @@ Note that screenshot assertions only work with Playwright test runner. This function will wait until two consecutive page screenshots yield the same result, and then compare the last screenshot with the expectation. +The snapshot is stored in the PNG format. To store it in the WebP format instead, pass a snapshot name with the `.webp` extension. + **Usage** ```js @@ -170,6 +178,9 @@ Note that screenshot assertions only work with Playwright test runner. When set to `"css"`, screenshot will have a single pixel per each css pixel on the page. For high-dpi devices, this will keep screenshots small. Using `"device"` option will produce a single pixel per each device pixel, so screenshots of high-dpi devices will be twice as large or even larger. Defaults to `"css"`. + - `signal` [AbortSignal] *(optional)* Added in: v1.62# + + An optional [`AbortSignal`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that can cancel the assertion. Aborting the signal fails the assertion like a timeout: if the signal is aborted while the assertion is retrying, or is already aborted before the assertion starts, the assertion fails without retrying further. - `stylePath` [string] | [Array]<[string]> *(optional)* Added in: v1.41# File name containing the stylesheet to apply while making the screenshot. This is where you can hide dynamic elements, make elements invisible or change their properties to help you creating repeatable screenshots. This stylesheet pierces the Shadow DOM and applies to the inner frames. diff --git a/nodejs/docs/test-snapshots.mdx b/nodejs/docs/test-snapshots.mdx index d00a86935d..c464f76734 100644 --- a/nodejs/docs/test-snapshots.mdx +++ b/nodejs/docs/test-snapshots.mdx @@ -53,6 +53,12 @@ The snapshot name `example-test-1-chromium-darwin.png` consists of a few parts: The snapshot name and path can be configured with [testConfig.snapshotPathTemplate](/api/class-testconfig.mdx#test-config-snapshot-path-template) in the playwright config. +Snapshots are stored as PNG by default. Give the snapshot a name with the `.webp` extension to store it in the WebP format instead, it is also lossless: + +```js +await expect(page).toHaveScreenshot('landing.webp'); +``` + > Note that `toHaveScreenshot()` also accepts an array of path segments to the snapshot file such as `expect().toHaveScreenshot(['relative', 'path', 'to', 'snapshot.png'])`. > However, this path must stay within the snapshots directory for each test file (i.e. `a.spec.js-snapshots`), otherwise it will throw.