Playwright for JavaScript (Node.js): Complete Guide with Examples

Online Python Trainer for Beginners

Learn Python easily without overwhelming theory. Solve practical tasks with automatic checking, get hints in Russian, and write code directly in your browser — no installation required.

Start Course

Playwright for JavaScript (Node.js): Complete Guide with Examples

\n\n

Playwright is a modern open-source library for browser automation, developed by Microsoft. It provides a unified API for controlling Chromium, Firefox, and WebKit (Safari engine) via the DevTools protocol. Unlike Selenium, Playwright was originally designed to work with modern web applications and supports scenarios such as network request interception, mobile device emulation, working with multiple pages and tabs, as well as automatic element waiting.

\n\n

The main purpose of Playwright is end-to-end (E2E) testing of web applications. However, its capabilities go far beyond testing: the library is used for parsing dynamic websites (SPA), automating routine tasks (e.g., form filling), creating screenshots and PDF reports, as well as monitoring web page performance. Thanks to support for all three major browser engines, you can be confident that your application works correctly in any environment.

\n\n

Playwright's key advantage over competitors is speed and reliability. The library uses an asynchronous promise-based architecture, automatically waits for elements to appear (no need to write sleep()), and can work with iframes, pop-up windows, and intercept browser console messages. Playwright also provides a built-in test generator (codegen) that records your actions in the browser and turns them into ready-made code.

\n\n

Installing Playwright

\n\n

To install Playwright in a Node.js project, run the following commands in the terminal:

\n\n
npm init -y\nnpm install playwright\nnpx playwright install
\n\n

The first command creates the package.json file, the second installs the library itself, and the third downloads the browsers (Chromium, Firefox, and WebKit). If you want to install only one browser, use npx playwright install chromium.

\n\n

For TypeScript, additionally install the types:

\n\n
npm install -D @playwright/test
\n\n

If you are using Playwright as a test framework, it is recommended to install @playwright/test, which includes the test runner, fixtures, and configuration.

\n\n

Quick Start: Minimal Working Example

\n\n

Create a file example.js and paste the following code:

\n\n
const { chromium } = require('playwright');\n\n(async () => {\n  // Launch the browser (headless: true — without graphical interface)\n  const browser = await chromium.launch({ headless: true });\n  // Create a new page (tab)\n  const page = await browser.newPage();\n  \n  // Navigate to the website\n  await page.goto('https://example.com');\n  \n  // Get the page title\n  const title = await page.title();\n  console.log('Page title:', title);\n  \n  // Take a screenshot\n  await page.screenshot({ path: 'example.png' });\n  \n  // Close the browser\n  await browser.close();\n})();
\n\n

Run the script with the command node example.js. As a result, you will see the page title in the console, and the file example.png with the screenshot will appear in the folder.

\n\n

This example demonstrates the basic workflow with Playwright: launching the browser, creating a page, navigation, interacting with the DOM, and closing.

\n\n

Main Methods and Classes of Playwright

\n\n

Below are the key methods and classes of the library. For each, the signature, a brief description, and a working example are provided.

\n\n

1. browser.newPage()

\n

Signature: async browser.newPage(options?: BrowserContextOptions): Promise<Page>

\n

Description: Creates a new page (tab) in the current browser context.

Recommendations