From 4ac258fb8a5986b53113ba34db03d96bda00a01b Mon Sep 17 00:00:00 2001
From: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 6 Mar 2025 17:57:46 +0000
Subject: [PATCH] feat(roll): roll to 1.51 Playwright
---
.../version-stable/api/class-apirequest.mdx | 3 +
.../api/class-apirequestcontext.mdx | 3 +
.../version-stable/api/class-browser.mdx | 6 +
.../api/class-browsercontext.mdx | 11 +-
.../version-stable/api/class-browsertype.mdx | 16 +-
.../api/class-elementhandle.mdx | 2 +-
.../version-stable/api/class-locator.mdx | 18 +-
.../version-stable/api/class-page.mdx | 3 +-
.../api/class-pageassertions.mdx | 2 +-
.../version-stable/api/class-touchscreen.mdx | 2 +
.../version-stable/api/class-websocket.mdx | 4 +-
.../version-stable/aria-snapshots.mdx | 40 +--
dotnet/versioned_docs/version-stable/auth.mdx | 6 +-
.../versioned_docs/version-stable/codegen.mdx | 4 +-
.../version-stable/locators.mdx | 2 +-
.../versioned_docs/version-stable/network.mdx | 4 +
.../version-stable/release-notes.mdx | 49 ++-
.../version-stable/touch-events.mdx | 147 ++++++++-
.../version-stable-sidebars.json | 4 +
.../version-stable/api/class-apirequest.mdx | 3 +
.../api/class-apirequestcontext.mdx | 3 +
.../version-stable/api/class-browser.mdx | 6 +
.../api/class-browsercontext.mdx | 11 +-
.../version-stable/api/class-browsertype.mdx | 16 +-
.../api/class-elementhandle.mdx | 2 +-
.../version-stable/api/class-locator.mdx | 18 +-
.../version-stable/api/class-page.mdx | 5 +-
.../api/class-pageassertions.mdx | 2 +-
.../version-stable/api/class-touchscreen.mdx | 2 +
.../version-stable/api/class-websocket.mdx | 4 +-
.../version-stable/aria-snapshots.mdx | 40 +--
java/versioned_docs/version-stable/auth.mdx | 6 +-
java/versioned_docs/version-stable/ci.mdx | 12 +-
.../versioned_docs/version-stable/codegen.mdx | 4 +-
java/versioned_docs/version-stable/docker.mdx | 16 +-
java/versioned_docs/version-stable/intro.mdx | 2 +-
.../version-stable/locators.mdx | 2 +-
.../versioned_docs/version-stable/network.mdx | 4 +
.../version-stable/release-notes.mdx | 46 ++-
.../version-stable/test-runners.mdx | 4 +-
.../version-stable/touch-events.mdx | 140 ++++++++-
.../version-stable-sidebars.json | 4 +
.../version-stable/accessibility-testing.mdx | 1 +
.../version-stable/actionability.mdx | 1 +
.../version-stable/api-testing.mdx | 1 +
.../api/class-accessibility.mdx | 1 +
.../version-stable/api/class-android.mdx | 1 +
.../api/class-androiddevice.mdx | 4 +
.../version-stable/api/class-androidinput.mdx | 1 +
.../api/class-androidsocket.mdx | 1 +
.../api/class-androidwebview.mdx | 1 +
.../version-stable/api/class-apirequest.mdx | 4 +
.../api/class-apirequestcontext.mdx | 4 +
.../version-stable/api/class-apiresponse.mdx | 1 +
.../api/class-apiresponseassertions.mdx | 1 +
.../version-stable/api/class-browser.mdx | 19 +-
.../api/class-browsercontext.mdx | 12 +-
.../api/class-browserserver.mdx | 1 +
.../version-stable/api/class-browsertype.mdx | 17 +-
.../version-stable/api/class-cdpsession.mdx | 1 +
.../version-stable/api/class-clock.mdx | 1 +
.../api/class-consolemessage.mdx | 1 +
.../version-stable/api/class-coverage.mdx | 1 +
.../version-stable/api/class-dialog.mdx | 1 +
.../version-stable/api/class-download.mdx | 1 +
.../version-stable/api/class-electron.mdx | 1 +
.../api/class-electronapplication.mdx | 1 +
.../api/class-elementhandle.mdx | 3 +-
.../version-stable/api/class-filechooser.mdx | 1 +
.../version-stable/api/class-fixtures.mdx | 1 +
.../version-stable/api/class-frame.mdx | 1 +
.../version-stable/api/class-framelocator.mdx | 1 +
.../version-stable/api/class-fullconfig.mdx | 5 +-
.../version-stable/api/class-fullproject.mdx | 1 +
.../api/class-genericassertions.mdx | 1 +
.../version-stable/api/class-jshandle.mdx | 1 +
.../version-stable/api/class-keyboard.mdx | 1 +
.../version-stable/api/class-location.mdx | 1 +
.../version-stable/api/class-locator.mdx | 19 +-
.../api/class-locatorassertions.mdx | 9 +-
.../version-stable/api/class-logger.mdx | 1 +
.../version-stable/api/class-mouse.mdx | 1 +
.../version-stable/api/class-page.mdx | 6 +-
.../api/class-pageassertions.mdx | 24 +-
.../version-stable/api/class-playwright.mdx | 1 +
.../api/class-playwrightassertions.mdx | 1 +
.../version-stable/api/class-reporter.mdx | 1 +
.../version-stable/api/class-request.mdx | 1 +
.../version-stable/api/class-response.mdx | 1 +
.../version-stable/api/class-route.mdx | 1 +
.../version-stable/api/class-selectors.mdx | 1 +
.../api/class-snapshotassertions.mdx | 1 +
.../version-stable/api/class-suite.mdx | 1 +
.../version-stable/api/class-test.mdx | 7 +-
.../version-stable/api/class-testcase.mdx | 1 +
.../version-stable/api/class-testconfig.mdx | 55 +++-
.../version-stable/api/class-testerror.mdx | 1 +
.../version-stable/api/class-testinfo.mdx | 1 +
.../api/class-testinfoerror.mdx | 1 +
.../version-stable/api/class-testoptions.mdx | 7 +-
.../version-stable/api/class-testproject.mdx | 6 +
.../version-stable/api/class-testresult.mdx | 1 +
.../version-stable/api/class-teststep.mdx | 24 ++
.../version-stable/api/class-teststepinfo.mdx | 248 +++++++++++++++
.../version-stable/api/class-timeouterror.mdx | 1 +
.../version-stable/api/class-touchscreen.mdx | 3 +
.../version-stable/api/class-tracing.mdx | 1 +
.../version-stable/api/class-video.mdx | 1 +
.../version-stable/api/class-weberror.mdx | 1 +
.../version-stable/api/class-websocket.mdx | 5 +-
.../api/class-websocketroute.mdx | 1 +
.../version-stable/api/class-worker.mdx | 1 +
.../version-stable/api/class-workerinfo.mdx | 1 +
.../version-stable/aria-snapshots.mdx | 58 +++-
nodejs/versioned_docs/version-stable/auth.mdx | 3 +-
.../version-stable/best-practices.mdx | 1 +
.../version-stable/browser-contexts.mdx | 1 +
.../version-stable/browsers.mdx | 1 +
.../version-stable/canary-releases.mdx | 1 +
.../version-stable/chrome-extensions.mdx | 1 +
.../version-stable/ci-intro.mdx | 1 +
nodejs/versioned_docs/version-stable/ci.mdx | 23 +-
.../versioned_docs/version-stable/clock.mdx | 1 +
.../version-stable/codegen-intro.mdx | 1 +
.../versioned_docs/version-stable/codegen.mdx | 5 +-
.../versioned_docs/version-stable/debug.mdx | 1 +
.../versioned_docs/version-stable/dialogs.mdx | 1 +
.../versioned_docs/version-stable/docker.mdx | 19 +-
.../version-stable/downloads.mdx | 1 +
.../version-stable/emulation.mdx | 1 +
.../version-stable/evaluating.mdx | 1 +
.../versioned_docs/version-stable/events.mdx | 1 +
.../version-stable/extensibility.mdx | 1 +
.../versioned_docs/version-stable/frames.mdx | 1 +
.../version-stable/getting-started-vscode.mdx | 1 +
.../versioned_docs/version-stable/handles.mdx | 1 +
.../versioned_docs/version-stable/input.mdx | 1 +
.../versioned_docs/version-stable/intro.mdx | 1 +
.../version-stable/languages.mdx | 1 +
.../versioned_docs/version-stable/library.mdx | 1 +
.../version-stable/locators.mdx | 3 +-
.../version-stable/mock-browser.mdx | 1 +
nodejs/versioned_docs/version-stable/mock.mdx | 1 +
.../version-stable/navigations.mdx | 1 +
.../versioned_docs/version-stable/network.mdx | 5 +
.../version-stable/other-locators.mdx | 1 +
.../versioned_docs/version-stable/pages.mdx | 1 +
nodejs/versioned_docs/version-stable/pom.mdx | 1 +
.../version-stable/protractor.mdx | 1 +
.../version-stable/puppeteer.mdx | 1 +
.../version-stable/release-notes.mdx | 95 +++++-
.../version-stable/running-tests.mdx | 1 +
.../version-stable/screenshots.mdx | 1 +
.../version-stable/selenium-grid.mdx | 1 +
...ce-workers-experimental-network-events.mdx | 1 +
.../version-stable/test-annotations.mdx | 1 +
.../version-stable/test-assertions.mdx | 1 +
.../version-stable/test-cli.mdx | 4 +-
.../version-stable/test-components.mdx | 9 +
.../version-stable/test-configuration.mdx | 5 +-
.../version-stable/test-fixtures.mdx | 5 +-
.../test-global-setup-teardown.mdx | 1 +
.../version-stable/test-parallel.mdx | 1 +
.../version-stable/test-parameterize.mdx | 1 +
.../version-stable/test-projects.mdx | 1 +
.../version-stable/test-reporters.mdx | 1 +
.../version-stable/test-retries.mdx | 1 +
.../version-stable/test-sharding.mdx | 1 +
.../version-stable/test-snapshots.mdx | 1 +
.../version-stable/test-timeouts.mdx | 1 +
.../version-stable/test-typescript.mdx | 1 +
.../version-stable/test-ui-mode.mdx | 9 +-
.../version-stable/test-use-options.mdx | 3 +-
.../version-stable/test-webserver.mdx | 19 +-
.../version-stable/testing-library.mdx | 1 +
.../version-stable/touch-events.mdx | 15 +-
.../version-stable/trace-viewer-intro.mdx | 1 +
.../version-stable/trace-viewer.mdx | 1 +
.../versioned_docs/version-stable/videos.mdx | 1 +
.../version-stable/webview2.mdx | 1 +
.../version-stable/writing-tests.mdx | 1 +
.../version-stable-sidebars.json | 12 +-
.../version-stable/api/class-apirequest.mdx | 3 +
.../api/class-apirequestcontext.mdx | 17 +-
.../version-stable/api/class-apiresponse.mdx | 2 +-
.../version-stable/api/class-browser.mdx | 18 +-
.../api/class-browsercontext.mdx | 11 +-
.../version-stable/api/class-browsertype.mdx | 16 +-
.../api/class-elementhandle.mdx | 6 +-
.../version-stable/api/class-frame.mdx | 6 +-
.../version-stable/api/class-jshandle.mdx | 4 +-
.../version-stable/api/class-locator.mdx | 43 +--
.../version-stable/api/class-page.mdx | 9 +-
.../api/class-pageassertions.mdx | 2 +-
.../version-stable/api/class-request.mdx | 2 +-
.../version-stable/api/class-response.mdx | 2 +-
.../version-stable/api/class-route.mdx | 8 +-
.../version-stable/api/class-touchscreen.mdx | 2 +
.../version-stable/api/class-websocket.mdx | 4 +-
.../version-stable/api/class-worker.mdx | 2 +-
.../version-stable/aria-snapshots.mdx | 40 +--
python/versioned_docs/version-stable/auth.mdx | 8 +-
.../versioned_docs/version-stable/codegen.mdx | 4 +-
.../version-stable/locators.mdx | 8 +-
.../versioned_docs/version-stable/network.mdx | 4 +
.../version-stable/release-notes.mdx | 42 ++-
.../version-stable/touch-events.mdx | 296 +++++++++++++++++-
.../version-stable-sidebars.json | 4 +
208 files changed, 1733 insertions(+), 384 deletions(-)
create mode 100644 nodejs/versioned_docs/version-stable/api/class-teststepinfo.mdx
diff --git a/dotnet/versioned_docs/version-stable/api/class-apirequest.mdx b/dotnet/versioned_docs/version-stable/api/class-apirequest.mdx
index a516b740771..f598427edd8 100644
--- a/dotnet/versioned_docs/version-stable/api/class-apirequest.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-apirequest.mdx
@@ -74,6 +74,9 @@ await ApiRequest.NewContextAsync(options);
- `ExtraHTTPHeaders` [IDictionary]?<[string], [string]> *(optional)*#
An object containing additional HTTP headers to be sent with every request. Defaults to none.
+ - `FailOnStatusCode` [bool]? *(optional)* Added in: v1.51 #
+
+ Whether to throw on response codes other than 2xx and 3xx. By default response object is returned for all status codes.
- `HttpCredentials` HttpCredentials? *(optional)*#
- `Username` [string]
diff --git a/dotnet/versioned_docs/version-stable/api/class-apirequestcontext.mdx b/dotnet/versioned_docs/version-stable/api/class-apirequestcontext.mdx
index 1c90eb92fe5..4f674a5a4ce 100644
--- a/dotnet/versioned_docs/version-stable/api/class-apirequestcontext.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-apirequestcontext.mdx
@@ -555,6 +555,9 @@ await ApiRequestContext.StorageStateAsync(options);
**Arguments**
- `options` `ApiRequestContextStorageStateOptions?` *(optional)*
+ - `IndexedDB` [bool]? *(optional)* Added in: v1.51 #
+
+ Set to `true` to include IndexedDB in the storage state snapshot.
- `Path` [string]? *(optional)*#
The file path to save the storage state to. If [Path](/api/class-apirequestcontext.mdx#api-request-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
diff --git a/dotnet/versioned_docs/version-stable/api/class-browser.mdx b/dotnet/versioned_docs/version-stable/api/class-browser.mdx
index 65dc80ef155..ecbc5adbeeb 100644
--- a/dotnet/versioned_docs/version-stable/api/class-browser.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-browser.mdx
@@ -215,6 +215,9 @@ await browser.CloseAsync();
- `ColorScheme` `enum ColorScheme { Light, Dark, NoPreference, Null }?` *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [Page.EmulateMediaAsync()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`.
+ - `Contrast` `enum Contrast { NoPreference, More, Null }?` *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [Page.EmulateMediaAsync()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'no-preference'`.
- `DeviceScaleFactor` [float]? *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -430,6 +433,9 @@ await Browser.NewPageAsync(options);
- `ColorScheme` `enum ColorScheme { Light, Dark, NoPreference, Null }?` *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [Page.EmulateMediaAsync()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`.
+ - `Contrast` `enum Contrast { NoPreference, More, Null }?` *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [Page.EmulateMediaAsync()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'no-preference'`.
- `DeviceScaleFactor` [float]? *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
diff --git a/dotnet/versioned_docs/version-stable/api/class-browsercontext.mdx b/dotnet/versioned_docs/version-stable/api/class-browsercontext.mdx
index 9f02bbde20e..585675d2df8 100644
--- a/dotnet/versioned_docs/version-stable/api/class-browsercontext.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-browsercontext.mdx
@@ -908,7 +908,7 @@ await BrowserContext.SetOfflineAsync(offline);
Added before v1.9 browserContext.StorageStateAsync
-Returns storage state for this browser context, contains current cookies and local storage snapshot.
+Returns storage state for this browser context, contains current cookies, local storage snapshot and IndexedDB snapshot.
**Usage**
@@ -918,6 +918,15 @@ await BrowserContext.StorageStateAsync(options);
**Arguments**
- `options` `BrowserContextStorageStateOptions?` *(optional)*
+ - `IndexedDB` [bool]? *(optional)* Added in: v1.51 #
+
+ Set to `true` to include [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) in the storage state snapshot. If your application uses IndexedDB to store authentication tokens, like Firebase Authentication, enable this.
+
+ :::note
+
+ IndexedDBs with typed arrays are currently not supported.
+ :::
+
- `Path` [string]? *(optional)*#
The file path to save the storage state to. If [Path](/api/class-browsercontext.mdx#browser-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
diff --git a/dotnet/versioned_docs/version-stable/api/class-browsertype.mdx b/dotnet/versioned_docs/version-stable/api/class-browsertype.mdx
index 5f21adcf0c4..fe3ff1ac73e 100644
--- a/dotnet/versioned_docs/version-stable/api/class-browsertype.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-browsertype.mdx
@@ -37,7 +37,12 @@ class BrowserTypeExamples
Added before v1.9 browserType.ConnectAsync
-This method attaches Playwright to an existing browser instance. When connecting to another browser launched via `BrowserType.launchServer` in Node.js, the major and minor version needs to match the client version (1.2.3 → is compatible with 1.2.x).
+This method attaches Playwright to an existing browser instance created via `BrowserType.launchServer` in Node.js.
+
+:::note
+
+The major and minor version of the Playwright instance that connects needs to match the version of Playwright that launches the browser (1.2.3 → is compatible with 1.2.x).
+:::
**Usage**
@@ -48,7 +53,7 @@ await BrowserType.ConnectAsync(wsEndpoint, options);
**Arguments**
- `wsEndpoint` [string] Added in: v1.10 #
- A browser websocket endpoint to connect to.
+ A Playwright browser websocket endpoint to connect to. You obtain this endpoint via `BrowserServer.wsEndpoint`.
- `options` `BrowserTypeConnectOptions?` *(optional)*
- `ExposeNetwork` [string]? *(optional)* Added in: v1.37 #
@@ -91,6 +96,10 @@ The default browser context is accessible via [Browser.Contexts](/api/class-brow
Connecting over the Chrome DevTools Protocol is only supported for Chromium-based browsers.
:::
+:::note
+This connection is significantly lower fidelity than the Playwright protocol connection via [BrowserType.ConnectAsync()](/api/class-browsertype.mdx#browser-type-connect). If you are experiencing issues or attempting to use advanced functionality, you probably want to use [BrowserType.ConnectAsync()](/api/class-browsertype.mdx#browser-type-connect).
+:::
+
**Usage**
```csharp
@@ -335,6 +344,9 @@ await BrowserType.LaunchPersistentContextAsync(userDataDir, options);
- `ColorScheme` `enum ColorScheme { Light, Dark, NoPreference, Null }?` *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [Page.EmulateMediaAsync()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`.
+ - `Contrast` `enum Contrast { NoPreference, More, Null }?` *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [Page.EmulateMediaAsync()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'no-preference'`.
- `DeviceScaleFactor` [float]? *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
diff --git a/dotnet/versioned_docs/version-stable/api/class-elementhandle.mdx b/dotnet/versioned_docs/version-stable/api/class-elementhandle.mdx
index 19dc5c90f2a..764858eb244 100644
--- a/dotnet/versioned_docs/version-stable/api/class-elementhandle.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-elementhandle.mdx
@@ -1043,7 +1043,7 @@ await ElementHandle.ScreenshotAsync(options);
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `Mask` [IEnumerable]?<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [MaskColor](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [MaskColor](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `MaskColor` [string]? *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
diff --git a/dotnet/versioned_docs/version-stable/api/class-locator.mdx b/dotnet/versioned_docs/version-stable/api/class-locator.mdx
index 4ff685f4ecd..1908391f60f 100644
--- a/dotnet/versioned_docs/version-stable/api/class-locator.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-locator.mdx
@@ -656,11 +656,6 @@ Execute JavaScript code in the page, taking the matching element as an argument.
**Usage**
-```csharp
-var tweets = page.Locator(".tweet .retweets");
-Assert.AreEqual("10 retweets", await tweets.EvaluateAsync("node => node.innerText"));
-```
-
**Arguments**
- `expression` [string]#
@@ -845,6 +840,9 @@ await rowLocator
- `HasText|HasTextRegex` [string]? | [Regex]? *(optional)*#
Matches elements containing specified text somewhere inside, possibly in a child or a descendant element. When passed a [string], matching is case-insensitive and searches for a substring. For example, `"Playwright"` matches `Playwright
Added in: v1.51 #
+
+ Only matches visible or invisible elements.
**Returns**
- [Locator]#
@@ -1880,7 +1878,7 @@ await page.GetByRole(AriaRole.Link).ScreenshotAsync(new() {
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `Mask` [IEnumerable]?<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [MaskColor](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [MaskColor](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `MaskColor` [string]? *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -1956,9 +1954,9 @@ Selects option or options in ``.
```html
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
@@ -2172,7 +2170,7 @@ This method expects [Locator] to point to an [input element](https://developer.m
Added in: v1.14 locator.TapAsync
-Perform a tap gesture on the element matching the locator.
+Perform a tap gesture on the element matching the locator. For examples of emulating other gestures by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
**Usage**
diff --git a/dotnet/versioned_docs/version-stable/api/class-page.mdx b/dotnet/versioned_docs/version-stable/api/class-page.mdx
index 46ec8d92e52..db4f3f5bae1 100644
--- a/dotnet/versioned_docs/version-stable/api/class-page.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-page.mdx
@@ -436,6 +436,7 @@ await page.EvaluateAsync("matchMedia('(prefers-color-scheme: light)').matches");
- `ColorScheme` `enum ColorScheme { Light, Dark, NoPreference, Null }?` *(optional)* Added in: v1.9 #
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. Passing `'Null'` disables color scheme emulation. `'no-preference'` is deprecated.
+ - `Contrast` `enum Contrast { NoPreference, More, Null }?` *(optional)* Added in: v1.51 #
- `ForcedColors` `enum ForcedColors { Active, None, Null }?` *(optional)* Added in: v1.15 #
- `Media` `enum Media { Screen, Print, Null }?` *(optional)* Added in: v1.9 #
@@ -2267,7 +2268,7 @@ await Page.ScreenshotAsync(options);
When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Defaults to `false`.
- `Mask` [IEnumerable]?<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [MaskColor](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [MaskColor](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `MaskColor` [string]? *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
diff --git a/dotnet/versioned_docs/version-stable/api/class-pageassertions.mdx b/dotnet/versioned_docs/version-stable/api/class-pageassertions.mdx
index 3eb93c37452..37c273974ac 100644
--- a/dotnet/versioned_docs/version-stable/api/class-pageassertions.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-pageassertions.mdx
@@ -78,7 +78,7 @@ await Expect(Page).ToHaveURLAsync(new Regex(".*checkout"));
- `options` `PageAssertionsToHaveURLOptions?` *(optional)*
- `IgnoreCase` [bool]? *(optional)* Added in: v1.44 #
- Whether to perform case-insensitive match. [IgnoreCase](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression flag if specified.
+ Whether to perform case-insensitive match. [IgnoreCase](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression parameter if specified. A provided predicate ignores this flag.
- `Timeout` [float]? *(optional)* Added in: v1.18 #
Time to retry the assertion for in milliseconds. Defaults to `5000`.
diff --git a/dotnet/versioned_docs/version-stable/api/class-touchscreen.mdx b/dotnet/versioned_docs/version-stable/api/class-touchscreen.mdx
index 87aa6e1f35f..ec37a92d158 100644
--- a/dotnet/versioned_docs/version-stable/api/class-touchscreen.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-touchscreen.mdx
@@ -9,6 +9,8 @@ import HTMLCard from '@site/src/components/HTMLCard';
The Touchscreen class operates in main-frame CSS pixels relative to the top-left corner of the viewport. Methods on the touchscreen can only be used in browser contexts that have been initialized with `hasTouch` set to true.
+This class is limited to emulating tap gestures. For examples of other gestures simulated by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
+
---
diff --git a/dotnet/versioned_docs/version-stable/api/class-websocket.mdx b/dotnet/versioned_docs/version-stable/api/class-websocket.mdx
index 21e45eefab9..08a9aa0eae5 100644
--- a/dotnet/versioned_docs/version-stable/api/class-websocket.mdx
+++ b/dotnet/versioned_docs/version-stable/api/class-websocket.mdx
@@ -7,7 +7,9 @@ import TabItem from '@theme/TabItem';
import HTMLCard from '@site/src/components/HTMLCard';
-The [WebSocket] class represents websocket connections in the page.
+The [WebSocket] class represents WebSocket connections within a page. It provides the ability to inspect and manipulate the data being transmitted and received.
+
+If you want to intercept or modify WebSocket frames, consider using [WebSocketRoute].
---
diff --git a/dotnet/versioned_docs/version-stable/aria-snapshots.mdx b/dotnet/versioned_docs/version-stable/aria-snapshots.mdx
index e12fc5bbf38..d4c5e75fd21 100644
--- a/dotnet/versioned_docs/version-stable/aria-snapshots.mdx
+++ b/dotnet/versioned_docs/version-stable/aria-snapshots.mdx
@@ -10,7 +10,7 @@ import LiteYouTube from '@site/src/components/LiteYouTube';
## Overview
-With the Playwright Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
+With Playwright's Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
```csharp
await page.GotoAsync("https://playwright.dev/");
@@ -31,11 +31,11 @@ Snapshot testing and assertion testing serve different purposes in test automati
### Assertion testing
-Assertion testing is a targeted approach where you assert specific values or conditions about elements or components. For instance, with Playwright, [Expect(Locator).ToHaveTextAsync()](/api/class-locatorassertions.mdx#locator-assertions-to-have-text) verifies that an element contains the expected text, and [Expect(Locator).ToHaveValueAsync()](/api/class-locatorassertions.mdx#locator-assertions-to-have-value) confirms that an input field has the expected value. Assertion tests are specific and generally check the current state of an element or property against an expected, predefined state. They work well for predictable, single-value checks but are limited in scope when testing the broader structure or variations.
+Assertion testing is a targeted approach where you assert specific values or conditions about elements or components. For instance, with Playwright, [Expect(Locator).ToHaveTextAsync()](/api/class-locatorassertions.mdx#locator-assertions-to-have-text) verifies that an element contains the expected text, and [Expect(Locator).ToHaveValueAsync()](/api/class-locatorassertions.mdx#locator-assertions-to-have-value) confirms that an input field has the expected value. Assertion tests are specific and generally check the current state of an element or property against an expected, predefined state. They work well for predictable, single-value checks but are limited in scope when testing the broader structure or variations.
**Advantages**
- **Clarity**: The intent of the test is explicit and easy to understand.
-- **Specificity**: Tests focus on particular aspects of functionality, making them more robust against unrelated changes.
+- **Specificity**: Tests focus on particular aspects of functionality, making them more robust against unrelated changes.
- **Debugging**: Failures provide targeted feedback, pointing directly to the problematic aspect.
**Disadvantages**
@@ -123,7 +123,7 @@ You can perform partial matches on nodes by omitting attributes or accessible na
- button
```
-In this example, the button role is matched, but the accessible name ("Submit") is not specified, allowing the test to pass regardless of the button’s label.
+In this example, the button role is matched, but the accessible name ("Submit") is not specified, allowing the test to pass regardless of the button's label.
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
diff --git a/dotnet/versioned_docs/version-stable/touch-events.mdx b/dotnet/versioned_docs/version-stable/touch-events.mdx
index 50c661ff643..9d0a5b737a0 100644
--- a/dotnet/versioned_docs/version-stable/touch-events.mdx
+++ b/dotnet/versioned_docs/version-stable/touch-events.mdx
@@ -1,6 +1,6 @@
---
id: touch-events
-title: "Emulating touch events"
+title: "Touch events (legacy)"
---
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
@@ -8,22 +8,153 @@ import HTMLCard from '@site/src/components/HTMLCard';
## Introduction
-Mobile web sites may listen to [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) and react to user touch gestures such as swipe, pinch, tap etc. To test this functionality you can manually generate [TouchEvent]s in the page context using [Locator.EvaluateAsync()](/api/class-locator.mdx#locator-evaluate).
+Web applications that handle legacy [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) to respond to gestures like swipe, pinch, and tap can be tested by manually dispatching [TouchEvent](https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/TouchEvent)s to the page. The examples below demonstrate how to use [Locator.DispatchEventAsync()](/api/class-locator.mdx#locator-dispatch-event) and pass [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points as arguments.
-If your web application relies on [pointer events](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events) instead of touch events, you can use [Locator.ClickAsync()](/api/class-locator.mdx#locator-click) and raw [`Mouse`] events to simulate a single-finger touch, and this will trigger all the same pointer events.
+### Emulating pan gesture
-### Dispatching TouchEvent
+In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
-You can dispatch touch events to the page using [Locator.DispatchEventAsync()](/api/class-locator.mdx#locator-dispatch-event). [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points can be passed as arguments, see examples below.
+```csharp
+using Microsoft.Playwright;
+using System.Collections.Generic;
+using System.Threading.Tasks;
-#### Emulating pan gesture
+public class TouchEvents
+{
+ public static async Task Main(string[] args)
+ {
+ using var playwright = await Playwright.CreateAsync();
+ var browser = await playwright.Chromium.LaunchAsync();
+ var context = await browser.NewContextAsync(playwright.Devices["Pixel 7"]);
+ var page = await context.NewPageAsync();
-In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
+ await page.GotoAsync(
+ "https://www.google.com/maps/place/@37.4117722,-122.0713234,15z",
+ new PageGotoOptions { WaitUntil = WaitUntilState.Commit }
+ );
+ await page.GetByRole(AriaRole.Button, new PageGetByRoleOptions { Name = "Keep using web" }).ClickAsync();
+ await page.GetByRole(AriaRole.Button, new PageGetByRoleOptions { Name = "Keep using web" })
+ .WaitForAsync(new LocatorWaitForOptions { State = WaitForSelectorState.Hidden });
+
+ var met = page.Locator("[data-test-id='met']");
+ for (int i = 0; i < 5; i++)
+ {
+ await Pan(met, 200, 100);
+ }
+ await page.ScreenshotAsync(new PageScreenshotOptions { Path = "screenshot.png" });
+ }
+
+ public static async Task Pan(ILocator locator, int deltaX, int deltaY, int steps = 5)
+ {
+ var bounds = await locator.BoundingBoxAsync();
+ double centerX = bounds.X + bounds.Width / 2;
+ double centerY = bounds.Y + bounds.Height / 2;
+
+ var touches = new List>
+ {
+ new Dictionary
+ {
+ { "identifier", 0 },
+ { "clientX", centerX },
+ { "clientY", centerY }
+ }
+ };
+ await locator.DispatchEventAsync("touchstart", new { touches, changedTouches = touches, targetTouches = touches });
+
+ for (int i = 1; i <= steps; i++)
+ {
+ touches = new List>
+ {
+ new Dictionary
+ {
+ { "identifier", 0 },
+ { "clientX", centerX + deltaX * i / steps },
+ { "clientY", centerY + deltaY * i / steps }
+ }
+ };
+ await locator.DispatchEventAsync("touchmove", new { touches, changedTouches = touches, targetTouches = touches });
+ }
+
+ await locator.DispatchEventAsync("touchend");
+ }
+}
+```
-#### Emulating pinch gesture
+### Emulating pinch gesture
In the example below, we emulate pinch gesture, i.e. two touch points moving closer to each other. It is expected to zoom out the map. The app under test only uses `clientX/clientY` coordinates of touch points, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
+```csharp
+using Microsoft.Playwright;
+using System.Collections.Generic;
+using System.Threading.Tasks;
+
+public class TouchEvents
+{
+ public static async Task Pinch(ILocator locator, int deltaX = 50, int steps = 5, string direction = "in")
+ {
+ var bounds = await locator.BoundingBoxAsync();
+ double centerX = bounds.X + bounds.Width / 2;
+ double centerY = bounds.Y + bounds.Height / 2;
+ double stepDeltaX = deltaX / (steps + 1.0);
+
+ var touches = new List>
+ {
+ new Dictionary
+ {
+ { "identifier", 0 },
+ { "clientX", centerX - (direction == "in" ? deltaX : stepDeltaX) },
+ { "clientY", centerY }
+ },
+ new Dictionary
+ {
+ { "identifier", 1 },
+ { "clientX", centerX + (direction == "in" ? deltaX : stepDeltaX) },
+ { "clientY", centerY }
+ }
+ };
+ await locator.DispatchEventAsync("touchstart", new { touches, changedTouches = touches, targetTouches = touches });
+
+ for (int i = 1; i <= steps; i++)
+ {
+ double offset = direction == "in" ? (deltaX - i * stepDeltaX) : (stepDeltaX * (i + 1));
+ touches = new List>
+ {
+ new Dictionary
+ {
+ { "identifier", 0 },
+ { "clientX", centerX - offset },
+ { "clientY", centerY }
+ },
+ new Dictionary
+ {
+ { "identifier", 1 },
+ { "clientX", centerX + offset },
+ { "clientY", centerY }
+ }
+ };
+ await locator.DispatchEventAsync("touchmove", new { touches, changedTouches = touches, targetTouches = touches });
+ }
+
+ await locator.DispatchEventAsync("touchend", new { touches = new List(), changedTouches = new List(), targetTouches = new List() });
+ }
+
+ public static async Task TestPinchInGestureToZoomOutTheMap(IPage page)
+ {
+ await page.GotoAsync("https://www.google.com/maps/place/@37.4117722,-122.0713234,15z", new PageGotoOptions { WaitUntil = WaitUntilState.Commit });
+ await page.GetByRole(AriaRole.Button, new PageGetByRoleOptions { Name = "Keep using web" }).ClickAsync();
+ await page.GetByRole(AriaRole.Button, new PageGetByRoleOptions { Name = "Keep using web" }).WaitForAsync(new LocatorWaitForOptions { State = WaitForSelectorState.Hidden });
+
+ var met = page.Locator("[data-test-id='met']");
+ for (int i = 0; i < 5; i++)
+ {
+ await Pinch(met, 40, 5, "in");
+ }
+ await page.ScreenshotAsync(new PageScreenshotOptions { Path = "screenshot.png" });
+ }
+}
+```
+
[Accessibility]: /api/class-accessibility.mdx "Accessibility"
[APIRequest]: /api/class-apirequest.mdx "APIRequest"
diff --git a/dotnet/versioned_sidebars/version-stable-sidebars.json b/dotnet/versioned_sidebars/version-stable-sidebars.json
index 7856f02d6b9..a7124856a3b 100644
--- a/dotnet/versioned_sidebars/version-stable-sidebars.json
+++ b/dotnet/versioned_sidebars/version-stable-sidebars.json
@@ -155,6 +155,10 @@
"type": "doc",
"id": "codegen"
},
+ {
+ "type": "doc",
+ "id": "touch-events"
+ },
{
"type": "doc",
"id": "trace-viewer"
diff --git a/java/versioned_docs/version-stable/api/class-apirequest.mdx b/java/versioned_docs/version-stable/api/class-apirequest.mdx
index fb3f1e0cd54..274f9ce927b 100644
--- a/java/versioned_docs/version-stable/api/class-apirequest.mdx
+++ b/java/versioned_docs/version-stable/api/class-apirequest.mdx
@@ -75,6 +75,9 @@ APIRequest.newContext(options);
- `setExtraHTTPHeaders` [Map]<[String], [String]> *(optional)*#
An object containing additional HTTP headers to be sent with every request. Defaults to none.
+ - `setFailOnStatusCode` [boolean] *(optional)* Added in: v1.51 #
+
+ Whether to throw on response codes other than 2xx and 3xx. By default response object is returned for all status codes.
- `setHttpCredentials` HttpCredentials *(optional)*#
- `setUsername` [String]
diff --git a/java/versioned_docs/version-stable/api/class-apirequestcontext.mdx b/java/versioned_docs/version-stable/api/class-apirequestcontext.mdx
index b66d4e4021a..e794937f0c4 100644
--- a/java/versioned_docs/version-stable/api/class-apirequestcontext.mdx
+++ b/java/versioned_docs/version-stable/api/class-apirequestcontext.mdx
@@ -296,6 +296,9 @@ APIRequestContext.storageState(options);
**Arguments**
- `options` `ApiRequestContext.StorageStateOptions` *(optional)*
+ - `setIndexedDB` [boolean] *(optional)* Added in: v1.51 #
+
+ Set to `true` to include IndexedDB in the storage state snapshot.
- `setPath` [Path] *(optional)*#
The file path to save the storage state to. If [setPath](/api/class-apirequestcontext.mdx#api-request-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
diff --git a/java/versioned_docs/version-stable/api/class-browser.mdx b/java/versioned_docs/version-stable/api/class-browser.mdx
index f4d41ca4131..3f3cb8b8f2e 100644
--- a/java/versioned_docs/version-stable/api/class-browser.mdx
+++ b/java/versioned_docs/version-stable/api/class-browser.mdx
@@ -219,6 +219,9 @@ browser.close();
- `setColorScheme` [null] | `enum ColorScheme { LIGHT, DARK, NO_PREFERENCE }` *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `setContrast` [null] | `enum Contrast { NO_PREFERENCE, MORE }` *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `setDeviceScaleFactor` [double] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -435,6 +438,9 @@ Browser.newPage(options);
- `setColorScheme` [null] | `enum ColorScheme { LIGHT, DARK, NO_PREFERENCE }` *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `setContrast` [null] | `enum Contrast { NO_PREFERENCE, MORE }` *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `setDeviceScaleFactor` [double] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
diff --git a/java/versioned_docs/version-stable/api/class-browsercontext.mdx b/java/versioned_docs/version-stable/api/class-browsercontext.mdx
index bc3c100d5e5..78505eb53c3 100644
--- a/java/versioned_docs/version-stable/api/class-browsercontext.mdx
+++ b/java/versioned_docs/version-stable/api/class-browsercontext.mdx
@@ -805,7 +805,7 @@ BrowserContext.setOffline(offline);
Added before v1.9 browserContext.storageState
-Returns storage state for this browser context, contains current cookies and local storage snapshot.
+Returns storage state for this browser context, contains current cookies, local storage snapshot and IndexedDB snapshot.
**Usage**
@@ -816,6 +816,15 @@ BrowserContext.storageState(options);
**Arguments**
- `options` `BrowserContext.StorageStateOptions` *(optional)*
+ - `setIndexedDB` [boolean] *(optional)* Added in: v1.51 #
+
+ Set to `true` to include [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) in the storage state snapshot. If your application uses IndexedDB to store authentication tokens, like Firebase Authentication, enable this.
+
+ :::note
+
+ IndexedDBs with typed arrays are currently not supported.
+ :::
+
- `setPath` [Path] *(optional)*#
The file path to save the storage state to. If [setPath](/api/class-browsercontext.mdx#browser-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
diff --git a/java/versioned_docs/version-stable/api/class-browsertype.mdx b/java/versioned_docs/version-stable/api/class-browsertype.mdx
index d3436c1fa53..cc44038daea 100644
--- a/java/versioned_docs/version-stable/api/class-browsertype.mdx
+++ b/java/versioned_docs/version-stable/api/class-browsertype.mdx
@@ -35,7 +35,12 @@ public class Example {
Added before v1.9 browserType.connect
-This method attaches Playwright to an existing browser instance. When connecting to another browser launched via `BrowserType.launchServer` in Node.js, the major and minor version needs to match the client version (1.2.3 → is compatible with 1.2.x).
+This method attaches Playwright to an existing browser instance created via `BrowserType.launchServer` in Node.js.
+
+:::note
+
+The major and minor version of the Playwright instance that connects needs to match the version of Playwright that launches the browser (1.2.3 → is compatible with 1.2.x).
+:::
**Usage**
@@ -47,7 +52,7 @@ BrowserType.connect(wsEndpoint, options);
**Arguments**
- `wsEndpoint` [String] Added in: v1.10 #
- A browser websocket endpoint to connect to.
+ A Playwright browser websocket endpoint to connect to. You obtain this endpoint via `BrowserServer.wsEndpoint`.
- `options` `BrowserType.ConnectOptions` *(optional)*
- `setExposeNetwork` [String] *(optional)* Added in: v1.37 #
@@ -90,6 +95,10 @@ The default browser context is accessible via [Browser.contexts()](/api/class-br
Connecting over the Chrome DevTools Protocol is only supported for Chromium-based browsers.
:::
+:::note
+This connection is significantly lower fidelity than the Playwright protocol connection via [BrowserType.connect()](/api/class-browsertype.mdx#browser-type-connect). If you are experiencing issues or attempting to use advanced functionality, you probably want to use [BrowserType.connect()](/api/class-browsertype.mdx#browser-type-connect).
+:::
+
**Usage**
```java
@@ -335,6 +344,9 @@ BrowserType.launchPersistentContext(userDataDir, options);
- `setColorScheme` [null] | `enum ColorScheme { LIGHT, DARK, NO_PREFERENCE }` *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `setContrast` [null] | `enum Contrast { NO_PREFERENCE, MORE }` *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `setDeviceScaleFactor` [double] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
diff --git a/java/versioned_docs/version-stable/api/class-elementhandle.mdx b/java/versioned_docs/version-stable/api/class-elementhandle.mdx
index a0b5d6223ca..257924f1ce6 100644
--- a/java/versioned_docs/version-stable/api/class-elementhandle.mdx
+++ b/java/versioned_docs/version-stable/api/class-elementhandle.mdx
@@ -1052,7 +1052,7 @@ ElementHandle.screenshot(options);
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `setMask` [List]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [setMaskColor](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [setMaskColor](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `setMaskColor` [String] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
diff --git a/java/versioned_docs/version-stable/api/class-locator.mdx b/java/versioned_docs/version-stable/api/class-locator.mdx
index c9937384c21..ec9db77f515 100644
--- a/java/versioned_docs/version-stable/api/class-locator.mdx
+++ b/java/versioned_docs/version-stable/api/class-locator.mdx
@@ -653,11 +653,6 @@ Execute JavaScript code in the page, taking the matching element as an argument.
**Usage**
-```java
-Locator tweets = page.locator(".tweet .retweets");
-assertEquals("10 retweets", tweets.evaluate("node => node.innerText"));
-```
-
**Arguments**
- `expression` [String]#
@@ -843,6 +838,9 @@ rowLocator
- `setHasText` [String] | [Pattern] *(optional)*#
Matches elements containing specified text somewhere inside, possibly in a child or a descendant element. When passed a [string], matching is case-insensitive and searches for a substring. For example, `"Playwright"` matches `Playwright
Added in: v1.51 #
+
+ Only matches visible or invisible elements.
**Returns**
- [Locator]#
@@ -1880,7 +1878,7 @@ page.getByRole(AriaRole.LINK).screenshot(new Locator.ScreenshotOptions()
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `setMask` [List]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [setMaskColor](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [setMaskColor](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `setMaskColor` [String] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -1957,9 +1955,9 @@ Selects option or options in ``.
```html
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
@@ -2170,7 +2168,7 @@ This method expects [Locator] to point to an [input element](https://developer.m
Added in: v1.14 locator.tap
-Perform a tap gesture on the element matching the locator.
+Perform a tap gesture on the element matching the locator. For examples of emulating other gestures by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
**Usage**
diff --git a/java/versioned_docs/version-stable/api/class-page.mdx b/java/versioned_docs/version-stable/api/class-page.mdx
index 99702cf468d..4c824ef173a 100644
--- a/java/versioned_docs/version-stable/api/class-page.mdx
+++ b/java/versioned_docs/version-stable/api/class-page.mdx
@@ -437,6 +437,9 @@ page.evaluate("() => matchMedia('(prefers-color-scheme: light)').matches");
- `setColorScheme` [null] | `enum ColorScheme { LIGHT, DARK, NO_PREFERENCE }` *(optional)* Added in: v1.9 #
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. Passing `null` disables color scheme emulation. `'no-preference'` is deprecated.
+ - `setContrast` [null] | `enum Contrast { NO_PREFERENCE, MORE }` *(optional)* Added in: v1.51 #
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. Passing `null` disables contrast emulation.
- `setForcedColors` [null] | `enum ForcedColors { ACTIVE, NONE }` *(optional)* Added in: v1.15 #
Emulates `'forced-colors'` media feature, supported values are `'active'` and `'none'`. Passing `null` disables forced colors emulation.
@@ -1790,7 +1793,7 @@ Page.screenshot(options);
When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Defaults to `false`.
- `setMask` [List]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [setMaskColor](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [setMaskColor](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `setMaskColor` [String] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
diff --git a/java/versioned_docs/version-stable/api/class-pageassertions.mdx b/java/versioned_docs/version-stable/api/class-pageassertions.mdx
index e3e0e05fcae..887e0bd5fe4 100644
--- a/java/versioned_docs/version-stable/api/class-pageassertions.mdx
+++ b/java/versioned_docs/version-stable/api/class-pageassertions.mdx
@@ -74,7 +74,7 @@ assertThat(page).hasURL(".com");
- `options` `PageAssertions.HasURLOptions` *(optional)*
- `setIgnoreCase` [boolean] *(optional)* Added in: v1.44 #
- Whether to perform case-insensitive match. [setIgnoreCase](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression flag if specified.
+ Whether to perform case-insensitive match. [setIgnoreCase](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression parameter if specified. A provided predicate ignores this flag.
- `setTimeout` [double] *(optional)* Added in: v1.18 #
Time to retry the assertion for in milliseconds. Defaults to `5000`.
diff --git a/java/versioned_docs/version-stable/api/class-touchscreen.mdx b/java/versioned_docs/version-stable/api/class-touchscreen.mdx
index 5bd36a04eb6..6159d2422d1 100644
--- a/java/versioned_docs/version-stable/api/class-touchscreen.mdx
+++ b/java/versioned_docs/version-stable/api/class-touchscreen.mdx
@@ -9,6 +9,8 @@ import HTMLCard from '@site/src/components/HTMLCard';
The Touchscreen class operates in main-frame CSS pixels relative to the top-left corner of the viewport. Methods on the touchscreen can only be used in browser contexts that have been initialized with `hasTouch` set to true.
+This class is limited to emulating tap gestures. For examples of other gestures simulated by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
+
---
diff --git a/java/versioned_docs/version-stable/api/class-websocket.mdx b/java/versioned_docs/version-stable/api/class-websocket.mdx
index 471a1d86f1a..d1e0e9e0944 100644
--- a/java/versioned_docs/version-stable/api/class-websocket.mdx
+++ b/java/versioned_docs/version-stable/api/class-websocket.mdx
@@ -7,7 +7,9 @@ import TabItem from '@theme/TabItem';
import HTMLCard from '@site/src/components/HTMLCard';
-The [WebSocket] class represents websocket connections in the page.
+The [WebSocket] class represents WebSocket connections within a page. It provides the ability to inspect and manipulate the data being transmitted and received.
+
+If you want to intercept or modify WebSocket frames, consider using [WebSocketRoute].
---
diff --git a/java/versioned_docs/version-stable/aria-snapshots.mdx b/java/versioned_docs/version-stable/aria-snapshots.mdx
index 7de56e229c7..ec1d1f0ab99 100644
--- a/java/versioned_docs/version-stable/aria-snapshots.mdx
+++ b/java/versioned_docs/version-stable/aria-snapshots.mdx
@@ -10,7 +10,7 @@ import LiteYouTube from '@site/src/components/LiteYouTube';
## Overview
-With the Playwright Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
+With Playwright's Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
```java
page.navigate("https://playwright.dev/");
@@ -31,11 +31,11 @@ Snapshot testing and assertion testing serve different purposes in test automati
### Assertion testing
-Assertion testing is a targeted approach where you assert specific values or conditions about elements or components. For instance, with Playwright, [assertThat(locator).hasText()](/api/class-locatorassertions.mdx#locator-assertions-to-have-text) verifies that an element contains the expected text, and [assertThat(locator).hasValue()](/api/class-locatorassertions.mdx#locator-assertions-to-have-value) confirms that an input field has the expected value. Assertion tests are specific and generally check the current state of an element or property against an expected, predefined state. They work well for predictable, single-value checks but are limited in scope when testing the broader structure or variations.
+Assertion testing is a targeted approach where you assert specific values or conditions about elements or components. For instance, with Playwright, [assertThat(locator).hasText()](/api/class-locatorassertions.mdx#locator-assertions-to-have-text) verifies that an element contains the expected text, and [assertThat(locator).hasValue()](/api/class-locatorassertions.mdx#locator-assertions-to-have-value) confirms that an input field has the expected value. Assertion tests are specific and generally check the current state of an element or property against an expected, predefined state. They work well for predictable, single-value checks but are limited in scope when testing the broader structure or variations.
**Advantages**
- **Clarity**: The intent of the test is explicit and easy to understand.
-- **Specificity**: Tests focus on particular aspects of functionality, making them more robust against unrelated changes.
+- **Specificity**: Tests focus on particular aspects of functionality, making them more robust against unrelated changes.
- **Debugging**: Failures provide targeted feedback, pointing directly to the problematic aspect.
**Disadvantages**
@@ -123,7 +123,7 @@ You can perform partial matches on nodes by omitting attributes or accessible na
- button
```
-In this example, the button role is matched, but the accessible name ("Submit") is not specified, allowing the test to pass regardless of the button’s label.
+In this example, the button role is matched, but the accessible name ("Submit") is not specified, allowing the test to pass regardless of the button's label.
com.microsoft.playwright
playwright
- 1.49.0
+ 1.50.0
diff --git a/java/versioned_docs/version-stable/locators.mdx b/java/versioned_docs/version-stable/locators.mdx
index e0a1b717207..cbb508e2a73 100644
--- a/java/versioned_docs/version-stable/locators.mdx
+++ b/java/versioned_docs/version-stable/locators.mdx
@@ -644,7 +644,7 @@ Consider a page with two buttons, the first invisible and the second [visible](.
* This will only find a second button, because it is visible, and then click it.
```java
- page.locator("button").locator("visible=true").click();
+ page.locator("button").filter(new Locator.FilterOptions.setVisible(true)).click();
```
## Lists
diff --git a/java/versioned_docs/version-stable/network.mdx b/java/versioned_docs/version-stable/network.mdx
index f1f4841b151..b269690ccba 100644
--- a/java/versioned_docs/version-stable/network.mdx
+++ b/java/versioned_docs/version-stable/network.mdx
@@ -183,9 +183,13 @@ Playwright uses simplified glob patterns for URL matching in network interceptio
- A double `**` matches any characters including `/`
1. Question mark `?` matches any single character except `/`
1. Curly braces `{}` can be used to match a list of options separated by commas `,`
+1. Square brackets `[]` can be used to match a set of characters
+1. Backslash `\` can be used to escape any of special characters (note to escape backslash itself as `\\`)
Examples:
- `https://example.com/*.js` matches `https://example.com/file.js` but not `https://example.com/path/file.js`
+- `https://example.com/\\?page=1` matches `https://example.com/?page=1` but not `https://example.com`
+- `**/v[0-9]*` matches `https://example.com/v1/` but not `https://example.com/vote/`
- `**/*.js` matches both `https://example.com/file.js` and `https://example.com/path/file.js`
- `**/*.{png,jpg,jpeg}` matches all image requests
diff --git a/java/versioned_docs/version-stable/release-notes.mdx b/java/versioned_docs/version-stable/release-notes.mdx
index cb531626858..513d53f1aca 100644
--- a/java/versioned_docs/version-stable/release-notes.mdx
+++ b/java/versioned_docs/version-stable/release-notes.mdx
@@ -7,6 +7,46 @@ import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
import HTMLCard from '@site/src/components/HTMLCard';
+## Version 1.51
+
+### Highlights
+* New option [setIndexedDB](/api/class-browsercontext.mdx#browser-context-storage-state-option-indexed-db) for [BrowserContext.storageState()](/api/class-browsercontext.mdx#browser-context-storage-state) allows to save and restore IndexedDB contents. Useful when your application uses [IndexedDB API](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) to store authentication tokens, like Firebase Authentication.
+
+ Here is an example following the [authentication guide](./auth.mdx#reusing-signed-in-state):
+
+ ```java
+ // Save storage state into the file. Make sure to include IndexedDB.
+ context.storageState(new BrowserContext.StorageStateOptions()
+ .setPath(Paths.get("state.json"))
+ .setIndexedDB(true));
+
+ // Create a new context with the saved storage state.
+ BrowserContext context = browser.newContext(new Browser.NewContextOptions()
+ .setStorageStatePath(Paths.get("state.json")));
+ ```
+
+* New option [setVisible](/api/class-locator.mdx#locator-filter-option-visible) for [Locator.filter()](/api/class-locator.mdx#locator-filter) allows matching only visible elements.
+
+ ```java
+ // Ignore invisible todo items.
+ Locator todoItems = page.getByTestId("todo-item")
+ .filter(new Locator.FilterOptions().setVisible(true));
+ // Check there are exactly 3 visible ones.
+ assertThat(todoItems).hasCount(3);
+ ```
+
+* New option `setContrast` for methods [Page.emulateMedia()](/api/class-page.mdx#page-emulate-media) and [Browser.newContext()](/api/class-browser.mdx#browser-new-context) allows to emulate the `prefers-contrast` media feature.
+* New option [setFailOnStatusCode](/api/class-apirequest.mdx#api-request-new-context-option-fail-on-status-code) makes all fetch requests made through the [APIRequestContext] throw on response codes other than 2xx and 3xx.
+
+### Browser Versions
+* Chromium 134.0.6998.35
+* Mozilla Firefox 135.0
+* WebKit 18.4
+
+This version was also tested against the following stable channels:
+* Google Chrome 133
+* Microsoft Edge 133
+
## Version 1.50
### Miscellaneous
@@ -796,9 +836,9 @@ This version was also tested against the following stable channels:
```html
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
diff --git a/java/versioned_docs/version-stable/test-runners.mdx b/java/versioned_docs/version-stable/test-runners.mdx
index 8042eb3e4e2..8e7cb20de6a 100644
--- a/java/versioned_docs/version-stable/test-runners.mdx
+++ b/java/versioned_docs/version-stable/test-runners.mdx
@@ -198,7 +198,7 @@ repositories {
}
dependencies {
- implementation 'com.microsoft.playwright:playwright:1.49.0'
+ implementation 'com.microsoft.playwright:playwright:1.50.0'
}
application {
@@ -231,7 +231,7 @@ repositories {
}
dependencies {
- implementation("com.microsoft.playwright:playwright:1.49.0")
+ implementation("com.microsoft.playwright:playwright:1.50.0")
}
application {
diff --git a/java/versioned_docs/version-stable/touch-events.mdx b/java/versioned_docs/version-stable/touch-events.mdx
index f2d37e1a1f0..566353bff89 100644
--- a/java/versioned_docs/version-stable/touch-events.mdx
+++ b/java/versioned_docs/version-stable/touch-events.mdx
@@ -1,6 +1,6 @@
---
id: touch-events
-title: "Emulating touch events"
+title: "Touch events (legacy)"
---
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
@@ -8,22 +8,146 @@ import HTMLCard from '@site/src/components/HTMLCard';
## Introduction
-Mobile web sites may listen to [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) and react to user touch gestures such as swipe, pinch, tap etc. To test this functionality you can manually generate [TouchEvent]s in the page context using [Locator.evaluate()](/api/class-locator.mdx#locator-evaluate).
+Web applications that handle legacy [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) to respond to gestures like swipe, pinch, and tap can be tested by manually dispatching [TouchEvent](https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/TouchEvent)s to the page. The examples below demonstrate how to use [Locator.dispatchEvent()](/api/class-locator.mdx#locator-dispatch-event) and pass [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points as arguments.
-If your web application relies on [pointer events](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events) instead of touch events, you can use [Locator.click()](/api/class-locator.mdx#locator-click) and raw [`Mouse`] events to simulate a single-finger touch, and this will trigger all the same pointer events.
+### Emulating pan gesture
-### Dispatching TouchEvent
+In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
-You can dispatch touch events to the page using [Locator.dispatchEvent()](/api/class-locator.mdx#locator-dispatch-event). [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points can be passed as arguments, see examples below.
+```java
+import com.microsoft.playwright.*;
+import com.microsoft.playwright.options.*;
-#### Emulating pan gesture
+public class TouchEvents {
+ public static void main(String[] args) {
+ try (Playwright playwright = Playwright.create()) {
+ Browser browser = playwright.chromium().launch();
+ BrowserContext context = browser.newContext(new Browser.NewContextOptions()
+ .setViewportSize(412, 839)
+ .setDeviceScaleFactor(2.625)
+ .setUserAgent("Mozilla/5.0 (Linux; Android 12; Pixel 7 Build/SP1A.210812.015) AppleWebKit/537.36" +
+ " (KHTML, like Gecko) Chrome/94.0.4606.71 Mobile Safari/537.36")
+ .setHasTouch(true)
+ .setIsMobile(true)
+ );
+ Page page = context.newPage();
-In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
+ page.navigate("https://www.google.com/maps/place/@37.4117722,-122.0713234,15z", new Page.NavigateOptions().setWaitUntil(WaitUntilState.COMMIT));
+ page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Keep using web")).click();
+ page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Keep using web")).waitFor(
+ new Locator.WaitForOptions().setState(WaitForSelectorState.HIDDEN));
+
+ Locator met = page.locator("[data-test-id='met']");
+ for (int i = 0; i < 5; i++) {
+ pan(met, 200, 100);
+ }
+ page.screenshot(new Page.ScreenshotOptions().setPath(Paths.get("screenshot.png")));
+ }
+ }
+
+ public static void pan(Locator locator, int deltaX, int deltaY) {
+ pan(locator, deltaX, deltaY, 5);
+ }
+
+ public static void pan(Locator locator, int deltaX, int deltaY, int steps) {
+ BoundingBox bounds = locator.boundingBox();
+ double centerX = bounds.x + bounds.width / 2;
+ double centerY = bounds.y + bounds.height / 2;
-#### Emulating pinch gesture
+ List> touches = List.of(Map.of(
+ "identifier", 0,
+ "clientX", centerX,
+ "clientY", centerY
+ ));
+ locator.dispatchEvent("touchstart", Map.of(
+ "touches", touches,
+ "changedTouches", touches,
+ "targetTouches", touches
+ ));
+
+ for (int i = 1; i <= steps; i++) {
+ touches = List.of(Map.of(
+ "identifier", 0,
+ "clientX", centerX + deltaX * i / steps,
+ "clientY", centerY + deltaY * i / steps
+ ));
+ locator.dispatchEvent("touchmove", Map.of(
+ "touches", touches,
+ "changedTouches", touches,
+ "targetTouches", touches
+ ));
+ }
+
+ locator.dispatchEvent("touchend");
+ }
+}
+```
+
+### Emulating pinch gesture
In the example below, we emulate pinch gesture, i.e. two touch points moving closer to each other. It is expected to zoom out the map. The app under test only uses `clientX/clientY` coordinates of touch points, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
+```java
+import com.microsoft.playwright.*;
+import com.microsoft.playwright.options.*;
+
+public class TouchEvents {
+ public static void main(String[] args) {
+ try (Playwright playwright = Playwright.create()) {
+ Browser browser = playwright.chromium().launch();
+ BrowserContext context = browser.newContext(new Browser.NewContextOptions()
+ .setViewportSize(412, 839)
+ .setDeviceScaleFactor(2.625)
+ .setUserAgent("Mozilla/5.0 (Linux; Android 12; Pixel 7 Build/SP1A.210812.015) AppleWebKit/537.36" +
+ " (KHTML, like Gecko) Chrome/94.0.4606.71 Mobile Safari/537.36")
+ .setHasTouch(true)
+ .setIsMobile(true)
+ );
+ Page page = context.newPage();
+
+ page.navigate("https://www.google.com/maps/place/@37.4117722,-122.0713234,15z", new Page.NavigateOptions().setWaitUntil(WaitUntilState.COMMIT));
+ page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Keep using web")).click();
+ page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Keep using web")).waitFor(
+ new Locator.WaitForOptions().setState(WaitForSelectorState.HIDDEN));
+
+ Locator met = page.locator("[data-test-id='met']");
+ for (int i = 0; i < 5; i++) {
+ pinch(met, 40, "in");
+ }
+ page.screenshot(new Page.ScreenshotOptions().setPath(Paths.get("screenshot.png")));
+ }
+ }
+
+ public static void pinch(Locator locator, int deltaX, String direction) {
+ pinch(locator, deltaX, direction, 5);
+ }
+
+ public static void pinch(Locator locator, int deltaX, String direction, int steps) {
+ BoundingBox bounds = locator.boundingBox();
+ double centerX = bounds.x + bounds.width / 2;
+ double centerY = bounds.y + bounds.height / 2;
+ double stepDeltaX = deltaX / (steps + 1.0);
+
+ List> touches = List.of(
+ Map.of("identifier", 0, "clientX", centerX - (direction.equals("in") ? deltaX : stepDeltaX), "clientY", centerY),
+ Map.of("identifier", 1, "clientX", centerX + (direction.equals("in") ? deltaX : stepDeltaX), "clientY", centerY)
+ );
+ locator.dispatchEvent("touchstart", Map.of("touches", touches, "changedTouches", touches, "targetTouches", touches));
+
+ for (int i = 1; i <= steps; i++) {
+ double offset = direction.equals("in") ? (deltaX - i * stepDeltaX) : (stepDeltaX * (i + 1));
+ touches = List.of(
+ Map.of("identifier", 0, "clientX", centerX - offset, "clientY", centerY),
+ Map.of("identifier", 1, "clientX", centerX + offset, "clientY", centerY)
+ );
+ locator.dispatchEvent("touchmove", Map.of("touches", touches, "changedTouches", touches, "targetTouches", touches));
+ }
+
+ locator.dispatchEvent("touchend", Map.of("touches", List.of(), "changedTouches", List.of(), "targetTouches", List.of()));
+ }
+}
+```
+
[APIRequest]: /api/class-apirequest.mdx "APIRequest"
[APIRequestContext]: /api/class-apirequestcontext.mdx "APIRequestContext"
diff --git a/java/versioned_sidebars/version-stable-sidebars.json b/java/versioned_sidebars/version-stable-sidebars.json
index a8b54de80df..635b9a951ac 100644
--- a/java/versioned_sidebars/version-stable-sidebars.json
+++ b/java/versioned_sidebars/version-stable-sidebars.json
@@ -163,6 +163,10 @@
"type": "doc",
"id": "codegen"
},
+ {
+ "type": "doc",
+ "id": "touch-events"
+ },
{
"type": "doc",
"id": "trace-viewer"
diff --git a/nodejs/versioned_docs/version-stable/accessibility-testing.mdx b/nodejs/versioned_docs/version-stable/accessibility-testing.mdx
index ce843012281..c6745d1b0b6 100644
--- a/nodejs/versioned_docs/version-stable/accessibility-testing.mdx
+++ b/nodejs/versioned_docs/version-stable/accessibility-testing.mdx
@@ -394,6 +394,7 @@ test('example using custom fixture', async ({ page, makeAxeBuilder }) => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/actionability.mdx b/nodejs/versioned_docs/version-stable/actionability.mdx
index eadb8f491fd..c1a305d5eb9 100644
--- a/nodejs/versioned_docs/version-stable/actionability.mdx
+++ b/nodejs/versioned_docs/version-stable/actionability.mdx
@@ -183,6 +183,7 @@ For example, consider a scenario where Playwright will click `Sign Up` button re
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api-testing.mdx b/nodejs/versioned_docs/version-stable/api-testing.mdx
index c6c6b561c4d..263dad2afcc 100644
--- a/nodejs/versioned_docs/version-stable/api-testing.mdx
+++ b/nodejs/versioned_docs/version-stable/api-testing.mdx
@@ -434,6 +434,7 @@ test('global context request has isolated cookie storage', async ({
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-accessibility.mdx b/nodejs/versioned_docs/version-stable/api/class-accessibility.mdx
index 8857c5cbcd9..9f4f478a56d 100644
--- a/nodejs/versioned_docs/version-stable/api/class-accessibility.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-accessibility.mdx
@@ -217,6 +217,7 @@ function findFocusedNode(node) {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-android.mdx b/nodejs/versioned_docs/version-stable/api/class-android.mdx
index cc456e63f9b..180b780be04 100644
--- a/nodejs/versioned_docs/version-stable/api/class-android.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-android.mdx
@@ -304,6 +304,7 @@ android.setDefaultTimeout(timeout);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-androiddevice.mdx b/nodejs/versioned_docs/version-stable/api/class-androiddevice.mdx
index e97487bd37d..b5907d300d4 100644
--- a/nodejs/versioned_docs/version-stable/api/class-androiddevice.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-androiddevice.mdx
@@ -219,6 +219,9 @@ await androidDevice.launchBrowser(options);
- `colorScheme` [null] | "light" | "dark" | "no-preference" *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `contrast` [null] | "no-preference" | "more" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `deviceScaleFactor` [number] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -992,6 +995,7 @@ androidDevice.on('webview', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-androidinput.mdx b/nodejs/versioned_docs/version-stable/api/class-androidinput.mdx
index 2c165c20f7a..30ab549be38 100644
--- a/nodejs/versioned_docs/version-stable/api/class-androidinput.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-androidinput.mdx
@@ -218,6 +218,7 @@ await androidInput.type(text);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-androidsocket.mdx b/nodejs/versioned_docs/version-stable/api/class-androidsocket.mdx
index b95e6947a2a..2aceae3d950 100644
--- a/nodejs/versioned_docs/version-stable/api/class-androidsocket.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-androidsocket.mdx
@@ -145,6 +145,7 @@ androidSocket.on('data', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-androidwebview.mdx b/nodejs/versioned_docs/version-stable/api/class-androidwebview.mdx
index e8ea2e595af..83b8198e26e 100644
--- a/nodejs/versioned_docs/version-stable/api/class-androidwebview.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-androidwebview.mdx
@@ -140,6 +140,7 @@ androidWebView.on('close', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-apirequest.mdx b/nodejs/versioned_docs/version-stable/api/class-apirequest.mdx
index b9923373406..565a337effa 100644
--- a/nodejs/versioned_docs/version-stable/api/class-apirequest.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-apirequest.mdx
@@ -75,6 +75,9 @@ await apiRequest.newContext(options);
- `extraHTTPHeaders` [Object]<[string], [string]> *(optional)*#
An object containing additional HTTP headers to be sent with every request. Defaults to none.
+ - `failOnStatusCode` [boolean] *(optional)* Added in: v1.51 #
+
+ Whether to throw on response codes other than 2xx and 3xx. By default response object is returned for all status codes.
- `httpCredentials` [Object] *(optional)*#
- `username` [string]
@@ -220,6 +223,7 @@ await apiRequest.newContext(options);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-apirequestcontext.mdx b/nodejs/versioned_docs/version-stable/api/class-apirequestcontext.mdx
index b98afee46f3..becb68c8048 100644
--- a/nodejs/versioned_docs/version-stable/api/class-apirequestcontext.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-apirequestcontext.mdx
@@ -575,6 +575,9 @@ await apiRequestContext.storageState(options);
**Arguments**
- `options` [Object] *(optional)*
+ - `indexedDB` [boolean] *(optional)* Added in: v1.51 #
+
+ Set to `true` to include IndexedDB in the storage state snapshot.
- `path` [string] *(optional)*#
The file path to save the storage state to. If [path](/api/class-apirequestcontext.mdx#api-request-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
@@ -682,6 +685,7 @@ await apiRequestContext.storageState(options);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-apiresponse.mdx b/nodejs/versioned_docs/version-stable/api/class-apiresponse.mdx
index 658816871ab..c9e92db9165 100644
--- a/nodejs/versioned_docs/version-stable/api/class-apiresponse.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-apiresponse.mdx
@@ -251,6 +251,7 @@ apiResponse.url();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-apiresponseassertions.mdx b/nodejs/versioned_docs/version-stable/api/class-apiresponseassertions.mdx
index 83366ee0a42..1c91dbdf8ab 100644
--- a/nodejs/versioned_docs/version-stable/api/class-apiresponseassertions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-apiresponseassertions.mdx
@@ -123,6 +123,7 @@ expect(response).not
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-browser.mdx b/nodejs/versioned_docs/version-stable/api/class-browser.mdx
index b6a33880ae4..80eb162fe7b 100644
--- a/nodejs/versioned_docs/version-stable/api/class-browser.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-browser.mdx
@@ -217,6 +217,9 @@ If directly using this method to create [BrowserContext]s, it is best practice t
- `colorScheme` [null] | "light" | "dark" | "no-preference" *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `contrast` [null] | "no-preference" | "more" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `deviceScaleFactor` [number] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -379,9 +382,9 @@ If directly using this method to create [BrowserContext]s, it is best practice t
- `value` [string]
-
- localStorage to set for context
-
+ localStorage to set for context
+
+
Learn more about [storage state and auth](../auth.mdx).
Populates context with given storage state. This option can be used to initialize context with logged-in information obtained via [browserContext.storageState()](/api/class-browsercontext.mdx#browser-context-storage-state).
@@ -501,6 +504,9 @@ await browser.newPage(options);
- `colorScheme` [null] | "light" | "dark" | "no-preference" *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `contrast` [null] | "no-preference" | "more" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `deviceScaleFactor` [number] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -663,9 +669,9 @@ await browser.newPage(options);
- `value` [string]
-
- localStorage to set for context
-
+ localStorage to set for context
+
+
Learn more about [storage state and auth](../auth.mdx).
Populates context with given storage state. This option can be used to initialize context with logged-in information obtained via [browserContext.storageState()](/api/class-browsercontext.mdx#browser-context-storage-state).
@@ -902,6 +908,7 @@ browser.on('disconnected', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-browsercontext.mdx b/nodejs/versioned_docs/version-stable/api/class-browsercontext.mdx
index 9aa8a597894..a8b23480833 100644
--- a/nodejs/versioned_docs/version-stable/api/class-browsercontext.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-browsercontext.mdx
@@ -847,7 +847,7 @@ await browserContext.setOffline(offline);
Added before v1.9 browserContext.storageState
-Returns storage state for this browser context, contains current cookies and local storage snapshot.
+Returns storage state for this browser context, contains current cookies, local storage snapshot and IndexedDB snapshot.
**Usage**
@@ -858,6 +858,15 @@ await browserContext.storageState(options);
**Arguments**
- `options` [Object] *(optional)*
+ - `indexedDB` [boolean] *(optional)* Added in: v1.51 #
+
+ Set to `true` to include [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) in the storage state snapshot. If your application uses IndexedDB to store authentication tokens, like Firebase Authentication, enable this.
+
+ :::note
+
+ IndexedDBs with typed arrays are currently not supported.
+ :::
+
- `path` [string] *(optional)*#
The file path to save the storage state to. If [path](/api/class-browsercontext.mdx#browser-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
@@ -1377,6 +1386,7 @@ await browserContext.setHTTPCredentials(httpCredentials);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-browserserver.mdx b/nodejs/versioned_docs/version-stable/api/class-browserserver.mdx
index 013b29ac241..2dfdc6c3aac 100644
--- a/nodejs/versioned_docs/version-stable/api/class-browserserver.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-browserserver.mdx
@@ -159,6 +159,7 @@ browserServer.on('close', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-browsertype.mdx b/nodejs/versioned_docs/version-stable/api/class-browsertype.mdx
index b96ebeae216..fbdf67d9568 100644
--- a/nodejs/versioned_docs/version-stable/api/class-browsertype.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-browsertype.mdx
@@ -30,7 +30,12 @@ const { chromium } = require('playwright'); // Or 'firefox' or 'webkit'.
Added before v1.9 browserType.connect
-This method attaches Playwright to an existing browser instance. When connecting to another browser launched via `BrowserType.launchServer` in Node.js, the major and minor version needs to match the client version (1.2.3 → is compatible with 1.2.x).
+This method attaches Playwright to an existing browser instance created via `BrowserType.launchServer` in Node.js.
+
+:::note
+
+The major and minor version of the Playwright instance that connects needs to match the version of Playwright that launches the browser (1.2.3 → is compatible with 1.2.x).
+:::
**Usage**
@@ -42,7 +47,7 @@ await browserType.connect(wsEndpoint, options);
**Arguments**
- `wsEndpoint` [string] Added in: v1.10 #
- A browser websocket endpoint to connect to.
+ A Playwright browser websocket endpoint to connect to. You obtain this endpoint via `BrowserServer.wsEndpoint`.
- `options` [Object] *(optional)*
- `exposeNetwork` [string] *(optional)* Added in: v1.37 #
@@ -88,6 +93,10 @@ The default browser context is accessible via [browser.contexts()](/api/class-br
Connecting over the Chrome DevTools Protocol is only supported for Chromium-based browsers.
:::
+:::note
+This connection is significantly lower fidelity than the Playwright protocol connection via [browserType.connect()](/api/class-browsertype.mdx#browser-type-connect). If you are experiencing issues or attempting to use advanced functionality, you probably want to use [browserType.connect()](/api/class-browsertype.mdx#browser-type-connect).
+:::
+
**Usage**
```js
@@ -339,6 +348,9 @@ await browserType.launchPersistentContext(userDataDir, options);
- `colorScheme` [null] | "light" | "dark" | "no-preference" *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'light'`.
+ - `contrast` [null] | "no-preference" | "more" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulateMedia()](/api/class-page.mdx#page-emulate-media) for more details. Passing `null` resets emulation to system defaults. Defaults to `'no-preference'`.
- `deviceScaleFactor` [number] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -751,6 +763,7 @@ browserType.name();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-cdpsession.mdx b/nodejs/versioned_docs/version-stable/api/class-cdpsession.mdx
index aa6eb9b30c6..8d321cacdf0 100644
--- a/nodejs/versioned_docs/version-stable/api/class-cdpsession.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-cdpsession.mdx
@@ -131,6 +131,7 @@ await cdpSession.send(method, params);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-clock.mdx b/nodejs/versioned_docs/version-stable/api/class-clock.mdx
index ea161c85563..20fdb94a376 100644
--- a/nodejs/versioned_docs/version-stable/api/class-clock.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-clock.mdx
@@ -259,6 +259,7 @@ await page.clock.setSystemTime('2020-02-02');
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-consolemessage.mdx b/nodejs/versioned_docs/version-stable/api/class-consolemessage.mdx
index 1f077fb142e..f82c991d2d2 100644
--- a/nodejs/versioned_docs/version-stable/api/class-consolemessage.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-consolemessage.mdx
@@ -187,6 +187,7 @@ consoleMessage.type();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-coverage.mdx b/nodejs/versioned_docs/version-stable/api/class-coverage.mdx
index ea0c912de7b..4c64d6cf908 100644
--- a/nodejs/versioned_docs/version-stable/api/class-coverage.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-coverage.mdx
@@ -243,6 +243,7 @@ await coverage.stopJSCoverage();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-dialog.mdx b/nodejs/versioned_docs/version-stable/api/class-dialog.mdx
index 31498e9f698..1f3347fc018 100644
--- a/nodejs/versioned_docs/version-stable/api/class-dialog.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-dialog.mdx
@@ -202,6 +202,7 @@ dialog.type();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-download.mdx b/nodejs/versioned_docs/version-stable/api/class-download.mdx
index 81c5b7a28d4..1b22f24a763 100644
--- a/nodejs/versioned_docs/version-stable/api/class-download.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-download.mdx
@@ -247,6 +247,7 @@ download.url();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-electron.mdx b/nodejs/versioned_docs/version-stable/api/class-electron.mdx
index eb70ca4ded7..f73104f385d 100644
--- a/nodejs/versioned_docs/version-stable/api/class-electron.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-electron.mdx
@@ -240,6 +240,7 @@ await electron.launch(options);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-electronapplication.mdx b/nodejs/versioned_docs/version-stable/api/class-electronapplication.mdx
index 2efeeadda3f..544f41b9c1e 100644
--- a/nodejs/versioned_docs/version-stable/api/class-electronapplication.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-electronapplication.mdx
@@ -371,6 +371,7 @@ electronApplication.on('window', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-elementhandle.mdx b/nodejs/versioned_docs/version-stable/api/class-elementhandle.mdx
index 7b08ae54f81..9f11669d1a8 100644
--- a/nodejs/versioned_docs/version-stable/api/class-elementhandle.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-elementhandle.mdx
@@ -1054,7 +1054,7 @@ await elementHandle.screenshot(options);
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -1646,6 +1646,7 @@ This method does not work across navigations, use [page.waitForSelector()](/api/
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-filechooser.mdx b/nodejs/versioned_docs/version-stable/api/class-filechooser.mdx
index 2d32c959c4b..99f5cb32318 100644
--- a/nodejs/versioned_docs/version-stable/api/class-filechooser.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-filechooser.mdx
@@ -174,6 +174,7 @@ await fileChooser.setFiles(files, options);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-fixtures.mdx b/nodejs/versioned_docs/version-stable/api/class-fixtures.mdx
index 2ddf2f800de..7425517af01 100644
--- a/nodejs/versioned_docs/version-stable/api/class-fixtures.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-fixtures.mdx
@@ -207,6 +207,7 @@ test('basic test', async ({ request }) => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-frame.mdx b/nodejs/versioned_docs/version-stable/api/class-frame.mdx
index 999002421f0..397db6b0ccb 100644
--- a/nodejs/versioned_docs/version-stable/api/class-frame.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-frame.mdx
@@ -2711,6 +2711,7 @@ await frame.waitForTimeout(timeout);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-framelocator.mdx b/nodejs/versioned_docs/version-stable/api/class-framelocator.mdx
index 71aa40e584c..5282e3eab77 100644
--- a/nodejs/versioned_docs/version-stable/api/class-framelocator.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-framelocator.mdx
@@ -596,6 +596,7 @@ frameLocator.nth(index);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-fullconfig.mdx b/nodejs/versioned_docs/version-stable/api/class-fullconfig.mdx
index 374d896cf3e..39899fdd35f 100644
--- a/nodejs/versioned_docs/version-stable/api/class-fullconfig.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-fullconfig.mdx
@@ -251,10 +251,10 @@ fullConfig.reportSlowTests
- [null] | [Object]
- `max` [number]
- The maximum number of slow test files to report. Defaults to `5`.
+ The maximum number of slow test files to report.
- `threshold` [number]
- Test duration in milliseconds that is considered slow. Defaults to 15 seconds.
+ Test file duration in milliseconds that is considered slow.
---
@@ -465,6 +465,7 @@ fullConfig.workers
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-fullproject.mdx b/nodejs/versioned_docs/version-stable/api/class-fullproject.mdx
index 614c68e2c40..edc9d6deb17 100644
--- a/nodejs/versioned_docs/version-stable/api/class-fullproject.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-fullproject.mdx
@@ -328,6 +328,7 @@ fullProject.use
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-genericassertions.mdx b/nodejs/versioned_docs/version-stable/api/class-genericassertions.mdx
index 13be57c95d2..52e3c4d3761 100644
--- a/nodejs/versioned_docs/version-stable/api/class-genericassertions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-genericassertions.mdx
@@ -820,6 +820,7 @@ expect(value).not
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-jshandle.mdx b/nodejs/versioned_docs/version-stable/api/class-jshandle.mdx
index 4fa5627b083..6139cef830c 100644
--- a/nodejs/versioned_docs/version-stable/api/class-jshandle.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-jshandle.mdx
@@ -245,6 +245,7 @@ await jsHandle.jsonValue();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-keyboard.mdx b/nodejs/versioned_docs/version-stable/api/class-keyboard.mdx
index 6764db194b2..850dfba6383 100644
--- a/nodejs/versioned_docs/version-stable/api/class-keyboard.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-keyboard.mdx
@@ -286,6 +286,7 @@ await keyboard.up(key);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-location.mdx b/nodejs/versioned_docs/version-stable/api/class-location.mdx
index cbb3f6505d0..c44e9ecbc0f 100644
--- a/nodejs/versioned_docs/version-stable/api/class-location.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-location.mdx
@@ -124,6 +124,7 @@ location.line
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-locator.mdx b/nodejs/versioned_docs/version-stable/api/class-locator.mdx
index cb6b4057b23..fde0b17d8c4 100644
--- a/nodejs/versioned_docs/version-stable/api/class-locator.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-locator.mdx
@@ -654,11 +654,6 @@ Execute JavaScript code in the page, taking the matching element as an argument.
**Usage**
-```js
-const tweets = page.locator('.tweet .retweets');
-expect(await tweets.evaluate(node => node.innerText)).toBe('10 retweets');
-```
-
**Arguments**
- `pageFunction` [function] | [string]#
@@ -842,6 +837,9 @@ await rowLocator
- `hasText` [string] | [RegExp] *(optional)*#
Matches elements containing specified text somewhere inside, possibly in a child or a descendant element. When passed a [string], matching is case-insensitive and searches for a substring. For example, `"Playwright"` matches `Playwright
Added in: v1.51 #
+
+ Only matches visible or invisible elements.
**Returns**
- [Locator]#
@@ -1882,7 +1880,7 @@ await page.getByRole('link').screenshot({ animations: 'disabled', path: 'link.pn
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -1959,9 +1957,9 @@ Selects option or options in ``.
```html
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
@@ -2180,7 +2178,7 @@ This method expects [Locator] to point to an [input element](https://developer.m
Added in: v1.14 locator.tap
-Perform a tap gesture on the element matching the locator.
+Perform a tap gesture on the element matching the locator. For examples of emulating other gestures by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
**Usage**
@@ -2519,6 +2517,7 @@ To press a special key, like `Control` or `ArrowDown`, use [locator.press()](/ap
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-locatorassertions.mdx b/nodejs/versioned_docs/version-stable/api/class-locatorassertions.mdx
index f74b89731bf..17aeef932e7 100644
--- a/nodejs/versioned_docs/version-stable/api/class-locatorassertions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-locatorassertions.mdx
@@ -734,7 +734,7 @@ Note that screenshot assertions only work with Playwright test runner.
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-locatorassertions.mdx#locator-assertions-to-have-screenshot-1-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-locatorassertions.mdx#locator-assertions-to-have-screenshot-1-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -796,7 +796,7 @@ Note that screenshot assertions only work with Playwright test runner.
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-locatorassertions.mdx#locator-assertions-to-have-screenshot-2-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-locatorassertions.mdx#locator-assertions-to-have-screenshot-2-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -997,13 +997,13 @@ await expect(page.locator('body')).toMatchAriaSnapshot(`
Asserts that the target element matches the given [accessibility snapshot](../aria-snapshots.mdx).
-Snapshot is stored in a separate `.yml` file in a location configured by `expect.toMatchAriaSnapshot.pathTemplate` and/or `snapshotPathTemplate` properties in the configuration file.
+Snapshot is stored in a separate `.aria.yml` file in a location configured by `expect.toMatchAriaSnapshot.pathTemplate` and/or `snapshotPathTemplate` properties in the configuration file.
**Usage**
```js
await expect(page.locator('body')).toMatchAriaSnapshot();
-await expect(page.locator('body')).toMatchAriaSnapshot({ name: 'body.yml' });
+await expect(page.locator('body')).toMatchAriaSnapshot({ name: 'body.aria.yml' });
```
**Arguments**
@@ -1102,6 +1102,7 @@ expect(locator).not
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-logger.mdx b/nodejs/versioned_docs/version-stable/api/class-logger.mdx
index f0e318ca0d3..fcd4d46896d 100644
--- a/nodejs/versioned_docs/version-stable/api/class-logger.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-logger.mdx
@@ -140,6 +140,7 @@ logger.log(name, severity, message, args, hints);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-mouse.mdx b/nodejs/versioned_docs/version-stable/api/class-mouse.mdx
index 948453c7b58..415de779f99 100644
--- a/nodejs/versioned_docs/version-stable/api/class-mouse.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-mouse.mdx
@@ -269,6 +269,7 @@ await mouse.wheel(deltaX, deltaY);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-page.mdx b/nodejs/versioned_docs/version-stable/api/class-page.mdx
index 959fbf6f51a..a13f5499b80 100644
--- a/nodejs/versioned_docs/version-stable/api/class-page.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-page.mdx
@@ -449,6 +449,9 @@ await page.evaluate(() => matchMedia('(prefers-color-scheme: light)').matches);
- `colorScheme` [null] | "light" | "dark" | "no-preference" *(optional)* Added in: v1.9 #
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. Passing `null` disables color scheme emulation. `'no-preference'` is deprecated.
+ - `contrast` [null] | "no-preference" | "more" *(optional)* Added in: v1.51 #
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. Passing `null` disables contrast emulation.
- `forcedColors` [null] | "active" | "none" *(optional)* Added in: v1.15 #
Emulates `'forced-colors'` media feature, supported values are `'active'` and `'none'`. Passing `null` disables forced colors emulation.
@@ -1760,7 +1763,7 @@ await page.screenshot(options);
When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Defaults to `false`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -4517,6 +4520,7 @@ await page.waitForTimeout(1000);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-pageassertions.mdx b/nodejs/versioned_docs/version-stable/api/class-pageassertions.mdx
index 0769c76fe91..5c71ee88b6d 100644
--- a/nodejs/versioned_docs/version-stable/api/class-pageassertions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-pageassertions.mdx
@@ -73,7 +73,7 @@ Note that screenshot assertions only work with Playwright test runner.
When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Defaults to `false`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-pageassertions.mdx#page-assertions-to-have-screenshot-1-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-pageassertions.mdx#page-assertions-to-have-screenshot-1-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -152,7 +152,7 @@ Note that screenshot assertions only work with Playwright test runner.
When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Defaults to `false`.
- `mask` [Array]<[Locator]> *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-pageassertions.mdx#page-assertions-to-have-screenshot-2-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [maskColor](/api/class-pageassertions.mdx#page-assertions-to-have-screenshot-2-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `maskColor` [string] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -220,17 +220,28 @@ Ensures the page is navigated to the given URL.
**Usage**
```js
-await expect(page).toHaveURL(/.*checkout/);
+// Check for the page URL to be 'https://playwright.dev/docs/intro' (including query string)
+await expect(page).toHaveURL('https://playwright.dev/docs/intro');
+
+// Check for the page URL to contain 'doc', followed by an optional 's', followed by '/'
+await expect(page).toHaveURL(/docs?\//);
+
+// Check for the predicate to be satisfied
+// For example: verify query strings
+await expect(page).toHaveURL(url => {
+ const params = url.searchParams;
+ return params.has('search') && params.has('options') && params.get('id') === '5';
+});
```
**Arguments**
-- `urlOrRegExp` [string] | [RegExp] Added in: v1.18 #
+- `url` [string] | [RegExp] | [function]\([URL]\):[boolean] Added in: v1.18 #
- Expected URL string or RegExp.
+ Expected URL string, RegExp, or predicate receiving [URL] to match. When [baseURL](/api/class-browser.mdx#browser-new-context-option-base-url) is provided via the context options and the `url` argument is a string, the two values are merged via the [`new URL()`](https://developer.mozilla.org/en-US/docs/Web/API/URL/URL) constructor and used for the comparison against the current browser URL.
- `options` [Object] *(optional)*
- `ignoreCase` [boolean] *(optional)* Added in: v1.44 #
- Whether to perform case-insensitive match. [ignoreCase](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression flag if specified.
+ Whether to perform case-insensitive match. [ignoreCase](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression parameter if specified. A provided predicate ignores this flag.
- `timeout` [number] *(optional)* Added in: v1.18 #
Time to retry the assertion for in milliseconds. Defaults to `timeout` in `TestConfig.expect`.
@@ -322,6 +333,7 @@ expect(page).not
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-playwright.mdx b/nodejs/versioned_docs/version-stable/api/class-playwright.mdx
index b979d3dfa3d..50abdcfeb58 100644
--- a/nodejs/versioned_docs/version-stable/api/class-playwright.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-playwright.mdx
@@ -237,6 +237,7 @@ playwright.webkit
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-playwrightassertions.mdx b/nodejs/versioned_docs/version-stable/api/class-playwrightassertions.mdx
index 124db037d32..975832568a5 100644
--- a/nodejs/versioned_docs/version-stable/api/class-playwrightassertions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-playwrightassertions.mdx
@@ -165,6 +165,7 @@ Creates a [PageAssertions] object for the given [Page].
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-reporter.mdx b/nodejs/versioned_docs/version-stable/api/class-reporter.mdx
index db729dbf0f9..20dea760129 100644
--- a/nodejs/versioned_docs/version-stable/api/class-reporter.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-reporter.mdx
@@ -432,6 +432,7 @@ reporter.printsToStdio();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-request.mdx b/nodejs/versioned_docs/version-stable/api/class-request.mdx
index 2bfe14b7c20..097954e0605 100644
--- a/nodejs/versioned_docs/version-stable/api/class-request.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-request.mdx
@@ -509,6 +509,7 @@ request.url();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-response.mdx b/nodejs/versioned_docs/version-stable/api/class-response.mdx
index b1742f443ed..9708a479779 100644
--- a/nodejs/versioned_docs/version-stable/api/class-response.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-response.mdx
@@ -417,6 +417,7 @@ response.url();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-route.mdx b/nodejs/versioned_docs/version-stable/api/class-route.mdx
index ebb8e2b9806..397084de020 100644
--- a/nodejs/versioned_docs/version-stable/api/class-route.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-route.mdx
@@ -365,6 +365,7 @@ route.request();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-selectors.mdx b/nodejs/versioned_docs/version-stable/api/class-selectors.mdx
index 4187981b30b..5408cb3db3b 100644
--- a/nodejs/versioned_docs/version-stable/api/class-selectors.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-selectors.mdx
@@ -160,6 +160,7 @@ selectors.setTestIdAttribute(attributeName);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-snapshotassertions.mdx b/nodejs/versioned_docs/version-stable/api/class-snapshotassertions.mdx
index c1c6b790bc8..25a2815b07a 100644
--- a/nodejs/versioned_docs/version-stable/api/class-snapshotassertions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-snapshotassertions.mdx
@@ -178,6 +178,7 @@ Note that matching snapshots only work with Playwright test runner.
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-suite.mdx b/nodejs/versioned_docs/version-stable/api/class-suite.mdx
index 3e928dab195..5e78d23b6ae 100644
--- a/nodejs/versioned_docs/version-stable/api/class-suite.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-suite.mdx
@@ -264,6 +264,7 @@ suite.type
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-test.mdx b/nodejs/versioned_docs/version-stable/api/class-test.mdx
index 99e295421be..5f91549f426 100644
--- a/nodejs/versioned_docs/version-stable/api/class-test.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-test.mdx
@@ -1365,7 +1365,7 @@ test('test', async ({ page }) => {
- `title` [string]#
Step name.
-- `body` [function]\(\):[Promise]<[Object]>#
+- `body` [function]\([TestStepInfo]\):[Promise]<[Object]>#
Step body.
- `options` [Object] *(optional)*
@@ -1515,7 +1515,9 @@ test('example', async ({ page }) => {
Added in: v1.50 test.test.step.skip
-Mark a test step as "skip" to temporarily disable its execution, useful for steps that are currently failing and planned for a near-term fix. Playwright will not run the step.
+Mark a test step as "skip" to temporarily disable its execution, useful for steps that are currently failing and planned for a near-term fix. Playwright will not run the step. See also [testStepInfo.skip()](/api/class-teststepinfo.mdx#test-step-info-skip-2).
+
+We recommend [testStepInfo.skip()](/api/class-teststepinfo.mdx#test-step-info-skip-1) instead.
**Usage**
@@ -1924,6 +1926,7 @@ test.describe.serial.only(() => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testcase.mdx b/nodejs/versioned_docs/version-stable/api/class-testcase.mdx
index 9bd83ef5a0f..8093f51cfc3 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testcase.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testcase.mdx
@@ -354,6 +354,7 @@ testCase.type
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testconfig.mdx b/nodejs/versioned_docs/version-stable/api/class-testconfig.mdx
index 81ce6b2fd15..a09d3d19890 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testconfig.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testconfig.mdx
@@ -53,6 +53,46 @@ export default defineConfig({
---
+### captureGitInfo {#test-config-capture-git-info}
+
+Added in: v1.51 testConfig.captureGitInfo
+
+These settings control whether git information is captured and stored in the config [testConfig.metadata](/api/class-testconfig.mdx#test-config-metadata).
+
+**Usage**
+
+```js title="playwright.config.ts"
+import { defineConfig } from '@playwright/test';
+
+export default defineConfig({
+ captureGitInfo: { commit: true, diff: true }
+});
+```
+
+**Type**
+- [Object]
+ - `commit` [boolean] *(optional)*
+
+ Whether to capture commit and pull request information such as hash, author, timestamp.
+ - `diff` [boolean] *(optional)*
+
+ Whether to capture commit diff.
+
+**Details**
+* Capturing `commit` information is useful when you'd like to see it in your HTML (or a third party) report.
+* Capturing `diff` information is useful to enrich the report with the actual source diff. This information can be used to provide intelligent advice on how to fix the test.
+
+:::note
+
+Default values for these settings depend on the environment. When tests run as a part of CI where it is safe to obtain git information, the default value is `true`, `false` otherwise.
+:::
+
+:::note
+The structure of the git commit metadata is subject to change.
+:::
+
+---
+
### expect {#test-config-expect}
Added in: v1.10 testConfig.expect
@@ -341,7 +381,7 @@ export default defineConfig({
Added in: v1.10 testConfig.metadata
-Metadata that will be put directly to the test report serialized as JSON.
+Metadata contains key-value pairs to be included in the report. For example, HTML report will display it as key-value pairs, and JSON report will include metadata serialized as json.
**Usage**
@@ -349,7 +389,7 @@ Metadata that will be put directly to the test report serialized as JSON.
import { defineConfig } from '@playwright/test';
export default defineConfig({
- metadata: 'acceptance tests',
+ metadata: { title: 'acceptance tests' },
});
```
@@ -528,7 +568,7 @@ export default defineConfig({
The maximum number of slow test files to report. Defaults to `5`.
- `threshold` [number]
- Test duration in milliseconds that is considered slow. Defaults to 15 seconds.
+ Test file duration in milliseconds that is considered slow. Defaults to 5 minutes.
**Details**
@@ -936,7 +976,7 @@ import { defineConfig } from '@playwright/test';
export default defineConfig({
webServer: {
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
},
@@ -965,19 +1005,19 @@ export default defineConfig({
webServer: [
{
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
},
{
command: 'npm run backend',
- url: 'http://127.0.0.1:3333',
+ url: 'http://localhost:3333',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
}
],
use: {
- baseURL: 'http://127.0.0.1:3000',
+ baseURL: 'http://localhost:3000',
},
});
```
@@ -1158,6 +1198,7 @@ This path will serve as the base directory for each test file snapshot directory
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testerror.mdx b/nodejs/versioned_docs/version-stable/api/class-testerror.mdx
index d83d27c2f32..cf73cf29366 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testerror.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testerror.mdx
@@ -175,6 +175,7 @@ testError.value
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testinfo.mdx b/nodejs/versioned_docs/version-stable/api/class-testinfo.mdx
index d5e46eb068c..f8e567bd10b 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testinfo.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testinfo.mdx
@@ -898,6 +898,7 @@ testInfo.workerIndex
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testinfoerror.mdx b/nodejs/versioned_docs/version-stable/api/class-testinfoerror.mdx
index a527e93d45f..ea196dca906 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testinfoerror.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testinfoerror.mdx
@@ -141,6 +141,7 @@ testInfoError.value
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testoptions.mdx b/nodejs/versioned_docs/version-stable/api/class-testoptions.mdx
index b365207bbc7..346865064cd 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testoptions.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testoptions.mdx
@@ -871,9 +871,9 @@ export default defineConfig({
- `value` [string]
-
- localStorage to set for context
-
+ localStorage to set for context
+
+
**Details**
When storage state is set up in the config, it is possible to reset storage state for a file:
@@ -1140,6 +1140,7 @@ export default defineConfig({
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testproject.mdx b/nodejs/versioned_docs/version-stable/api/class-testproject.mdx
index 566602efddb..009b1e59069 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testproject.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testproject.mdx
@@ -291,6 +291,11 @@ testProject.metadata
Project name is visible in the report and during test execution.
+:::warning
+
+Playwright executes the configuration file multiple times. Do not dynamically produce non-stable values in your configuration.
+:::
+
**Usage**
```js
@@ -783,6 +788,7 @@ testProject.use
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-testresult.mdx b/nodejs/versioned_docs/version-stable/api/class-testresult.mdx
index c124c9959d5..3f416fa340a 100644
--- a/nodejs/versioned_docs/version-stable/api/class-testresult.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-testresult.mdx
@@ -293,6 +293,7 @@ testResult.workerIndex
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-teststep.mdx b/nodejs/versioned_docs/version-stable/api/class-teststep.mdx
index 55d5e30b099..d20c9431b70 100644
--- a/nodejs/versioned_docs/version-stable/api/class-teststep.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-teststep.mdx
@@ -33,6 +33,29 @@ testStep.titlePath();
## Properties
+### annotations {#test-step-annotations}
+
+Added in: v1.51 testStep.annotations
+
+The list of annotations applicable to the current test step.
+
+**Usage**
+
+```js
+testStep.annotations
+```
+
+**Type**
+- [Array]<[Object]>
+ - `type` [string]
+
+ Annotation type, for example `'skip'`.
+ - `description` [string] *(optional)*
+
+ Optional description.
+
+---
+
### attachments {#test-step-attachments}
Added in: v1.50 testStep.attachments
@@ -261,6 +284,7 @@ testStep.title
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-teststepinfo.mdx b/nodejs/versioned_docs/version-stable/api/class-teststepinfo.mdx
new file mode 100644
index 00000000000..6ead8014fa0
--- /dev/null
+++ b/nodejs/versioned_docs/version-stable/api/class-teststepinfo.mdx
@@ -0,0 +1,248 @@
+---
+id: class-teststepinfo
+title: "TestStepInfo"
+---
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+import HTMLCard from '@site/src/components/HTMLCard';
+
+
+`TestStepInfo` contains information about currently running test step. It is passed as an argument to the step function. `TestStepInfo` provides utilities to control test step execution.
+
+```js
+import { test, expect } from '@playwright/test';
+
+test('basic test', async ({ page, browserName }) => {
+ await test.step('check some behavior', async step => {
+ step.skip(browserName === 'webkit', 'The feature is not available in WebKit');
+ // ... rest of the step code
+ });
+});
+```
+
+
+---
+
+## Methods
+
+### attach {#test-step-info-attach}
+
+Added in: v1.51 testStepInfo.attach
+
+Attach a value or a file from disk to the current test step. Some reporters show test step attachments. Either [path](/api/class-teststepinfo.mdx#test-step-info-attach-option-path) or [body](/api/class-teststepinfo.mdx#test-step-info-attach-option-body) must be specified, but not both. Calling this method will attribute the attachment to the step, as opposed to [testInfo.attach()](/api/class-testinfo.mdx#test-info-attach) which stores all attachments at the test level.
+
+For example, you can attach a screenshot to the test step:
+
+```js
+import { test, expect } from '@playwright/test';
+
+test('basic test', async ({ page }) => {
+ await page.goto('https://playwright.dev');
+ await test.step('check page rendering', async step => {
+ const screenshot = await page.screenshot();
+ await step.attach('screenshot', { body: screenshot, contentType: 'image/png' });
+ });
+});
+```
+
+Or you can attach files returned by your APIs:
+
+```js
+import { test, expect } from '@playwright/test';
+import { download } from './my-custom-helpers';
+
+test('basic test', async ({}) => {
+ await test.step('check download behavior', async step => {
+ const tmpPath = await download('a');
+ await step.attach('downloaded', { path: tmpPath });
+ });
+});
+```
+
+:::note
+[testStepInfo.attach()](/api/class-teststepinfo.mdx#test-step-info-attach) automatically takes care of copying attached files to a location that is accessible to reporters. You can safely remove the attachment after awaiting the attach call.
+:::
+
+**Usage**
+
+```js
+await testStepInfo.attach(name);
+await testStepInfo.attach(name, options);
+```
+
+**Arguments**
+- `name` [string]#
+
+ Attachment name. The name will also be sanitized and used as the prefix of file name when saving to disk.
+- `options` [Object] *(optional)*
+ - `body` [string] | [Buffer] *(optional)*#
+
+ Attachment body. Mutually exclusive with [path](/api/class-teststepinfo.mdx#test-step-info-attach-option-path).
+ - `contentType` [string] *(optional)*#
+
+ Content type of this attachment to properly present in the report, for example `'application/json'` or `'image/png'`. If omitted, content type is inferred based on the [path](/api/class-teststepinfo.mdx#test-step-info-attach-option-path), or defaults to `text/plain` for [string] attachments and `application/octet-stream` for [Buffer] attachments.
+ - `path` [string] *(optional)*#
+
+ Path on the filesystem to the attached file. Mutually exclusive with [body](/api/class-teststepinfo.mdx#test-step-info-attach-option-body).
+
+**Returns**
+- [Promise]<[void]>#
+
+---
+
+### skip() {#test-step-info-skip-1}
+
+Added in: v1.51 testStepInfo.skip()
+
+Abort the currently running step and mark it as skipped. Useful for steps that are currently failing and planned for a near-term fix.
+
+**Usage**
+
+```js
+import { test, expect } from '@playwright/test';
+
+test('my test', async ({ page }) => {
+ await test.step('check expectations', async step => {
+ step.skip();
+ // step body below will not run
+ // ...
+ });
+});
+```
+
+---
+
+### skip(condition) {#test-step-info-skip-2}
+
+Added in: v1.51 testStepInfo.skip(condition)
+
+Conditionally abort the currently running step and mark it as skipped with an optional description. Useful for steps that should not be executed in some cases.
+
+**Usage**
+
+```js
+import { test, expect } from '@playwright/test';
+
+test('my test', async ({ page, isMobile }) => {
+ await test.step('check desktop expectations', async step => {
+ step.skip(isMobile, 'not present in the mobile layout');
+ // step body below will not run
+ // ...
+ });
+});
+```
+
+**Arguments**
+- `condition` [boolean]#
+
+ A skip condition. Test step is skipped when the condition is `true`.
+- `description` [string] *(optional)*#
+
+ Optional description that will be reflected in a test report.
+
+
+[Accessibility]: /api/class-accessibility.mdx "Accessibility"
+[Android]: /api/class-android.mdx "Android"
+[AndroidDevice]: /api/class-androiddevice.mdx "AndroidDevice"
+[AndroidInput]: /api/class-androidinput.mdx "AndroidInput"
+[AndroidSocket]: /api/class-androidsocket.mdx "AndroidSocket"
+[AndroidWebView]: /api/class-androidwebview.mdx "AndroidWebView"
+[APIRequest]: /api/class-apirequest.mdx "APIRequest"
+[APIRequestContext]: /api/class-apirequestcontext.mdx "APIRequestContext"
+[APIResponse]: /api/class-apiresponse.mdx "APIResponse"
+[APIResponseAssertions]: /api/class-apiresponseassertions.mdx "APIResponseAssertions"
+[Browser]: /api/class-browser.mdx "Browser"
+[BrowserContext]: /api/class-browsercontext.mdx "BrowserContext"
+[BrowserServer]: /api/class-browserserver.mdx "BrowserServer"
+[BrowserType]: /api/class-browsertype.mdx "BrowserType"
+[CDPSession]: /api/class-cdpsession.mdx "CDPSession"
+[Clock]: /api/class-clock.mdx "Clock"
+[ConsoleMessage]: /api/class-consolemessage.mdx "ConsoleMessage"
+[Coverage]: /api/class-coverage.mdx "Coverage"
+[Dialog]: /api/class-dialog.mdx "Dialog"
+[Download]: /api/class-download.mdx "Download"
+[Electron]: /api/class-electron.mdx "Electron"
+[ElectronApplication]: /api/class-electronapplication.mdx "ElectronApplication"
+[ElementHandle]: /api/class-elementhandle.mdx "ElementHandle"
+[FileChooser]: /api/class-filechooser.mdx "FileChooser"
+[Frame]: /api/class-frame.mdx "Frame"
+[FrameLocator]: /api/class-framelocator.mdx "FrameLocator"
+[GenericAssertions]: /api/class-genericassertions.mdx "GenericAssertions"
+[JSHandle]: /api/class-jshandle.mdx "JSHandle"
+[Keyboard]: /api/class-keyboard.mdx "Keyboard"
+[Locator]: /api/class-locator.mdx "Locator"
+[LocatorAssertions]: /api/class-locatorassertions.mdx "LocatorAssertions"
+[Logger]: /api/class-logger.mdx "Logger"
+[Mouse]: /api/class-mouse.mdx "Mouse"
+[Page]: /api/class-page.mdx "Page"
+[PageAssertions]: /api/class-pageassertions.mdx "PageAssertions"
+[Playwright]: /api/class-playwright.mdx "Playwright"
+[PlaywrightAssertions]: /api/class-playwrightassertions.mdx "PlaywrightAssertions"
+[Request]: /api/class-request.mdx "Request"
+[Response]: /api/class-response.mdx "Response"
+[Route]: /api/class-route.mdx "Route"
+[Selectors]: /api/class-selectors.mdx "Selectors"
+[SnapshotAssertions]: /api/class-snapshotassertions.mdx "SnapshotAssertions"
+[TimeoutError]: /api/class-timeouterror.mdx "TimeoutError"
+[Touchscreen]: /api/class-touchscreen.mdx "Touchscreen"
+[Tracing]: /api/class-tracing.mdx "Tracing"
+[Video]: /api/class-video.mdx "Video"
+[WebError]: /api/class-weberror.mdx "WebError"
+[WebSocket]: /api/class-websocket.mdx "WebSocket"
+[WebSocketRoute]: /api/class-websocketroute.mdx "WebSocketRoute"
+[Worker]: /api/class-worker.mdx "Worker"
+[Fixtures]: /api/class-fixtures.mdx "Fixtures"
+[FullConfig]: /api/class-fullconfig.mdx "FullConfig"
+[FullProject]: /api/class-fullproject.mdx "FullProject"
+[Location]: /api/class-location.mdx "Location"
+[Test]: /api/class-test.mdx "Test"
+[TestConfig]: /api/class-testconfig.mdx "TestConfig"
+[TestInfo]: /api/class-testinfo.mdx "TestInfo"
+[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
+[TestOptions]: /api/class-testoptions.mdx "TestOptions"
+[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
+[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
+[Reporter]: /api/class-reporter.mdx "Reporter"
+[Suite]: /api/class-suite.mdx "Suite"
+[TestCase]: /api/class-testcase.mdx "TestCase"
+[TestError]: /api/class-testerror.mdx "TestError"
+[TestResult]: /api/class-testresult.mdx "TestResult"
+[TestStep]: /api/class-teststep.mdx "TestStep"
+[Element]: https://developer.mozilla.org/en-US/docs/Web/API/element "Element"
+[EvaluationArgument]: /evaluating.mdx#evaluation-argument "EvaluationArgument"
+[Promise]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise "Promise"
+[iterator]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols "Iterator"
+[origin]: https://developer.mozilla.org/en-US/docs/Glossary/Origin "Origin"
+[selector]: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors "selector"
+[Serializable]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify#Description "Serializable"
+[UIEvent.detail]: https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail "UIEvent.detail"
+[UnixTime]: https://en.wikipedia.org/wiki/Unix_time "Unix Time"
+[xpath]: https://developer.mozilla.org/en-US/docs/Web/XPath "xpath"
+
+[Array]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array "Array"
+[boolean]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Boolean_type "Boolean"
+[Buffer]: https://nodejs.org/api/buffer.html#buffer_class_buffer "Buffer"
+[ChildProcess]: https://nodejs.org/api/child_process.html "ChildProcess"
+[Date]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date "Date"
+[Error]: https://nodejs.org/api/errors.html#errors_class_error "Error"
+[EventEmitter]: https://nodejs.org/api/events.html#events_class_eventemitter "EventEmitter"
+[function]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function "Function"
+[FormData]: https://developer.mozilla.org/en-US/docs/Web/API/FormData "FormData"
+[Map]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map "Map"
+[Metadata]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object<string, any>"
+[null]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "null"
+[number]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type "Number"
+[Object]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object"
+[Promise]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise "Promise"
+[Readable]: https://nodejs.org/api/stream.html#stream_class_stream_readable "Readable"
+[ReadStream]: https://nodejs.org/api/fs.html#class-fsreadstream "ReadStream"
+[RegExp]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "RegExp"
+[string]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type "string"
+[void]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined "void"
+[URL]: https://nodejs.org/api/url.html "URL"
+[URLSearchParams]: https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams "URLSearchParams"
+
+[all available image tags]: https://mcr.microsoft.com/en-us/product/playwright/about "all available image tags"
+[Microsoft Artifact Registry]: https://mcr.microsoft.com/en-us/product/playwright/about "Microsoft Artifact Registry"
+[Dockerfile.noble]: https://github.com/microsoft/playwright/blob/main/utils/docker/Dockerfile.noble "Dockerfile.noble"
diff --git a/nodejs/versioned_docs/version-stable/api/class-timeouterror.mdx b/nodejs/versioned_docs/version-stable/api/class-timeouterror.mdx
index fb8a7b51e09..04896071a00 100644
--- a/nodejs/versioned_docs/version-stable/api/class-timeouterror.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-timeouterror.mdx
@@ -91,6 +91,7 @@ const playwright = require('playwright');
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-touchscreen.mdx b/nodejs/versioned_docs/version-stable/api/class-touchscreen.mdx
index 71c6f097078..8edddf5a38b 100644
--- a/nodejs/versioned_docs/version-stable/api/class-touchscreen.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-touchscreen.mdx
@@ -9,6 +9,8 @@ import HTMLCard from '@site/src/components/HTMLCard';
The Touchscreen class operates in main-frame CSS pixels relative to the top-left corner of the viewport. Methods on the touchscreen can only be used in browser contexts that have been initialized with `hasTouch` set to true.
+This class is limited to emulating tap gestures. For examples of other gestures simulated by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
+
---
@@ -103,6 +105,7 @@ await touchscreen.tap(x, y);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-tracing.mdx b/nodejs/versioned_docs/version-stable/api/class-tracing.mdx
index 3666aa6c2b8..1e86a6162a0 100644
--- a/nodejs/versioned_docs/version-stable/api/class-tracing.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-tracing.mdx
@@ -269,6 +269,7 @@ await tracing.stopChunk(options);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-video.mdx b/nodejs/versioned_docs/version-stable/api/class-video.mdx
index 863d69e92fa..ca8cfcd9a02 100644
--- a/nodejs/versioned_docs/version-stable/api/class-video.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-video.mdx
@@ -133,6 +133,7 @@ await video.saveAs(path);
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-weberror.mdx b/nodejs/versioned_docs/version-stable/api/class-weberror.mdx
index fb7d7a587bc..36ac8ab3872 100644
--- a/nodejs/versioned_docs/version-stable/api/class-weberror.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-weberror.mdx
@@ -117,6 +117,7 @@ webError.page();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-websocket.mdx b/nodejs/versioned_docs/version-stable/api/class-websocket.mdx
index ef3d114e887..a5d457bbdee 100644
--- a/nodejs/versioned_docs/version-stable/api/class-websocket.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-websocket.mdx
@@ -7,7 +7,9 @@ import TabItem from '@theme/TabItem';
import HTMLCard from '@site/src/components/HTMLCard';
-The [WebSocket] class represents websocket connections in the page.
+The [WebSocket] class represents WebSocket connections within a page. It provides the ability to inspect and manipulate the data being transmitted and received.
+
+If you want to intercept or modify WebSocket frames, consider using [WebSocketRoute].
---
@@ -219,6 +221,7 @@ webSocket.on('socketerror', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-websocketroute.mdx b/nodejs/versioned_docs/version-stable/api/class-websocketroute.mdx
index dde5a28b023..af58b09340d 100644
--- a/nodejs/versioned_docs/version-stable/api/class-websocketroute.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-websocketroute.mdx
@@ -272,6 +272,7 @@ webSocketRoute.url();
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-worker.mdx b/nodejs/versioned_docs/version-stable/api/class-worker.mdx
index 03175f82681..d540273eec9 100644
--- a/nodejs/versioned_docs/version-stable/api/class-worker.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-worker.mdx
@@ -178,6 +178,7 @@ worker.on('close', data => {});
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/api/class-workerinfo.mdx b/nodejs/versioned_docs/version-stable/api/class-workerinfo.mdx
index b947266cbb7..c462f54b206 100644
--- a/nodejs/versioned_docs/version-stable/api/class-workerinfo.mdx
+++ b/nodejs/versioned_docs/version-stable/api/class-workerinfo.mdx
@@ -145,6 +145,7 @@ workerInfo.workerIndex
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/aria-snapshots.mdx b/nodejs/versioned_docs/version-stable/aria-snapshots.mdx
index 78abbbc7083..8cfb3caf08b 100644
--- a/nodejs/versioned_docs/version-stable/aria-snapshots.mdx
+++ b/nodejs/versioned_docs/version-stable/aria-snapshots.mdx
@@ -10,7 +10,7 @@ import LiteYouTube from '@site/src/components/LiteYouTube';
## Overview
-With the Playwright Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
+With Playwright's Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
```js
await page.goto('https://playwright.dev/');
@@ -31,11 +31,11 @@ Snapshot testing and assertion testing serve different purposes in test automati
### Assertion testing
-Assertion testing is a targeted approach where you assert specific values or conditions about elements or components. For instance, with Playwright, [expect(locator).toHaveText()](/api/class-locatorassertions.mdx#locator-assertions-to-have-text) verifies that an element contains the expected text, and [expect(locator).toHaveValue()](/api/class-locatorassertions.mdx#locator-assertions-to-have-value) confirms that an input field has the expected value. Assertion tests are specific and generally check the current state of an element or property against an expected, predefined state. They work well for predictable, single-value checks but are limited in scope when testing the broader structure or variations.
+Assertion testing is a targeted approach where you assert specific values or conditions about elements or components. For instance, with Playwright, [expect(locator).toHaveText()](/api/class-locatorassertions.mdx#locator-assertions-to-have-text) verifies that an element contains the expected text, and [expect(locator).toHaveValue()](/api/class-locatorassertions.mdx#locator-assertions-to-have-value) confirms that an input field has the expected value. Assertion tests are specific and generally check the current state of an element or property against an expected, predefined state. They work well for predictable, single-value checks but are limited in scope when testing the broader structure or variations.
**Advantages**
- **Clarity**: The intent of the test is explicit and easy to understand.
-- **Specificity**: Tests focus on particular aspects of functionality, making them more robust against unrelated changes.
+- **Specificity**: Tests focus on particular aspects of functionality, making them more robust against unrelated changes.
- **Debugging**: Failures provide targeted feedback, pointing directly to the problematic aspect.
**Disadvantages**
@@ -123,7 +123,7 @@ You can perform partial matches on nodes by omitting attributes or accessible na
- button
```
-In this example, the button role is matched, but the accessible name ("Submit") is not specified, allowing the test to pass regardless of the button’s label.
+In this example, the button role is matched, but the accessible name ("Submit") is not specified, allowing the test to pass regardless of the button's label.
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
@@ -2840,6 +2928,7 @@ This version of Playwright was also tested against the following stable channels
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/running-tests.mdx b/nodejs/versioned_docs/version-stable/running-tests.mdx
index 95cc2147fc1..36c0f2cb417 100644
--- a/nodejs/versioned_docs/version-stable/running-tests.mdx
+++ b/nodejs/versioned_docs/version-stable/running-tests.mdx
@@ -232,6 +232,7 @@ You can filter and search for tests as well as click on each test to see the tes
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/screenshots.mdx b/nodejs/versioned_docs/version-stable/screenshots.mdx
index 384ce05d8f8..716cadefb18 100644
--- a/nodejs/versioned_docs/version-stable/screenshots.mdx
+++ b/nodejs/versioned_docs/version-stable/screenshots.mdx
@@ -102,6 +102,7 @@ await page.locator('.header').screenshot({ path: 'screenshot.png' });
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/selenium-grid.mdx b/nodejs/versioned_docs/version-stable/selenium-grid.mdx
index 594343771be..4ad15f94a80 100644
--- a/nodejs/versioned_docs/version-stable/selenium-grid.mdx
+++ b/nodejs/versioned_docs/version-stable/selenium-grid.mdx
@@ -184,6 +184,7 @@ This means that Selenium 3 is supported in a best-effort manner, where Playwrigh
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/service-workers-experimental-network-events.mdx b/nodejs/versioned_docs/version-stable/service-workers-experimental-network-events.mdx
index c24923c3c9b..ab540ed68a3 100644
--- a/nodejs/versioned_docs/version-stable/service-workers-experimental-network-events.mdx
+++ b/nodejs/versioned_docs/version-stable/service-workers-experimental-network-events.mdx
@@ -291,6 +291,7 @@ Requests for updated Service Worker main script code currently cannot be routed
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-annotations.mdx b/nodejs/versioned_docs/version-stable/test-annotations.mdx
index 557e5d06278..cc27c8b2d77 100644
--- a/nodejs/versioned_docs/version-stable/test-annotations.mdx
+++ b/nodejs/versioned_docs/version-stable/test-annotations.mdx
@@ -378,6 +378,7 @@ test('example test', async ({ page, browser }) => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-assertions.mdx b/nodejs/versioned_docs/version-stable/test-assertions.mdx
index 036951921e6..4c48b698c89 100644
--- a/nodejs/versioned_docs/version-stable/test-assertions.mdx
+++ b/nodejs/versioned_docs/version-stable/test-assertions.mdx
@@ -393,6 +393,7 @@ test('passes', async ({ database }) => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-cli.mdx b/nodejs/versioned_docs/version-stable/test-cli.mdx
index 754ea34fce2..5e490df3ffc 100644
--- a/nodejs/versioned_docs/version-stable/test-cli.mdx
+++ b/nodejs/versioned_docs/version-stable/test-cli.mdx
@@ -125,7 +125,8 @@ Complete set of Playwright Test options is available in the [configuration file]
| `--ui` | Run tests in interactive UI mode. |
| `--ui-host ` | Host to serve UI on; specifying this option opens UI in a browser tab. |
| `--ui-port ` | Port to serve UI on, 0 for any free port; specifying this option opens UI in a browser tab. |
-| `-u` or `--update-snapshots [mode]` | Update snapshots with actual results. Possible values are "all", "changed", "missing", and "none". Not passing defaults to "missing"; passing without a value defaults to "changed". |
+| `-u` or `--update-snapshots [mode]` | Update snapshots with actual results. Possible values are "all", "changed", "missing", and "none". Running tests without the flag defaults to "missing"; running tests with the flag but without a value defaults to "changed". |
+| `--update-source-method [mode]` | Update snapshots with actual results. Possible values are "patch" (default), "3way" and "overwrite". "Patch" creates a unified diff file that can be used to update the source code later. "3way" generates merge conflict markers in source code. "Overwrite" overwrites the source code with the new snapshot values.|
| `-j ` or `--workers ` | Number of concurrent workers or percentage of logical CPU cores, use 1 to run in a single worker (default: 50%). |
| `-x` | Stop after the first failure. |
@@ -190,6 +191,7 @@ Complete set of Playwright Test options is available in the [configuration file]
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-components.mdx b/nodejs/versioned_docs/version-stable/test-components.mdx
index 06ea3c90c67..7e5823d177f 100644
--- a/nodejs/versioned_docs/version-stable/test-components.mdx
+++ b/nodejs/versioned_docs/version-stable/test-components.mdx
@@ -800,6 +800,14 @@ export default defineConfig({
});
```
+### How do I use CSS imports?
+
+If you have a component that imports CSS, Vite will handle it automatically. You can also use CSS pre-processors such as Sass, Less, or Stylus, and Vite will handle them as well without any additional configuration. However, corresponding CSS pre-processor needs to be installed.
+
+Vite has a hard requirement that all CSS Modules are named `*.module.[css extension]`. If you have a custom build config for your project normally and have imports of the form `import styles from 'styles.css'` you must rename your files to properly indicate they are to be treated as modules. You could also write a Vite plugin to handle this for you.
+
+Check [Vite documentation](https://vite.dev/guide/features#css) for more details.
+
### How can I test components that uses Pinia?
Pinia needs to be initialized in `playwright/index.{js,ts,jsx,tsx}`. If you do this inside a `beforeMount` hook, the `initialState` can be overwritten on a per-test basis:
@@ -910,6 +918,7 @@ Accessing a component's internal methods or its instance within test code is nei
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-configuration.mdx b/nodejs/versioned_docs/version-stable/test-configuration.mdx
index 34d67b2be66..007e50a3346 100644
--- a/nodejs/versioned_docs/version-stable/test-configuration.mdx
+++ b/nodejs/versioned_docs/version-stable/test-configuration.mdx
@@ -38,7 +38,7 @@ export default defineConfig({
use: {
// Base URL to use in actions like `await page.goto('/')`.
- baseURL: 'http://127.0.0.1:3000',
+ baseURL: 'http://localhost:3000',
// Collect trace when retrying the failed test.
trace: 'on-first-retry',
@@ -53,7 +53,7 @@ export default defineConfig({
// Run your local dev server before starting the tests.
webServer: {
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
},
});
@@ -214,6 +214,7 @@ export default defineConfig({
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-fixtures.mdx b/nodejs/versioned_docs/version-stable/test-fixtures.mdx
index 0c5048b41a1..459ecf66080 100644
--- a/nodejs/versioned_docs/version-stable/test-fixtures.mdx
+++ b/nodejs/versioned_docs/version-stable/test-fixtures.mdx
@@ -420,8 +420,8 @@ Automatic fixtures are set up for each test/worker, even when the test does not
Here is an example fixture that automatically attaches debug logs when the test fails, so we can later review the logs in the reporter. Note how it uses [TestInfo] object that is available in each test/fixture to retrieve metadata about the test being run.
```js title="my-test.ts"
-import * as debug from 'debug';
-import * as fs from 'fs';
+import debug from 'debug';
+import fs from 'fs';
import { test as base } from '@playwright/test';
export const test = base.extend<{ saveLogs: void }>({
@@ -860,6 +860,7 @@ Note that the fixtures will still run once per [worker process](./test-parallel.
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-global-setup-teardown.mdx b/nodejs/versioned_docs/version-stable/test-global-setup-teardown.mdx
index a032b867c51..adfc75089ea 100644
--- a/nodejs/versioned_docs/version-stable/test-global-setup-teardown.mdx
+++ b/nodejs/versioned_docs/version-stable/test-global-setup-teardown.mdx
@@ -324,6 +324,7 @@ export default globalSetup;
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-parallel.mdx b/nodejs/versioned_docs/version-stable/test-parallel.mdx
index 8f3d1fee772..b18f14f790f 100644
--- a/nodejs/versioned_docs/version-stable/test-parallel.mdx
+++ b/nodejs/versioned_docs/version-stable/test-parallel.mdx
@@ -331,6 +331,7 @@ Do not define your tests directly in a helper file. This could lead to unexpecte
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-parameterize.mdx b/nodejs/versioned_docs/version-stable/test-parameterize.mdx
index 201e78b672f..69eca6dcb0e 100644
--- a/nodejs/versioned_docs/version-stable/test-parameterize.mdx
+++ b/nodejs/versioned_docs/version-stable/test-parameterize.mdx
@@ -480,6 +480,7 @@ for (const record of records) {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-projects.mdx b/nodejs/versioned_docs/version-stable/test-projects.mdx
index 5a1a6e8f134..493e3254f67 100644
--- a/nodejs/versioned_docs/version-stable/test-projects.mdx
+++ b/nodejs/versioned_docs/version-stable/test-projects.mdx
@@ -285,6 +285,7 @@ Projects can be also used to parametrize tests with your custom configuration -
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-reporters.mdx b/nodejs/versioned_docs/version-stable/test-reporters.mdx
index bab597695c9..f563da2428a 100644
--- a/nodejs/versioned_docs/version-stable/test-reporters.mdx
+++ b/nodejs/versioned_docs/version-stable/test-reporters.mdx
@@ -528,6 +528,7 @@ Here's a short list of open source reporter implementations that you can take a
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-retries.mdx b/nodejs/versioned_docs/version-stable/test-retries.mdx
index 801192e1d0a..72f33d8b90a 100644
--- a/nodejs/versioned_docs/version-stable/test-retries.mdx
+++ b/nodejs/versioned_docs/version-stable/test-retries.mdx
@@ -303,6 +303,7 @@ test('runs second', async () => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-sharding.mdx b/nodejs/versioned_docs/version-stable/test-sharding.mdx
index 089926d3ccf..2b833f39490 100644
--- a/nodejs/versioned_docs/version-stable/test-sharding.mdx
+++ b/nodejs/versioned_docs/version-stable/test-sharding.mdx
@@ -255,6 +255,7 @@ Supported options:
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-snapshots.mdx b/nodejs/versioned_docs/version-stable/test-snapshots.mdx
index 6a759de3f6d..8ae67f7bd44 100644
--- a/nodejs/versioned_docs/version-stable/test-snapshots.mdx
+++ b/nodejs/versioned_docs/version-stable/test-snapshots.mdx
@@ -200,6 +200,7 @@ Snapshots are stored next to the test file, in a separate directory. For example
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-timeouts.mdx b/nodejs/versioned_docs/version-stable/test-timeouts.mdx
index 0e6d6e290e0..8489d564ed3 100644
--- a/nodejs/versioned_docs/version-stable/test-timeouts.mdx
+++ b/nodejs/versioned_docs/version-stable/test-timeouts.mdx
@@ -271,6 +271,7 @@ API reference: [test.extend()](/api/class-test.mdx#test-extend).
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-typescript.mdx b/nodejs/versioned_docs/version-stable/test-typescript.mdx
index 73f6d202d4a..16aa54788e9 100644
--- a/nodejs/versioned_docs/version-stable/test-typescript.mdx
+++ b/nodejs/versioned_docs/version-stable/test-typescript.mdx
@@ -200,6 +200,7 @@ Then `npm run test` will build the tests and run them.
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-ui-mode.mdx b/nodejs/versioned_docs/version-stable/test-ui-mode.mdx
index b9de63575e9..1f08808162a 100644
--- a/nodejs/versioned_docs/version-stable/test-ui-mode.mdx
+++ b/nodejs/versioned_docs/version-stable/test-ui-mode.mdx
@@ -24,7 +24,7 @@ npx playwright test --ui
## Running your tests
-Once you launch UI Mode you will see a list of all your test files. You can run all your tests by clicking the triangle icon in the sidebar. You can also run a single test file, a block of tests or a single test by hovering over the name and clicking on the triangle next to it.
+Once you launch UI Mode you will see a list of all your test files. You can run all your tests by clicking the triangle icon in the sidebar. You can also run a single test file, a block of tests or a single test by hovering over the name and clicking on the triangle next to it.
@@ -42,7 +42,7 @@ At the top of the trace you can see a timeline view of your test with different
## Actions
-In the Actions tab you can see what locator was used for every action and how long each one took to run. Hover over each action of your test and visually see the change in the DOM snapshot. Go back and forward in time and click an action to inspect and debug. Use the Before and After tabs to visually see what happened before and after the action. 
+In the Actions tab you can see what locator was used for every action and how long each one took to run. Hover over each action of your test and visually see the change in the DOM snapshot. Go back and forward in time and click an action to inspect and debug. Use the Before and After tabs to visually see what happened before and after the action. 
## Pop out and inspect the DOM
@@ -58,7 +58,7 @@ Click on the pick locator button and hover over the DOM snapshot to see the loca
## Source
-As you hover over each action of your test the line of code for that action is highlighted in the source panel.
+As you hover over each action of your test the line of code for that action is highlighted in the source panel. The button "Open in VSCode" is at the top-right of this section. Upon clicking the button, it will open your test in VS Code right at the line of code that you clicked on.
@@ -106,7 +106,7 @@ Next to the Actions tab you will find the Metadata tab which will show you more
## Watch mode
-Next to the name of each test in the sidebar you will find an eye icon. Clicking on the icon will activate watch mode which will re-run the test when you make changes to it. You can watch a number of tests at the same time be clicking the eye icon next to each one or all tests by clicking the eye icon at the top of the sidebar. If you are using VS Code then you can easily open your test by clicking on the file icon next to the eye icon. This will open your test in VS Code right at the line of code that you clicked on.
+Next to the name of each test in the sidebar you will find an eye icon. Clicking on the icon will activate watch mode which will re-run the test when you make changes to it. You can watch a number of tests at the same time be clicking the eye icon next to each one or all tests by clicking the eye icon at the top of the sidebar.
@@ -191,6 +191,7 @@ Be aware that when specifying the `--ui-host=0.0.0.0` flag, UI Mode with your tr
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-use-options.mdx b/nodejs/versioned_docs/version-stable/test-use-options.mdx
index 1bffeaca7a2..f0eb76db0ba 100644
--- a/nodejs/versioned_docs/version-stable/test-use-options.mdx
+++ b/nodejs/versioned_docs/version-stable/test-use-options.mdx
@@ -20,7 +20,7 @@ import { defineConfig } from '@playwright/test';
export default defineConfig({
use: {
// Base URL to use in actions like `await page.goto('/')`.
- baseURL: 'http://127.0.0.1:3000',
+ baseURL: 'http://localhost:3000',
// Populates context with given storage state.
storageState: 'state.json',
@@ -357,6 +357,7 @@ test.describe('french language block', () => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/test-webserver.mdx b/nodejs/versioned_docs/version-stable/test-webserver.mdx
index 50db2e78331..f369a134f13 100644
--- a/nodejs/versioned_docs/version-stable/test-webserver.mdx
+++ b/nodejs/versioned_docs/version-stable/test-webserver.mdx
@@ -21,7 +21,7 @@ export default defineConfig({
// Run your local dev server before starting the tests
webServer: {
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
stdout: 'ignore',
stderr: 'pipe',
@@ -55,7 +55,7 @@ export default defineConfig({
// Run your local dev server before starting the tests
webServer: {
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
timeout: 120 * 1000,
},
@@ -66,7 +66,7 @@ export default defineConfig({
It is also recommended to specify the `baseURL` in the `use: {}` section of your config, so that tests can use relative urls and you don't have to specify the full URL over and over again.
-When using [page.goto()](/api/class-page.mdx#page-goto), [page.route()](/api/class-page.mdx#page-route), [page.waitForURL()](/api/class-page.mdx#page-wait-for-url), [page.waitForRequest()](/api/class-page.mdx#page-wait-for-request), or [page.waitForResponse()](/api/class-page.mdx#page-wait-for-response) it takes the base URL in consideration by using the [`URL()`](https://developer.mozilla.org/en-US/docs/Web/API/URL/URL) constructor for building the corresponding URL. For Example, by setting the baseURL to `http://127.0.0.1:3000` and navigating to `/login` in your tests, Playwright will run the test using `http://127.0.0.1:3000/login`.
+When using [page.goto()](/api/class-page.mdx#page-goto), [page.route()](/api/class-page.mdx#page-route), [page.waitForURL()](/api/class-page.mdx#page-wait-for-url), [page.waitForRequest()](/api/class-page.mdx#page-wait-for-request), or [page.waitForResponse()](/api/class-page.mdx#page-wait-for-response) it takes the base URL in consideration by using the [`URL()`](https://developer.mozilla.org/en-US/docs/Web/API/URL/URL) constructor for building the corresponding URL. For Example, by setting the baseURL to `http://localhost:3000` and navigating to `/login` in your tests, Playwright will run the test using `http://localhost:3000/login`.
```js title="playwright.config.ts"
import { defineConfig } from '@playwright/test';
@@ -77,11 +77,11 @@ export default defineConfig({
// Run your local dev server before starting the tests
webServer: {
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
reuseExistingServer: !process.env.CI,
},
use: {
- baseURL: 'http://127.0.0.1:3000',
+ baseURL: 'http://localhost:3000',
},
});
```
@@ -92,7 +92,7 @@ Now you can use a relative path when navigating the page:
import { test } from '@playwright/test';
test('test', async ({ page }) => {
- // This will navigate to http://127.0.0.1:3000/login
+ // This will navigate to http://localhost:3000/login
await page.goto('./login');
});
```
@@ -108,19 +108,19 @@ export default defineConfig({
webServer: [
{
command: 'npm run start',
- url: 'http://127.0.0.1:3000',
+ url: 'http://localhost:3000',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
},
{
command: 'npm run backend',
- url: 'http://127.0.0.1:3333',
+ url: 'http://localhost:3333',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI,
}
],
use: {
- baseURL: 'http://127.0.0.1:3000',
+ baseURL: 'http://localhost:3000',
},
});
```
@@ -186,6 +186,7 @@ export default defineConfig({
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/testing-library.mdx b/nodejs/versioned_docs/version-stable/testing-library.mdx
index b6537d676ba..ce3104e4065 100644
--- a/nodejs/versioned_docs/version-stable/testing-library.mdx
+++ b/nodejs/versioned_docs/version-stable/testing-library.mdx
@@ -215,6 +215,7 @@ Learn more about Playwright Test runner:
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/touch-events.mdx b/nodejs/versioned_docs/version-stable/touch-events.mdx
index 31e020b5c43..c6ead764d4a 100644
--- a/nodejs/versioned_docs/version-stable/touch-events.mdx
+++ b/nodejs/versioned_docs/version-stable/touch-events.mdx
@@ -1,6 +1,6 @@
---
id: touch-events
-title: "Emulating touch events"
+title: "Touch events (legacy)"
---
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
@@ -8,15 +8,9 @@ import HTMLCard from '@site/src/components/HTMLCard';
## Introduction
-Mobile web sites may listen to [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) and react to user touch gestures such as swipe, pinch, tap etc. To test this functionality you can manually generate [TouchEvent]s in the page context using [locator.evaluate()](/api/class-locator.mdx#locator-evaluate).
+Web applications that handle legacy [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) to respond to gestures like swipe, pinch, and tap can be tested by manually dispatching [TouchEvent](https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/TouchEvent)s to the page. The examples below demonstrate how to use [locator.dispatchEvent()](/api/class-locator.mdx#locator-dispatch-event) and pass [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points as arguments.
-If your web application relies on [pointer events](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events) instead of touch events, you can use [locator.click()](/api/class-locator.mdx#locator-click) and raw [`Mouse`] events to simulate a single-finger touch, and this will trigger all the same pointer events.
-
-### Dispatching TouchEvent
-
-You can dispatch touch events to the page using [locator.dispatchEvent()](/api/class-locator.mdx#locator-dispatch-event). [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points can be passed as arguments, see examples below.
-
-#### Emulating pan gesture
+### Emulating pan gesture
In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
@@ -72,7 +66,7 @@ test(`pan gesture to move the map`, async ({ page }) => {
});
```
-#### Emulating pinch gesture
+### Emulating pinch gesture
In the example below, we emulate pinch gesture, i.e. two touch points moving closer to each other. It is expected to zoom out the map. The app under test only uses `clientX/clientY` coordinates of touch points, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
@@ -207,6 +201,7 @@ test(`pinch in gesture to zoom out the map`, async ({ page }) => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/trace-viewer-intro.mdx b/nodejs/versioned_docs/version-stable/trace-viewer-intro.mdx
index edf79056374..427b8d9f738 100644
--- a/nodejs/versioned_docs/version-stable/trace-viewer-intro.mdx
+++ b/nodejs/versioned_docs/version-stable/trace-viewer-intro.mdx
@@ -135,6 +135,7 @@ To learn more about traces check out our detailed guide on [Trace Viewer](/trace
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/trace-viewer.mdx b/nodejs/versioned_docs/version-stable/trace-viewer.mdx
index 650803a2fa7..0759567ce42 100644
--- a/nodejs/versioned_docs/version-stable/trace-viewer.mdx
+++ b/nodejs/versioned_docs/version-stable/trace-viewer.mdx
@@ -272,6 +272,7 @@ The "Attachments" tab allows you to explore attachments. If you're doing [visual
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/videos.mdx b/nodejs/versioned_docs/version-stable/videos.mdx
index 78a49f2ddbb..6c9aac0f9eb 100644
--- a/nodejs/versioned_docs/version-stable/videos.mdx
+++ b/nodejs/versioned_docs/version-stable/videos.mdx
@@ -163,6 +163,7 @@ Note that the video is only available after the page or browser context is close
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/webview2.mdx b/nodejs/versioned_docs/version-stable/webview2.mdx
index 45036f46d7f..88f8b4d7f47 100644
--- a/nodejs/versioned_docs/version-stable/webview2.mdx
+++ b/nodejs/versioned_docs/version-stable/webview2.mdx
@@ -178,6 +178,7 @@ For debugging tests, see the Playwright [Debugging guide](./debug).
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_docs/version-stable/writing-tests.mdx b/nodejs/versioned_docs/version-stable/writing-tests.mdx
index 7145b82d094..0fd26a9e68b 100644
--- a/nodejs/versioned_docs/version-stable/writing-tests.mdx
+++ b/nodejs/versioned_docs/version-stable/writing-tests.mdx
@@ -235,6 +235,7 @@ test.describe('navigation', () => {
[TestInfoError]: /api/class-testinfoerror.mdx "TestInfoError"
[TestOptions]: /api/class-testoptions.mdx "TestOptions"
[TestProject]: /api/class-testproject.mdx "TestProject"
+[TestStepInfo]: /api/class-teststepinfo.mdx "TestStepInfo"
[WorkerInfo]: /api/class-workerinfo.mdx "WorkerInfo"
[Reporter]: /api/class-reporter.mdx "Reporter"
[Suite]: /api/class-suite.mdx "Suite"
diff --git a/nodejs/versioned_sidebars/version-stable-sidebars.json b/nodejs/versioned_sidebars/version-stable-sidebars.json
index dffff19410a..89e5973dc61 100644
--- a/nodejs/versioned_sidebars/version-stable-sidebars.json
+++ b/nodejs/versioned_sidebars/version-stable-sidebars.json
@@ -248,11 +248,11 @@
},
{
"type": "doc",
- "id": "test-snapshots"
+ "id": "codegen"
},
{
"type": "doc",
- "id": "codegen"
+ "id": "touch-events"
},
{
"type": "doc",
@@ -262,6 +262,10 @@
"type": "doc",
"id": "videos"
},
+ {
+ "type": "doc",
+ "id": "test-snapshots"
+ },
{
"type": "doc",
"id": "webview2"
@@ -547,6 +551,10 @@
"type": "doc",
"id": "api/class-testproject"
},
+ {
+ "type": "doc",
+ "id": "api/class-teststepinfo"
+ },
{
"type": "doc",
"id": "api/class-workerinfo"
diff --git a/python/versioned_docs/version-stable/api/class-apirequest.mdx b/python/versioned_docs/version-stable/api/class-apirequest.mdx
index 7f1d8ecffd9..510f1c176b9 100644
--- a/python/versioned_docs/version-stable/api/class-apirequest.mdx
+++ b/python/versioned_docs/version-stable/api/class-apirequest.mdx
@@ -74,6 +74,9 @@ api_request.new_context(**kwargs)
- `extra_http_headers` [Dict]\[[str], [str]\] *(optional)*#
An object containing additional HTTP headers to be sent with every request. Defaults to none.
+- `fail_on_status_code` [bool] *(optional)* Added in: v1.51 #
+
+ Whether to throw on response codes other than 2xx and 3xx. By default response object is returned for all status codes.
- `http_credentials` [Dict] *(optional)*#
- `username` [str]
diff --git a/python/versioned_docs/version-stable/api/class-apirequestcontext.mdx b/python/versioned_docs/version-stable/api/class-apirequestcontext.mdx
index 6c594e81a0d..ae545e9920b 100644
--- a/python/versioned_docs/version-stable/api/class-apirequestcontext.mdx
+++ b/python/versioned_docs/version-stable/api/class-apirequestcontext.mdx
@@ -155,7 +155,7 @@ api_request_context.delete(url, **kwargs)
- `url` [str]#
Target URL.
-- `data` [str] | [bytes] | [Serializable] *(optional)* Added in: v1.17 #
+- `data` [str] | [bytes] | [Dict] *(optional)* Added in: v1.17 #
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -259,7 +259,7 @@ api_request_context.fetch(
- `url_or_request` [str] | [Request]#
Target URL or Request to get all parameters from.
-- `data` [str] | [bytes] | [Serializable] *(optional)*#
+- `data` [str] | [bytes] | [Dict] *(optional)*#
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -329,7 +329,7 @@ api_request_context.get("https://example.com/api/getText", params=query_params)
- `url` [str]#
Target URL.
-- `data` [str] | [bytes] | [Serializable] *(optional)* Added in: v1.26 #
+- `data` [str] | [bytes] | [Dict] *(optional)* Added in: v1.26 #
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -391,7 +391,7 @@ api_request_context.head(url, **kwargs)
- `url` [str]#
Target URL.
-- `data` [str] | [bytes] | [Serializable] *(optional)* Added in: v1.26 #
+- `data` [str] | [bytes] | [Dict] *(optional)* Added in: v1.26 #
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -453,7 +453,7 @@ api_request_context.patch(url, **kwargs)
- `url` [str]#
Target URL.
-- `data` [str] | [bytes] | [Serializable] *(optional)*#
+- `data` [str] | [bytes] | [Dict] *(optional)*#
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -544,7 +544,7 @@ api_request_context.post(
- `url` [str]#
Target URL.
-- `data` [str] | [bytes] | [Serializable] *(optional)*#
+- `data` [str] | [bytes] | [Dict] *(optional)*#
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -606,7 +606,7 @@ api_request_context.put(url, **kwargs)
- `url` [str]#
Target URL.
-- `data` [str] | [bytes] | [Serializable] *(optional)*#
+- `data` [str] | [bytes] | [Dict] *(optional)*#
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `fail_on_status_code` [bool] *(optional)*#
@@ -665,6 +665,9 @@ api_request_context.storage_state(**kwargs)
```
**Arguments**
+- `indexed_db` [bool] *(optional)* Added in: v1.51 #
+
+ Set to `true` to include IndexedDB in the storage state snapshot.
- `path` [Union]\[[str], [pathlib.Path]\] *(optional)*#
The file path to save the storage state to. If [path](/api/class-apirequestcontext.mdx#api-request-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
diff --git a/python/versioned_docs/version-stable/api/class-apiresponse.mdx b/python/versioned_docs/version-stable/api/class-apiresponse.mdx
index 1646890a88b..e49b1879266 100644
--- a/python/versioned_docs/version-stable/api/class-apiresponse.mdx
+++ b/python/versioned_docs/version-stable/api/class-apiresponse.mdx
@@ -113,7 +113,7 @@ api_response.json()
```
**Returns**
-- [Serializable]#
+- [Dict]#
---
diff --git a/python/versioned_docs/version-stable/api/class-browser.mdx b/python/versioned_docs/version-stable/api/class-browser.mdx
index a97f9ee7122..156b00c9de0 100644
--- a/python/versioned_docs/version-stable/api/class-browser.mdx
+++ b/python/versioned_docs/version-stable/api/class-browser.mdx
@@ -223,6 +223,9 @@ await browser.close()
- `color_scheme` "light" | "dark" | "no-preference" | "null" *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulate_media()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`.
+- `contrast` "no-preference" | "more" | "null" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulate_media()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'no-preference'`.
- `device_scale_factor` [float] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -377,9 +380,9 @@ await browser.close()
- `value` [str]
-
- localStorage to set for context
-
+ localStorage to set for context
+
+
Learn more about [storage state and auth](../auth.mdx).
Populates context with given storage state. This option can be used to initialize context with logged-in information obtained via [browser_context.storage_state()](/api/class-browsercontext.mdx#browser-context-storage-state).
@@ -475,6 +478,9 @@ browser.new_page(**kwargs)
- `color_scheme` "light" | "dark" | "no-preference" | "null" *(optional)*#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulate_media()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`.
+- `contrast` "no-preference" | "more" | "null" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulate_media()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'no-preference'`.
- `device_scale_factor` [float] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
@@ -629,9 +635,9 @@ browser.new_page(**kwargs)
- `value` [str]
-
- localStorage to set for context
-
+ localStorage to set for context
+
+
Learn more about [storage state and auth](../auth.mdx).
Populates context with given storage state. This option can be used to initialize context with logged-in information obtained via [browser_context.storage_state()](/api/class-browsercontext.mdx#browser-context-storage-state).
diff --git a/python/versioned_docs/version-stable/api/class-browsercontext.mdx b/python/versioned_docs/version-stable/api/class-browsercontext.mdx
index 3c14d2ca78d..f5436ae313c 100644
--- a/python/versioned_docs/version-stable/api/class-browsercontext.mdx
+++ b/python/versioned_docs/version-stable/api/class-browsercontext.mdx
@@ -1176,7 +1176,7 @@ browser_context.set_offline(offline)
Added before v1.9 browserContext.storage_state
-Returns storage state for this browser context, contains current cookies and local storage snapshot.
+Returns storage state for this browser context, contains current cookies, local storage snapshot and IndexedDB snapshot.
**Usage**
@@ -1186,6 +1186,15 @@ browser_context.storage_state(**kwargs)
```
**Arguments**
+- `indexed_db` [bool] *(optional)* Added in: v1.51 #
+
+ Set to `true` to include [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) in the storage state snapshot. If your application uses IndexedDB to store authentication tokens, like Firebase Authentication, enable this.
+
+ :::note
+
+ IndexedDBs with typed arrays are currently not supported.
+ :::
+
- `path` [Union]\[[str], [pathlib.Path]\] *(optional)*#
The file path to save the storage state to. If [path](/api/class-browsercontext.mdx#browser-context-storage-state-option-path) is a relative path, then it is resolved relative to current working directory. If no path is provided, storage state is still returned, but won't be saved to the disk.
diff --git a/python/versioned_docs/version-stable/api/class-browsertype.mdx b/python/versioned_docs/version-stable/api/class-browsertype.mdx
index 765bebf03be..c58687d0aa0 100644
--- a/python/versioned_docs/version-stable/api/class-browsertype.mdx
+++ b/python/versioned_docs/version-stable/api/class-browsertype.mdx
@@ -67,7 +67,12 @@ asyncio.run(main())
Added before v1.9 browserType.connect
-This method attaches Playwright to an existing browser instance. When connecting to another browser launched via `BrowserType.launchServer` in Node.js, the major and minor version needs to match the client version (1.2.3 → is compatible with 1.2.x).
+This method attaches Playwright to an existing browser instance created via `BrowserType.launchServer` in Node.js.
+
+:::note
+
+The major and minor version of the Playwright instance that connects needs to match the version of Playwright that launches the browser (1.2.3 → is compatible with 1.2.x).
+:::
**Usage**
@@ -79,7 +84,7 @@ browser_type.connect(ws_endpoint, **kwargs)
**Arguments**
- `ws_endpoint` [str] Added in: v1.10 #
- A browser websocket endpoint to connect to.
+ A Playwright browser websocket endpoint to connect to. You obtain this endpoint via `BrowserServer.wsEndpoint`.
- `expose_network` [str] *(optional)* Added in: v1.37 #
This option exposes network available on the connecting client to the browser being connected to. Consists of a list of rules separated by comma.
@@ -121,6 +126,10 @@ The default browser context is accessible via [browser.contexts](/api/class-brow
Connecting over the Chrome DevTools Protocol is only supported for Chromium-based browsers.
:::
+:::note
+This connection is significantly lower fidelity than the Playwright protocol connection via [browser_type.connect()](/api/class-browsertype.mdx#browser-type-connect). If you are experiencing issues or attempting to use advanced functionality, you probably want to use [browser_type.connect()](/api/class-browsertype.mdx#browser-type-connect).
+:::
+
**Usage**
#
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. See [page.emulate_media()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'light'`.
+- `contrast` "no-preference" | "more" | "null" *(optional)*#
+
+ Emulates `'prefers-contrast'` media feature, supported values are `'no-preference'`, `'more'`. See [page.emulate_media()](/api/class-page.mdx#page-emulate-media) for more details. Passing `'null'` resets emulation to system defaults. Defaults to `'no-preference'`.
- `device_scale_factor` [float] *(optional)*#
Specify device scale factor (can be thought of as dpr). Defaults to `1`. Learn more about [emulating devices with device scale factor](../emulation.mdx#devices).
diff --git a/python/versioned_docs/version-stable/api/class-elementhandle.mdx b/python/versioned_docs/version-stable/api/class-elementhandle.mdx
index 7448209d80f..140ffd377a2 100644
--- a/python/versioned_docs/version-stable/api/class-elementhandle.mdx
+++ b/python/versioned_docs/version-stable/api/class-elementhandle.mdx
@@ -602,7 +602,7 @@ assert await tweet_handle.eval_on_selector(".retweets", "node => node.innerText"
Optional argument to pass to [expression](/api/class-elementhandle.mdx#element-handle-eval-on-selector-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -670,7 +670,7 @@ assert await feed_handle.eval_on_selector_all(".tweet", "nodes => nodes.map(n =>
Optional argument to pass to [expression](/api/class-elementhandle.mdx#element-handle-eval-on-selector-all-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -1212,7 +1212,7 @@ element_handle.screenshot(**kwargs)
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `mask` [List]\[[Locator]\] *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [mask_color](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [mask_color](/api/class-elementhandle.mdx#element-handle-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `mask_color` [str] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
diff --git a/python/versioned_docs/version-stable/api/class-frame.mdx b/python/versioned_docs/version-stable/api/class-frame.mdx
index ab500b5a0b7..efffa94f093 100644
--- a/python/versioned_docs/version-stable/api/class-frame.mdx
+++ b/python/versioned_docs/version-stable/api/class-frame.mdx
@@ -329,7 +329,7 @@ await body_handle.dispose()
Optional argument to pass to [expression](/api/class-frame.mdx#frame-evaluate-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -1897,7 +1897,7 @@ html = await frame.eval_on_selector(".main-container", "(e, suffix) => e.outerHT
When true, the call requires selector to resolve to a single element. If given selector resolves to more than one element, the call throws an exception.
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -1956,7 +1956,7 @@ divs_counts = await frame.eval_on_selector_all("div", "(divs, min) => divs.lengt
Optional argument to pass to [expression](/api/class-frame.mdx#frame-eval-on-selector-all-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
diff --git a/python/versioned_docs/version-stable/api/class-jshandle.mdx b/python/versioned_docs/version-stable/api/class-jshandle.mdx
index dc16f89bc2c..fb7c05dd4b0 100644
--- a/python/versioned_docs/version-stable/api/class-jshandle.mdx
+++ b/python/versioned_docs/version-stable/api/class-jshandle.mdx
@@ -108,7 +108,7 @@ assert await tweet_handle.evaluate("node => node.innerText") == "10 retweets"
Optional argument to pass to [expression](/api/class-jshandle.mdx#js-handle-evaluate-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -231,7 +231,7 @@ js_handle.json_value()
```
**Returns**
-- [Serializable]#
+- [Dict]#
---
diff --git a/python/versioned_docs/version-stable/api/class-locator.mdx b/python/versioned_docs/version-stable/api/class-locator.mdx
index 0f6c7b169ca..65ceca096da 100644
--- a/python/versioned_docs/version-stable/api/class-locator.mdx
+++ b/python/versioned_docs/version-stable/api/class-locator.mdx
@@ -914,32 +914,6 @@ Execute JavaScript code in the page, taking the matching element as an argument.
**Usage**
-
-
-
-```py
-tweets = page.locator(".tweet .retweets")
-assert tweets.evaluate("node => node.innerText") == "10 retweets"
-```
-
-
-
-
-```py
-tweets = page.locator(".tweet .retweets")
-assert await tweets.evaluate("node => node.innerText") == "10 retweets"
-```
-
-
-
-
**Arguments**
- `expression` [str]#
@@ -952,7 +926,7 @@ assert await tweets.evaluate("node => node.innerText") == "10 retweets"
Maximum time in milliseconds. Defaults to `30000` (30 seconds). Pass `0` to disable timeout. The default value can be changed by using the [browser_context.set_default_timeout()](/api/class-browsercontext.mdx#browser-context-set-default-timeout) or [page.set_default_timeout()](/api/class-page.mdx#page-set-default-timeout) methods.
**Returns**
-- [Serializable]#
+- [Dict]#
**Details**
@@ -1007,7 +981,7 @@ more_than_ten = await locator.evaluate_all("(divs, min) => divs.length > min", 1
Optional argument to pass to [expression](/api/class-locator.mdx#locator-evaluate-all-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
**Details**
@@ -1184,6 +1158,9 @@ await row_locator.filter(has_text="text in column 1").filter(
- `has_text` [str] | [Pattern] *(optional)*#
Matches elements containing specified text somewhere inside, possibly in a child or a descendant element. When passed a [string], matching is case-insensitive and searches for a substring. For example, `"Playwright"` matches `Playwright
Added in: v1.51 #
+
+ Only matches visible or invisible elements.
**Returns**
- [Locator]#
@@ -2625,7 +2602,7 @@ await page.get_by_role("link").screenshot(animations="disabled", path="link.png"
When set to `"hide"`, screenshot will hide text caret. When set to `"initial"`, text caret behavior will not be changed. Defaults to `"hide"`.
- `mask` [List]\[[Locator]\] *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [mask_color](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [mask_color](/api/class-locator.mdx#locator-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `mask_color` [str] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -2701,9 +2678,9 @@ Selects option or options in ``.
```html
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
@@ -2995,7 +2972,7 @@ This method expects [Locator] to point to an [input element](https://developer.m
Added in: v1.14 locator.tap
-Perform a tap gesture on the element matching the locator.
+Perform a tap gesture on the element matching the locator. For examples of emulating other gestures by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
**Usage**
diff --git a/python/versioned_docs/version-stable/api/class-page.mdx b/python/versioned_docs/version-stable/api/class-page.mdx
index 414cbddf1ff..f009270dd62 100644
--- a/python/versioned_docs/version-stable/api/class-page.mdx
+++ b/python/versioned_docs/version-stable/api/class-page.mdx
@@ -664,6 +664,7 @@ await page.evaluate("matchMedia('(prefers-color-scheme: light)').matches")
- `color_scheme` "light" | "dark" | "no-preference" | "null" *(optional)* Added in: v1.9 #
Emulates [prefers-colors-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) media feature, supported values are `'light'` and `'dark'`. Passing `'Null'` disables color scheme emulation. `'no-preference'` is deprecated.
+- `contrast` "no-preference" | "more" | "null" *(optional)* Added in: v1.51 #
- `forced_colors` "active" | "none" | "null" *(optional)* Added in: v1.15 #
- `media` "screen" | "print" | "null" *(optional)* Added in: v1.9 #
@@ -786,7 +787,7 @@ await body_handle.dispose()
Optional argument to pass to [expression](/api/class-page.mdx#page-evaluate-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -2765,7 +2766,7 @@ page.screenshot(**kwargs)
When true, takes a screenshot of the full scrollable page, instead of the currently visible viewport. Defaults to `false`.
- `mask` [List]\[[Locator]\] *(optional)*#
- Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [mask_color](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box.
+ Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box `#FF00FF` (customized by [mask_color](/api/class-page.mdx#page-screenshot-option-mask-color)) that completely covers its bounding box. The mask is also applied to invisible elements, see [Matching only visible elements](../locators.mdx#matching-only-visible-elements) to disable that.
- `mask_color` [str] *(optional)* Added in: v1.35 #
Specify the color of the overlay box for masked elements, in [CSS color format](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value). Default color is pink `#FF00FF`.
@@ -4437,7 +4438,7 @@ html = await page.eval_on_selector(".main-container", "(e, suffix) => e.outer_ht
When true, the call requires selector to resolve to a single element. If given selector resolves to more than one element, the call throws an exception.
**Returns**
-- [Serializable]#
+- [Dict]#
---
@@ -4494,7 +4495,7 @@ div_counts = await page.eval_on_selector_all("div", "(divs, min) => divs.length
Optional argument to pass to [expression](/api/class-page.mdx#page-eval-on-selector-all-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
diff --git a/python/versioned_docs/version-stable/api/class-pageassertions.mdx b/python/versioned_docs/version-stable/api/class-pageassertions.mdx
index bac5b966a5d..c4ccdb63773 100644
--- a/python/versioned_docs/version-stable/api/class-pageassertions.mdx
+++ b/python/versioned_docs/version-stable/api/class-pageassertions.mdx
@@ -204,7 +204,7 @@ await expect(page).to_have_url(re.compile(".*checkout"))
Expected URL string or RegExp.
- `ignore_case` [bool] *(optional)* Added in: v1.44 #
- Whether to perform case-insensitive match. [ignore_case](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression flag if specified.
+ Whether to perform case-insensitive match. [ignore_case](/api/class-pageassertions.mdx#page-assertions-to-have-url-option-ignore-case) option takes precedence over the corresponding regular expression parameter if specified. A provided predicate ignores this flag.
- `timeout` [float] *(optional)* Added in: v1.18 #
Time to retry the assertion for in milliseconds. Defaults to `5000`.
diff --git a/python/versioned_docs/version-stable/api/class-request.mdx b/python/versioned_docs/version-stable/api/class-request.mdx
index fc0ced70f46..98610ce4a86 100644
--- a/python/versioned_docs/version-stable/api/class-request.mdx
+++ b/python/versioned_docs/version-stable/api/class-request.mdx
@@ -282,7 +282,7 @@ request.post_data_json
```
**Returns**
-- [NoneType] | [Serializable]#
+- [NoneType] | [Dict]#
---
diff --git a/python/versioned_docs/version-stable/api/class-response.mdx b/python/versioned_docs/version-stable/api/class-response.mdx
index 48d7ae62291..415c87769a6 100644
--- a/python/versioned_docs/version-stable/api/class-response.mdx
+++ b/python/versioned_docs/version-stable/api/class-response.mdx
@@ -147,7 +147,7 @@ response.json()
```
**Returns**
-- [Serializable]#
+- [Dict]#
---
diff --git a/python/versioned_docs/version-stable/api/class-route.mdx b/python/versioned_docs/version-stable/api/class-route.mdx
index 1a6138a3178..a6bfc24b38e 100644
--- a/python/versioned_docs/version-stable/api/class-route.mdx
+++ b/python/versioned_docs/version-stable/api/class-route.mdx
@@ -110,7 +110,7 @@ await page.route("**/*", handle)
- `method` [str] *(optional)*#
If set changes the request method (e.g. GET or POST).
-- `post_data` [str] | [bytes] | [Serializable] *(optional)*#
+- `post_data` [str] | [bytes] | [Dict] *(optional)*#
If set changes the post data of request.
- `url` [str] *(optional)*#
@@ -279,7 +279,7 @@ Use [route.continue_()](/api/class-route.mdx#route-continue) to immediately send
- `method` [str] *(optional)*#
If set changes the request method (e.g. GET or POST).
-- `post_data` [str] | [bytes] | [Serializable] *(optional)*#
+- `post_data` [str] | [bytes] | [Dict] *(optional)*#
If set changes the post data of request.
- `url` [str] *(optional)*#
@@ -348,7 +348,7 @@ await page.route("https://dog.ceo/api/breeds/list/all", handle)
- `method` [str] *(optional)*#
If set changes the request method (e.g. GET or POST).
-- `post_data` [str] | [bytes] | [Serializable] *(optional)*#
+- `post_data` [str] | [bytes] | [Dict] *(optional)*#
Allows to set post data of the request. If the data parameter is an object, it will be serialized to json string and `content-type` header will be set to `application/json` if not explicitly set. Otherwise the `content-type` header will be set to `application/octet-stream` if not explicitly set.
- `timeout` [float] *(optional)* Added in: v1.33 #
@@ -443,7 +443,7 @@ await page.route("**/xhr_endpoint", lambda route: route.fulfill(path="mock_data.
- `headers` [Dict]\[[str], [str]\] *(optional)*#
Response headers. Header values will be converted to a string.
-- `json` [Serializable] *(optional)* Added in: v1.29 #
+- `json` [Dict] *(optional)* Added in: v1.29 #
JSON response. This method will set the content type to `application/json` if not set.
- `path` [Union]\[[str], [pathlib.Path]\] *(optional)*#
diff --git a/python/versioned_docs/version-stable/api/class-touchscreen.mdx b/python/versioned_docs/version-stable/api/class-touchscreen.mdx
index 92cd1de9f9f..91aa8b53b0e 100644
--- a/python/versioned_docs/version-stable/api/class-touchscreen.mdx
+++ b/python/versioned_docs/version-stable/api/class-touchscreen.mdx
@@ -9,6 +9,8 @@ import HTMLCard from '@site/src/components/HTMLCard';
The Touchscreen class operates in main-frame CSS pixels relative to the top-left corner of the viewport. Methods on the touchscreen can only be used in browser contexts that have been initialized with `hasTouch` set to true.
+This class is limited to emulating tap gestures. For examples of other gestures simulated by manually dispatching touch events, see the [emulating legacy touch events](../touch-events.mdx) page.
+
---
diff --git a/python/versioned_docs/version-stable/api/class-websocket.mdx b/python/versioned_docs/version-stable/api/class-websocket.mdx
index 73bec21d0eb..7a7feca871e 100644
--- a/python/versioned_docs/version-stable/api/class-websocket.mdx
+++ b/python/versioned_docs/version-stable/api/class-websocket.mdx
@@ -7,7 +7,9 @@ import TabItem from '@theme/TabItem';
import HTMLCard from '@site/src/components/HTMLCard';
-The [WebSocket] class represents websocket connections in the page.
+The [WebSocket] class represents WebSocket connections within a page. It provides the ability to inspect and manipulate the data being transmitted and received.
+
+If you want to intercept or modify WebSocket frames, consider using [WebSocketRoute].
---
diff --git a/python/versioned_docs/version-stable/api/class-worker.mdx b/python/versioned_docs/version-stable/api/class-worker.mdx
index 46aa5313ffd..e628e7adecb 100644
--- a/python/versioned_docs/version-stable/api/class-worker.mdx
+++ b/python/versioned_docs/version-stable/api/class-worker.mdx
@@ -52,7 +52,7 @@ worker.evaluate(expression, **kwargs)
Optional argument to pass to [expression](/api/class-worker.mdx#worker-evaluate-option-expression).
**Returns**
-- [Serializable]#
+- [Dict]#
---
diff --git a/python/versioned_docs/version-stable/aria-snapshots.mdx b/python/versioned_docs/version-stable/aria-snapshots.mdx
index f619d02883f..988626da702 100644
--- a/python/versioned_docs/version-stable/aria-snapshots.mdx
+++ b/python/versioned_docs/version-stable/aria-snapshots.mdx
@@ -10,7 +10,7 @@ import LiteYouTube from '@site/src/components/LiteYouTube';
## Overview
-With the Playwright Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
+With Playwright's Snapshot testing you can assert the accessibility tree of a page against a predefined snapshot template.
`:
```py
-page.locator("x-details", has_text="Details" ).click()
+page.locator("x-details", has_text="Details").click()
```
```py
-await page.locator("x-details", has_text="Details" ).click()
+await page.locator("x-details", has_text="Details").click()
```
@@ -1318,14 +1318,14 @@ Consider a page with two buttons, the first invisible and the second [visible](.
```py
- page.locator("button").locator("visible=true").click()
+ page.locator("button").filter(visible=True).click()
```
```py
- await page.locator("button").locator("visible=true").click()
+ await page.locator("button").filter(visible=True).click()
```
diff --git a/python/versioned_docs/version-stable/network.mdx b/python/versioned_docs/version-stable/network.mdx
index 6e2c8aaba32..532202d1a82 100644
--- a/python/versioned_docs/version-stable/network.mdx
+++ b/python/versioned_docs/version-stable/network.mdx
@@ -466,9 +466,13 @@ Playwright uses simplified glob patterns for URL matching in network interceptio
- A double `**` matches any characters including `/`
1. Question mark `?` matches any single character except `/`
1. Curly braces `{}` can be used to match a list of options separated by commas `,`
+1. Square brackets `[]` can be used to match a set of characters
+1. Backslash `\` can be used to escape any of special characters (note to escape backslash itself as `\\`)
Examples:
- `https://example.com/*.js` matches `https://example.com/file.js` but not `https://example.com/path/file.js`
+- `https://example.com/\\?page=1` matches `https://example.com/?page=1` but not `https://example.com`
+- `**/v[0-9]*` matches `https://example.com/v1/` but not `https://example.com/vote/`
- `**/*.js` matches both `https://example.com/file.js` and `https://example.com/path/file.js`
- `**/*.{png,jpg,jpeg}` matches all image requests
diff --git a/python/versioned_docs/version-stable/release-notes.mdx b/python/versioned_docs/version-stable/release-notes.mdx
index 4503b2932dd..80cb585a0dc 100644
--- a/python/versioned_docs/version-stable/release-notes.mdx
+++ b/python/versioned_docs/version-stable/release-notes.mdx
@@ -7,6 +7,42 @@ import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
import HTMLCard from '@site/src/components/HTMLCard';
+## Version 1.51
+
+### Highlights
+* New option [indexed_db](/api/class-browsercontext.mdx#browser-context-storage-state-option-indexed-db) for [browser_context.storage_state()](/api/class-browsercontext.mdx#browser-context-storage-state) allows to save and restore IndexedDB contents. Useful when your application uses [IndexedDB API](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) to store authentication tokens, like Firebase Authentication.
+
+ Here is an example following the [authentication guide](./auth.mdx#reusing-signed-in-state):
+
+ ```python
+ # Save storage state into the file. Make sure to include IndexedDB.
+ storage = await context.storage_state(path="state.json", indexed_db=True)
+
+ # Create a new context with the saved storage state.
+ context = await browser.new_context(storage_state="state.json")
+ ```
+
+* New option [visible](/api/class-locator.mdx#locator-filter-option-visible) for [locator.filter()](/api/class-locator.mdx#locator-filter) allows matching only visible elements.
+
+ ```python
+ # Ignore invisible todo items.
+ todo_items = page.get_by_test_id("todo-item").filter(visible=True)
+ # Check there are exactly 3 visible ones.
+ await expect(todo_items).to_have_count(3)
+ ```
+
+* New option `contrast` for methods [page.emulate_media()](/api/class-page.mdx#page-emulate-media) and [browser.new_context()](/api/class-browser.mdx#browser-new-context) allows to emulate the `prefers-contrast` media feature.
+* New option [fail_on_status_code](/api/class-apirequest.mdx#api-request-new-context-option-fail-on-status-code) makes all fetch requests made through the [APIRequestContext] throw on response codes other than 2xx and 3xx.
+
+### Browser Versions
+* Chromium 134.0.6998.35
+* Mozilla Firefox 135.0
+* WebKit 18.4
+
+This version was also tested against the following stable channels:
+* Google Chrome 133
+* Microsoft Edge 133
+
## Version 1.50
### Async Pytest Plugin
@@ -707,9 +743,9 @@ This version was also tested against the following stable channels:
```html
- Red
- Green
- Blue
+ Red
+ Green
+ Blue
```
diff --git a/python/versioned_docs/version-stable/touch-events.mdx b/python/versioned_docs/version-stable/touch-events.mdx
index f61a0195164..3f9d6a5f0e5 100644
--- a/python/versioned_docs/version-stable/touch-events.mdx
+++ b/python/versioned_docs/version-stable/touch-events.mdx
@@ -1,6 +1,6 @@
---
id: touch-events
-title: "Emulating touch events"
+title: "Touch events (legacy)"
---
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
@@ -8,22 +8,302 @@ import HTMLCard from '@site/src/components/HTMLCard';
## Introduction
-Mobile web sites may listen to [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) and react to user touch gestures such as swipe, pinch, tap etc. To test this functionality you can manually generate [TouchEvent]s in the page context using [locator.evaluate()](/api/class-locator.mdx#locator-evaluate).
+Web applications that handle legacy [touch events](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) to respond to gestures like swipe, pinch, and tap can be tested by manually dispatching [TouchEvent](https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/TouchEvent)s to the page. The examples below demonstrate how to use [locator.dispatch_event()](/api/class-locator.mdx#locator-dispatch-event) and pass [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points as arguments.
-If your web application relies on [pointer events](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events) instead of touch events, you can use [locator.click()](/api/class-locator.mdx#locator-click) and raw [`Mouse`] events to simulate a single-finger touch, and this will trigger all the same pointer events.
+### Emulating pan gesture
-### Dispatching TouchEvent
+In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
-You can dispatch touch events to the page using [locator.dispatch_event()](/api/class-locator.mdx#locator-dispatch-event). [Touch](https://developer.mozilla.org/en-US/docs/Web/API/Touch) points can be passed as arguments, see examples below.
+
+
-#### Emulating pan gesture
+```py
+from playwright.sync_api import sync_playwright, expect
-In the example below, we emulate pan gesture that is expected to move the map. The app under test only uses `clientX/clientY` coordinates of the touch point, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
+def pan(locator, deltaX=0, deltaY=0, steps=5):
+ bounds = locator.bounding_box()
+ centerX = bounds['x'] + bounds['width'] / 2
+ centerY = bounds['y'] + bounds['height'] / 2
+
+ touches = [{
+ 'identifier': 0,
+ 'clientX': centerX,
+ 'clientY': centerY,
+ }]
+ locator.dispatch_event('touchstart', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ for i in range(1, steps + 1):
+ touches = [{
+ 'identifier': 0,
+ 'clientX': centerX + deltaX * i / steps,
+ 'clientY': centerY + deltaY * i / steps,
+ }]
+ locator.dispatch_event('touchmove', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ locator.dispatch_event('touchend')
+
+def test_pan_gesture_to_move_the_map(page):
+ page.goto('https://www.google.com/maps/place/@37.4117722,-122.0713234,15z', wait_until='commit')
+ page.get_by_role('button', name='Keep using web').click()
+ expect(page.get_by_role('button', name='Keep using web')).not_to_be_visible()
+ met = page.locator('[data-test-id="met"]')
+ for _ in range(5):
+ pan(met, 200, 100)
+ page.screenshot(path="screenshot.png")
+
+with sync_playwright() as p:
+ browser = p.chromium.launch()
+ context = browser.new_context(**p.devices['Pixel 7'])
+ page = context.new_page()
+ test_pan_gesture_to_move_the_map(page)
+ browser.close()
+```
+
+
+
+
+```py
+from playwright.async_api import async_playwright, expect
+
+async def pan(locator, deltaX=0, deltaY=0, steps=5):
+ bounds = await locator.bounding_box()
+ centerX = bounds['x'] + bounds['width'] / 2
+ centerY = bounds['y'] + bounds['height'] / 2
-#### Emulating pinch gesture
+ touches = [{
+ 'identifier': 0,
+ 'clientX': centerX,
+ 'clientY': centerY,
+ }]
+ await locator.dispatch_event('touchstart', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ for i in range(1, steps + 1):
+ touches = [{
+ 'identifier': 0,
+ 'clientX': centerX + deltaX * i / steps,
+ 'clientY': centerY + deltaY * i / steps,
+ }]
+ await locator.dispatch_event('touchmove', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ await locator.dispatch_event('touchend')
+
+async def test_pan_gesture_to_move_the_map(page):
+ await page.goto('https://www.google.com/maps/place/@37.4117722,-122.0713234,15z', wait_until='commit')
+ await page.get_by_role('button', name='Keep using web').click()
+ await expect(page.get_by_role('button', name='Keep using web')).not_to_be_visible()
+ met = page.locator('[data-test-id="met"]')
+ for _ in range(5):
+ await pan(met, 200, 100)
+ await page.screenshot(path="screenshot.png")
+
+async def main():
+ async with async_playwright() as p:
+ browser = await p.chromium.launch()
+ context = await browser.new_context(**p.devices['Pixel 7'])
+ page = await context.new_page()
+ await test_pan_gesture_to_move_the_map(page)
+ await browser.close()
+
+import asyncio
+asyncio.run(main())
+```
+
+
+
+
+### Emulating pinch gesture
In the example below, we emulate pinch gesture, i.e. two touch points moving closer to each other. It is expected to zoom out the map. The app under test only uses `clientX/clientY` coordinates of touch points, so we initialize just that. In a more complex scenario you may need to also set `pageX/pageY/screenX/screenY`, if your app needs them.
+
+
+
+```py
+from playwright.sync_api import sync_playwright, expect
+
+def pinch(locator, arg):
+ bounds = locator.bounding_box()
+ centerX = bounds['x'] + bounds['width'] / 2
+ centerY = bounds['y'] + bounds['height'] / 2
+
+ deltaX = arg.get('deltaX', 50)
+ steps = arg.get('steps', 5)
+ stepDeltaX = deltaX / (steps + 1)
+
+ touches = [
+ {
+ 'identifier': 0,
+ 'clientX': centerX - (deltaX if arg.get('direction') == 'in' else stepDeltaX),
+ 'clientY': centerY,
+ },
+ {
+ 'identifier': 1,
+ 'clientX': centerX + (deltaX if arg.get('direction') == 'in' else stepDeltaX),
+ 'clientY': centerY,
+ },
+ ]
+ locator.dispatch_event('touchstart', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ for i in range(1, steps + 1):
+ offset = deltaX - i * stepDeltaX if arg.get('direction') == 'in' else stepDeltaX * (i + 1)
+ touches = [
+ {
+ 'identifier': 0,
+ 'clientX': centerX - offset,
+ 'clientY': centerY,
+ },
+ {
+ 'identifier': 1,
+ 'clientX': centerX + offset,
+ 'clientY': centerY,
+ },
+ ]
+ locator.dispatch_event('touchmove', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ locator.dispatch_event('touchend', {
+ 'touches': [],
+ 'changedTouches': [],
+ 'targetTouches': []
+ })
+
+def test_pinch_in_gesture_to_zoom_out_the_map(page):
+ page.goto('https://www.google.com/maps/place/@37.4117722,-122.0713234,15z', wait_until='commit')
+ page.get_by_role('button', name='Keep using web').click()
+ expect(page.get_by_role('button', name='Keep using web')).not_to_be_visible()
+ met = page.locator('[data-test-id="met"]')
+ for _ in range(5):
+ pinch(met, {'deltaX': 40, 'direction': 'in'})
+ page.screenshot(path="screenshot.png")
+
+with sync_playwright() as p:
+ browser = p.chromium.launch()
+ context = browser.new_context(**p.devices['Pixel 7'])
+ page = context.new_page()
+ test_pinch_in_gesture_to_zoom_out_the_map(page)
+ browser.close()
+```
+
+
+
+
+```py
+from playwright.async_api import async_playwright, expect
+
+async def pinch(locator, arg):
+ bounds = await locator.bounding_box()
+ centerX = bounds['x'] + bounds['width'] / 2
+ centerY = bounds['y'] + bounds['height'] / 2
+
+ deltaX = arg.get('deltaX', 50)
+ steps = arg.get('steps', 5)
+ stepDeltaX = deltaX / (steps + 1)
+
+ touches = [
+ {
+ 'identifier': 0,
+ 'clientX': centerX - (deltaX if arg.get('direction') == 'in' else stepDeltaX),
+ 'clientY': centerY,
+ },
+ {
+ 'identifier': 1,
+ 'clientX': centerX + (deltaX if arg.get('direction') == 'in' else stepDeltaX),
+ 'clientY': centerY,
+ },
+ ]
+ await locator.dispatch_event('touchstart', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ for i in range(1, steps + 1):
+ offset = deltaX - i * stepDeltaX if arg.get('direction') == 'in' else stepDeltaX * (i + 1)
+ touches = [
+ {
+ 'identifier': 0,
+ 'clientX': centerX - offset,
+ 'clientY': centerY,
+ },
+ {
+ 'identifier': 1,
+ 'clientX': centerX + offset,
+ 'clientY': centerY,
+ },
+ ]
+ await locator.dispatch_event('touchmove', {
+ 'touches': touches,
+ 'changedTouches': touches,
+ 'targetTouches': touches
+ })
+
+ await locator.dispatch_event('touchend', {
+ 'touches': [],
+ 'changedTouches': [],
+ 'targetTouches': []
+ })
+
+async def test_pinch_in_gesture_to_zoom_out_the_map(page):
+ await page.goto('https://www.google.com/maps/place/@37.4117722,-122.0713234,15z', wait_until='commit')
+ await page.get_by_role('button', name='Keep using web').click()
+ await expect(page.get_by_role('button', name='Keep using web')).not_to_be_visible()
+ met = page.locator('[data-test-id="met"]')
+ for _ in range(5):
+ await pinch(met, {'deltaX': 40, 'direction': 'in'})
+ await page.screenshot(path="screenshot.png")
+
+async def main():
+ async with async_playwright() as p:
+ browser = await p.chromium.launch()
+ context = await browser.new_context(**p.devices['Pixel 7'])
+ page = await context.new_page()
+ await test_pinch_in_gesture_to_zoom_out_the_map(page)
+ await browser.close()
+
+import asyncio
+asyncio.run(main())
+```
+
+
+
+
[Accessibility]: /api/class-accessibility.mdx "Accessibility"
[APIRequest]: /api/class-apirequest.mdx "APIRequest"
diff --git a/python/versioned_sidebars/version-stable-sidebars.json b/python/versioned_sidebars/version-stable-sidebars.json
index 8509a82a991..2f63b3531ba 100644
--- a/python/versioned_sidebars/version-stable-sidebars.json
+++ b/python/versioned_sidebars/version-stable-sidebars.json
@@ -159,6 +159,10 @@
"type": "doc",
"id": "codegen"
},
+ {
+ "type": "doc",
+ "id": "touch-events"
+ },
{
"type": "doc",
"id": "trace-viewer"