This package contains the Chrome Extensions flavor of the Playwright library.
For that, it relies on chrome.debugger
to implement playwright's ConnectionTransport
interface.
NOTE: If you want to write end-to-end tests, you should use @playwright/test instead.
Note: This extension is available in Chrome Web Store.
A small demo of recorder and player in action:
It provides playwright recorder (the same used in playwright codegen
) bundled as a chrome extension, with no other dependencies.
This way, with your normal chrome / chromium / edge browser, you can record playwright scripts in your prefered language.
In terms of chrome extension functionality, it provides:
It's possible to use playwright-crx
as a library to create new chrome extensions.
Here's a simple example of a background service worker for a chrome extension using playwright-crx:
import { crx, expect } from 'playwright-crx/test';
// if you don't need assertions, you can reduce the bundle size by importing crx from playwright-crx
// import { crx } from 'playwright-crx';
chrome.action.onClicked.addListener(async ({ id: tabId }) => {
const crxApp = await crx.start({ slowMo: 500 });
try {
// tries to connect to the active tab, or creates a new one
const page = await crxApp.attach(tabId!).catch(() => crxApp.newPage());
await page.goto('https://demo.playwright.dev/todomvc/#/');
await page.getByPlaceholder('What needs to be done?').click();
await page.getByPlaceholder('What needs to be done?').fill('Hello World!');
await page.getByPlaceholder('What needs to be done?').press('Enter');
// assertions work too
await expect(page.getByTestId('todo-title')).toHaveText('Hello World!');
} finally {
// page stays open, but no longer controlled by playwright
await crxApp.detach(page);
// releases chrome.debugger
await crxApp.close();
}
});
A more complete example can be found in examples/todomvc-crx
.
To build playwright-crx
:
npm ci
npm run build
Playwright is nested as a git subtree.
To update it, just run the following command (replace v1.40.0
with the desired release tag):
git subtree pull --prefix=playwright git@github.com:microsoft/playwright.git v1.40.0 --squash