Playwright

Test Execution

Run tests

8commands

Code Generation

Record tests

Browsers

Browser management

Tracing

View traces

Reports

Test reports

UI Mode

Interactive debugging

Debugging

Debug tests

9commands

Screenshots

Visual capture

Visual Testing

Snapshot comparisons

Configuration

Test config

Component

Component testing

Accessibility

A11y testing

CI Integration

CI/CD setup

Initialize Playwright project

$ npm init playwright@latest

Create a new Playwright project with configuration

Install browsers

$ npx playwright install

Download and install Playwright browsers (Chromium, Firefox, WebKit)

Run tests

$ npx playwright test

Execute all Playwright tests

Run all tests

$ npx playwright test

Run all Playwright tests.

Run specific file

$ npx playwright test tests/login.spec.ts

Run tests from a specific file.

Run by grep

$ npx playwright test -g 'login'

Run tests matching a pattern.

Run headed

$ npx playwright test --headed

Run tests with browser visible.

Debug mode

$ npx playwright test --debug

Run tests in debug mode.

UI mode

$ npx playwright test --ui

Run tests in interactive UI mode.

Specific browser

$ npx playwright test --project=chromium

Run tests in specific browser.

Parallel workers

$ npx playwright test --workers=4

Run tests with specific workers.

Record tests

$ npx playwright codegen example.com

Record user interactions as tests.

Record with viewport

$ npx playwright codegen --viewport-size=1280,720 example.com

Record with specific viewport size.

Record Python tests

$ npx playwright codegen --target=python example.com

Generate Python test code.

Save auth state

$ npx playwright codegen --save-storage=auth.json example.com

Save authentication state.

Load auth state

$ npx playwright codegen --load-storage=auth.json example.com

Record with existing auth.

Install browsers

$ npx playwright install

Install all browsers.

Install with deps

$ npx playwright install --with-deps

Install browsers and system deps.

Install specific browser

$ npx playwright install chromium

Install specific browser.

Install deps only

$ npx playwright install-deps

Install system dependencies only.

Run with trace

$ npx playwright test --trace=on

Record trace for all tests.

Trace on retry

$ npx playwright test --trace=on-first-retry

Record trace only on retries.

View trace

$ npx playwright show-trace trace.zip

Open trace viewer.

Trace retain on failure

$ npx playwright test --trace=retain-on-failure

Keep traces only for failures.

Show HTML report

$ npx playwright show-report

Open the HTML test report.

HTML reporter

$ npx playwright test --reporter=html

Generate HTML report.

JSON reporter

$ npx playwright test --reporter=json

Output results as JSON.

JUnit reporter

$ npx playwright test --reporter=junit

Generate JUnit XML report.

Multiple reporters

$ npx playwright test --reporter=html,json

Use multiple reporters.

Open UI mode

$ npx playwright test --ui

Run tests in interactive UI mode.

UI mode with filter

$ npx playwright test --ui -g 'login'

Open UI mode with test filter.

UI mode specific file

$ npx playwright test --ui tests/checkout.spec.ts

Open UI mode for specific test file.

UI mode port

$ npx playwright test --ui-port=8080

Run UI mode on custom port.

UI mode host

$ npx playwright test --ui-host=0.0.0.0

Run UI mode accessible from network.

Debug mode

$ npx playwright test --debug

Run with Playwright Inspector.

Debug environment

$ PWDEBUG=1 npx playwright test

Enable debug mode via env var.

Debug console

$ PWDEBUG=console npx playwright test

Debug with console output.

Pause in test

$ await page.pause();

Add breakpoint in test code.

Slow motion

$ npx playwright test --headed --slowmo=500

Run tests in slow motion.

Set global timeout

$ npx playwright test --timeout=60000

Set timeout for all tests (60s).

View trace file

$ npx playwright show-trace trace.zip

Open trace viewer for debugging.

Multiple reporters

$ npx playwright test --reporter=html --reporter=json

Output multiple report formats.

Stop on failures

$ npx playwright test --max-failures=5

Stop after specified number of failures.

Full page screenshot

$ await page.screenshot({ path: 'screenshot.png', fullPage: true });

Capture full page screenshot.

Element screenshot

$ await page.locator('.header').screenshot({ path: 'header.png' });

Screenshot specific element.

Screenshot on failure

$ npx playwright test --screenshot=only-on-failure

Auto capture on test failure.

Screenshot all tests

$ npx playwright test --screenshot=on

Capture screenshot for all tests.

Omit background

$ await page.screenshot({ path: 'shot.png', omitBackground: true });

Screenshot with transparent bg.

Visual comparison

$ await expect(page).toHaveScreenshot();

Compare against baseline image.

Update snapshots

$ npx playwright test --update-snapshots

Update baseline screenshots.

Named snapshot

$ await expect(page).toHaveScreenshot('homepage.png');

Visual test with custom name.

Element visual test

$ await expect(page.locator('.card')).toHaveScreenshot();

Visual test for element.

Threshold config

$ await expect(page).toHaveScreenshot({ maxDiffPixelRatio: 0.1 });

Allow 10% pixel difference.

Initialize config

$ npm init playwright@latest

Create new Playwright project.

Run with config

$ npx playwright test --config=custom.config.ts

Use custom config file.

List projects

$ npx playwright test --list

List all configured projects.

Global setup

$ npx playwright test --global-setup=./global-setup.ts

Run global setup script.

Output directory

$ npx playwright test --output=./test-results

Set test output directory.

UI mode on network

$ npx playwright test --ui-port=0 --ui-host=0.0.0.0

Open UI mode accessible from any network interface.

Run tests by tag

$ npx playwright test --grep @smoke

Run tests matching specific tag.

Exclude tests by tag

$ npx playwright test --grep-invert @slow

Skip tests matching tag pattern.

Repeat each test

$ npx playwright test --repeat-each=3

Run each test multiple times.

Run with visible browser

$ npx playwright test --project=chromium --headed

Run tests in specific browser with UI.

Get accessibility tree

$ await page.accessibility.snapshot()

Capture accessibility tree snapshot.

Axe accessibility tests

$ npx @axe-core/playwright test

Run automated accessibility checks.

Auto-retry flaky tests

$ npx playwright test --retries=2

Retry failed tests automatically.

Run test shard

$ npx playwright test --shard=1/4

Run specific shard for parallel CI.

Use CPU percentage

$ npx playwright test --workers=50%

Limit workers to CPU percentage.

Fully parallel mode

$ npx playwright test --fully-parallel

Run all tests in parallel.

Discussion

Loading comments...

Playwright

Browser testing framework for reliable end-to-end tests. Automate Chromium, Firefox, and WebKit with powerful selectors.

69 commands

Browse by Topic

Getting Started

Quick setup and installation

Test Execution

Run tests

8commands

Code Generation

Record tests

Browsers

Browser management

Tracing

View traces

Reports

Test reports

UI Mode

Interactive debugging

Debugging

Debug tests

9commands

Screenshots

Visual capture

Visual Testing

Snapshot comparisons

Configuration

Test config

Component

Component testing

Accessibility

A11y testing

CI Integration

CI/CD setup