feat(roll): roll to ToT Playwright (roll/next-15-07-26)

nodejs/docs/api/class-locatorassertions.mdx

@@ -833,14 +833,17 @@ 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.
 
 **Arguments**
 - `name` [string] | [Array]&lt;[string]&gt;<a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="locator-assertions-to-have-screenshot-1-option-name"/><a href="#locator-assertions-to-have-screenshot-1-option-name" class="list-anchor">#</a>
 
-  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)*<a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="locator-assertions-to-have-screenshot-1-option-animations"/><a href="#locator-assertions-to-have-screenshot-1-option-animations" class="list-anchor">#</a>
 
@@ -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)* <font size="2">Added in: v1.62</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="locator-assertions-to-have-screenshot-1-option-signal"/><a href="#locator-assertions-to-have-screenshot-1-option-signal" class="list-anchor">#</a>
+
+    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]&lt;[string]&gt; *(optional)* <font size="2">Added in: v1.41</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="locator-assertions-to-have-screenshot-1-option-style-path"/><a href="#locator-assertions-to-have-screenshot-1-option-style-path" class="list-anchor">#</a>
 
     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)* <font size="2">Added in: v1.62</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="locator-assertions-to-have-screenshot-2-option-signal"/><a href="#locator-assertions-to-have-screenshot-2-option-signal" class="list-anchor">#</a>
+
+    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]&lt;[string]&gt; *(optional)* <font size="2">Added in: v1.41</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="locator-assertions-to-have-screenshot-2-option-style-path"/><a href="#locator-assertions-to-have-screenshot-2-option-style-path" class="list-anchor">#</a>
 
     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.

nodejs/docs/api/class-pageassertions.mdx

@@ -34,14 +34,17 @@ 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.
 
 **Arguments**
 - `name` [string] | [Array]&lt;[string]&gt;<a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="page-assertions-to-have-screenshot-1-option-name"/><a href="#page-assertions-to-have-screenshot-1-option-name" class="list-anchor">#</a>
 
-  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)*<a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="page-assertions-to-have-screenshot-1-option-animations"/><a href="#page-assertions-to-have-screenshot-1-option-animations" class="list-anchor">#</a>
 
@@ -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)* <font size="2">Added in: v1.62</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="page-assertions-to-have-screenshot-1-option-signal"/><a href="#page-assertions-to-have-screenshot-1-option-signal" class="list-anchor">#</a>
+
+    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]&lt;[string]&gt; *(optional)* <font size="2">Added in: v1.41</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="page-assertions-to-have-screenshot-1-option-style-path"/><a href="#page-assertions-to-have-screenshot-1-option-style-path" class="list-anchor">#</a>
 
     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)* <font size="2">Added in: v1.62</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="page-assertions-to-have-screenshot-2-option-signal"/><a href="#page-assertions-to-have-screenshot-2-option-signal" class="list-anchor">#</a>
+
+    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]&lt;[string]&gt; *(optional)* <font size="2">Added in: v1.41</font><a aria-hidden="true" tabIndex="-1" class="list-anchor-link" id="page-assertions-to-have-screenshot-2-option-style-path"/><a href="#page-assertions-to-have-screenshot-2-option-style-path" class="list-anchor">#</a>
 
     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.

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.