Playwright Library
Playwright can either be used as a part of the Playwright Test, or as a Playwright Library (this guide). If you are working on an application that utilizes Playwright capabilities or you are using Playwright with another test runner, read on.
#
UsageUse npm or Yarn to install Playwright library in your Node.js project. See system requirements.
npm i -D playwright
This single command downloads the Playwright NPM package and browser binaries for Chromium, Firefox and WebKit. To modify this behavior see managing browsers.
Once installed, you can require
Playwright in a Node.js script, and launch any of the 3 browsers (chromium
, firefox
and webkit
).
const { chromium } = require('playwright');
(async () => { const browser = await chromium.launch(); // Create pages, interact with UI elements, assert values await browser.close();})();
Playwright APIs are asynchronous and return Promise objects. Our code examples use the async/await pattern to ease readability. The code is wrapped in an unnamed async arrow function which is invoking itself.
(async () => { // Start of async arrow function // Function code // ...})(); // End of the function and () to invoke itself
#
First scriptIn our first script, we will navigate to whatsmyuseragent.org
and take a screenshot in WebKit.
const { webkit } = require('playwright');
(async () => { const browser = await webkit.launch(); const page = await browser.newPage(); await page.goto('http://whatsmyuseragent.org/'); await page.screenshot({ path: `example.png` }); await browser.close();})();
By default, Playwright runs the browsers in headless mode. To see the browser UI, pass the headless: false
flag while launching the browser. You can also use slowMo
to slow down execution. Learn more in the debugging tools section.
firefox.launch({ headless: false, slowMo: 50 });
#
Record scriptsCommand line tools can be used to record user interactions and generate JavaScript code.
npx playwright codegen wikipedia.org
#
TypeScript supportPlaywright includes built-in support for TypeScript. Type definitions will be imported automatically. It is recommended to use type-checking to improve the IDE experience.
#
In JavaScriptAdd the following to the top of your JavaScript file to get type-checking in VS Code or WebStorm.
//@ts-check// ...
Alternatively, you can use JSDoc to set types for variables.
/** @type {import('playwright').Page} */let page;
#
In TypeScriptTypeScript support will work out-of-the-box. Types can also be imported explicitly.
let page: import('playwright').Page;
#
System requirementsPlaywright requires Node.js version 12 or above. The browser binaries for Chromium, Firefox and WebKit work across the 3 platforms (Windows, macOS, Linux):
#
WindowsWorks with Windows and Windows Subsystem for Linux (WSL).
#
macOSRequires 10.14 (Mojave) or above.
#
LinuxDepending on your Linux distribution, you might need to install additional dependencies to run the browsers.
note
Only Ubuntu 18.04 and Ubuntu 20.04 are officially supported.
See also in the Command line tools which has a command to install all necessary dependencies automatically for Ubuntu LTS releases.