Playwright is a framework for Web Testing and Automation. It allows testing Chromium, Firefox and WebKit with a single API.
Go to file
Dmitry Gozman ece4789165
feat(debug): expose playwright object in console (#2365)
- playwright.$ and playwright.$$ to query elements;
- playwright.inspect to reveal an element;
- playwright.clear to remove highlight.
2020-05-27 22:16:54 -07:00
.circleci devops: add package-lock.json (#1859) (#1889) 2020-04-20 16:57:01 -07:00
.github fix(types): properly export typescript types from packages (#2364) 2020-05-26 17:19:05 -07:00
browser_patches browser(webkit): fix crash when commands are handled in the UIProcess (#2327) 2020-05-21 07:33:38 -07:00
docs feat: make browserServer.kill() wait for the process to exit (#2375) 2020-05-27 19:59:03 -07:00
packages fix(types): properly export typescript types from packages (#2364) 2020-05-26 17:19:05 -07:00
src feat(debug): expose playwright object in console (#2365) 2020-05-27 22:16:54 -07:00
test test: hack in output directory cleanup for parallel runs (#2378) 2020-05-27 22:03:38 -07:00
utils chore: rename root index-for-dev.js into index.js (#2337) 2020-05-23 00:03:57 -07:00
.appveyor.yml devops: add package-lock.json (#1859) (#1889) 2020-04-20 16:57:01 -07:00
.cirrus.yml chore: windows bots via github actions (#678) 2020-01-28 18:04:51 -08:00
.editorconfig Initial commit 2019-11-19 10:58:15 -08:00
.eslintignore types: better types (#1166) 2020-03-20 01:30:35 -07:00
.eslintrc.js chore(lint): add @typescript-eslint/no-unnecessary-type-assertion rule (#898) 2020-02-07 13:38:50 -08:00
.gitattributes chore: windows bots via github actions (#678) 2020-01-28 18:04:51 -08:00
.gitignore chore: drop dependency on playwright-core in all our packages (#2318) 2020-05-21 13:18:15 -07:00
.npmignore chore: drop dependency on playwright-core in all our packages (#2318) 2020-05-21 13:18:15 -07:00
.travis.yml devops: remove custom caching on travis (#2215) 2020-05-12 16:49:28 -07:00
browsers.json feat(webkit): roll webkit to r1242 (#2361) 2020-05-26 14:48:21 -07:00
CODE_OF_CONDUCT.md Initial CODE_OF_CONDUCT.md commit 2019-11-15 10:32:47 -08:00
CONTRIBUTING.md docs(CONTRIBUTING.md): fix typo in doc (#2169) 2020-05-09 17:43:24 -07:00
index.d.ts types: better types (#1166) 2020-03-20 01:30:35 -07:00
index.js chore: rename root index-for-dev.js into index.js (#2337) 2020-05-23 00:03:57 -07:00
install-from-github.js chore: drop dependency on playwright-core in all our packages (#2318) 2020-05-21 13:18:15 -07:00
LICENSE chore(license): use Apache 2.0 (#389) 2020-01-06 18:22:35 -08:00
NOTICE chore(license): add NOTICE (#309) 2019-12-19 12:19:54 -08:00
package-lock.json chore: drop dependency on playwright-core in all our packages (#2318) 2020-05-21 13:18:15 -07:00
package.json chore: drop dependency on playwright-core in all our packages (#2318) 2020-05-21 13:18:15 -07:00
README.md docs: recommend a dev install of Playwright in the docs. (#2355) 2020-05-26 10:24:48 -07:00
SECURITY.md Initial SECURITY.md commit 2019-11-15 10:32:49 -08:00
tsconfig.json fix(css selector): support comma-separated selector lists (#2120) 2020-05-07 13:36:54 -07:00

🎭 Playwright

npm version Join Slack Chromium version Firefox version WebKit version

Docs | API reference | Changelog

Playwright is a Node library to automate Chromium, Firefox and WebKit with a single API. Playwright is built to enable cross-browser web automation that is ever-green, capable, reliable and fast.

Linux macOS Windows
Chromium 84.0.4144.0
WebKit 13.2
Firefox 77.0b3

Headless execution is supported for all the browsers on all platforms.

Usage

npm i -D playwright

This installs Playwright and browser binaries for Chromium, Firefox and WebKit. Once installed, you can require Playwright in a Node.js script and automate web browser interactions.

Capabilities

Playwright is built to automate the broad and growing set of web browser capabilities used by Single Page Apps and Progressive Web Apps.

  • Scenarios that span multiple page, domains and iframes
  • Auto-wait for elements to be ready before executing actions (like click, fill)
  • Intercept network activity for stubbing and mocking network requests
  • Emulate mobile devices, geolocation, permissions
  • Support for web components via shadow-piercing selectors
  • Native input events for mouse and keyboard
  • Upload and download files

Examples

Page screenshot

This code snippet navigates to whatsmyuseragent.org in Chromium, Firefox and WebKit, and saves 3 screenshots.

const playwright = require('playwright');

(async () => {
  for (const browserType of ['chromium', 'firefox', 'webkit']) {
    const browser = await playwright[browserType].launch();
    const context = await browser.newContext();
    const page = await context.newPage();
    await page.goto('http://whatsmyuseragent.org/');
    await page.screenshot({ path: `example-${browserType}.png` });
    await browser.close();
  }
})();

Mobile and geolocation

This snippet emulates Mobile Safari on a device at a given geolocation, navigates to maps.google.com, performs action and takes a screenshot.

const { webkit, devices } = require('playwright');
const iPhone11 = devices['iPhone 11 Pro'];

(async () => {
  const browser = await webkit.launch();
  const context = await browser.newContext({
    ...iPhone11,
    geolocation: { longitude: 12.492507, latitude: 41.889938 },
    permissions: ['geolocation']
  });
  const page = await context.newPage();
  await page.goto('https://maps.google.com');
  await page.click('text="Your location"');
  await page.waitForRequest(/.*preview\/pwa/);
  await page.screenshot({ path: 'colosseum-iphone.png' });
  await browser.close();
})();

Evaluate in browser context

This code snippet navigates to example.com in Firefox, and executes a script in the page context.

const { firefox } = require('playwright');

(async () => {
  const browser = await firefox.launch();
  const context = await browser.newContext();
  const page = await context.newPage();
  await page.goto('https://www.example.com/');
  const dimensions = await page.evaluate(() => {
    return {
      width: document.documentElement.clientWidth,
      height: document.documentElement.clientHeight,
      deviceScaleFactor: window.devicePixelRatio
    }
  });
  console.log(dimensions);

  await browser.close();
})();

Intercept network requests

This code snippet sets up request routing for a WebKit page to log all network requests.

const { webkit } = require('playwright');

(async () => {
  const browser = await webkit.launch();
  const context = await browser.newContext();
  const page = await context.newPage();

  // Log and continue all network requests
  page.route('**', route => {
    console.log(route.request().url());
    route.continue();
  });

  await page.goto('http://todomvc.com');
  await browser.close();
})();

Resources