Playwright v1.51.0 — Release Notes & Engineering Impact

## StorageState for indexedDB * New option [`indexedDB`](https://playwright.dev/docs/api/class-browsercontext#browser-context-storage-state-option-indexed-db) for [browserContext.storageState()](https://playwright.dev/docs/api/class-browsercontext#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](https://playwright.dev/docs/auth#basic-shared-account-in-all-tests): ```js // tests/auth.setup.ts import { test as setup, expect } from '@playwright/test'; import path from 'path'; const authFile = path.join(__dirname, '../playwright/.auth/user.json'); setup('authenticate', async ({ page }) => { await page.goto('/'); // ... perform authentication steps ... // make sure to save indexedDB await page.context().storageState({ path: authFile, indexedDB: true }); }); ``` ## Copy prompt New "Copy prompt" button on errors in the HTML report, trace viewer and UI mode. Click to copy a pre-filled LLM prompt that contains the error message and useful context for fixing the error.  ## Filter visible elements New option [`visible`](https://playwright.dev/docs/api/class-locator#locator-filter-option-visible) for [locator.filter()](https://playwright.dev/docs/api/class-locator#locator-filter) allows matching only visible elements. ```js // example.spec.ts test('some test', async ({ page }) => { // Ignore invisible todo items. const todoItems = page.getByTestId('todo-item').filter({ visible: true }); // Check there are exactly 3 visible ones. await expect(todoItems).toHaveCount(3); }); ``` ## Git information in HTML report Set option [testConfig.captureGitInfo](https://playwright.dev/docs/api/class-testconfig#test-config-capture-git-info) to capture git information into [testConfig.metadata](https://playwright.dev/docs/api/class-testconfig#test-config-metadata). ```js // playwright.config.ts import { defineConfig } from '@playwright/test'; export default defineConfig({ captureGitInfo: { commit: true, diff: true } }); ``` HTML report will show this information when available:  ## Test Step improvements A new [TestStepInfo](https://playwright.dev/docs/api/class-teststepinfo) object is now available in test steps. You can add step attachments or skip the step under some conditions. ```js test('some test', async ({ page, isMobile }) => { // Note the new "step" argument: await test.step('here is my step', async step => { step.skip(isMobile, 'not relevant on mobile layouts'); // ... await step.attach('my attachment', { body: 'some text' }); // ... }); }); ``` ## Miscellaneous * New option `contrast` for methods [page.emulateMedia()](https://playwright.dev/docs/api/class-page#page-emulate-media) and [browser.newContext()](https://playwright.dev/docs/api/class-browser#browser-new-context) allows to emulate the `prefers-contrast` media feature. * New option [`failOnStatusCode`](https://playwright.dev/docs/api/class-apirequest#api-request-new-context-option-fail-on-status-code) makes all fetch requests made through the [APIRequestContext](https://playwright.dev/docs/api/class-apirequestcontext) throw on response codes other than 2xx and 3xx. * Assertion [expect(page).toHaveURL()](https://playwright.dev/docs/api/class-pageassertions#page-assertions-to-have-url) now supports a predicate. ## 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