mcpField
P
playwright-cli

playwright-cli

github.com/mizchiTesting & quality416108 installsUpdated 2w ago
Repository

About playwright-cli

playwright-cli is a skill for browser automation through the Playwright terminal commands. It covers running tests, generating test code, and capturing screenshots or PDFs, rather than agent-driven live browser control or test-suite authoring.

Key features

  1. 01Run all or selected end-to-end tests
  2. 02Generate test code from browser actions
  3. 03Capture screenshots from URLs
  4. 04Export web pages as PDFs
  5. 05Shard tests for CI

Use cases

  1. 01Run end-to-end tests from a terminal
  2. 02Record browser actions as test code
  3. 03Create screenshots or PDFs of web pages
  4. 04Split test runs across CI jobs

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/mizchi/skills --skill playwright-cli

After installing, type/playwright-cliin Claude Code to confirm it loaded.

Bundled filesREADME.md

Details

From the project README

Playwright CLI

Terminal-based browser automation using npx playwright. This skill covers the CLI surface: running tests, generating test code via codegen, taking screenshots/PDFs, and CI sharding flags.

Scope boundary

I want to...Use
Run E2E testsnpx playwright test (this skill)
Record a browser session → test codenpx playwright codegen (this skill)
One-off screenshot / PDF from a URLnpx playwright screenshot / pdf (this skill)
Write / review / tune a Playwright test suiteplaywright-test skill
Agent-driven real-time browser control (navigate → click → read → assert)mcp__claude-in-chrome__* tools (not this skill)
Interactive data scraping / SPA explorationclaude-in-chrome MCP tools or a Playwright script executed via npx playwright test

For data scraping / SPA flows where you need to programmatically navigate, click "Load More", extract DOM, and save JSON: write a tests/*.spec.ts and run npx playwright test. See playwright-test skill for the test-authoring patterns.

Quick Reference

# Interactive codegen (generates test code from browser actions)
npx playwright codegen https://example.com

# Run all tests
npx playwright test

# Run specific file
npx playwright test tests/login.spec.ts

# Run specific test by title
npx playwright test -g "should login"

# Debug mode (opens Playwright Inspector)
npx playwright test --debug

# UI mode (visual test runner with time-travel)
npx playwright test --ui

# Headed mode (see the browser)
npx playwright test --headed

# Specific browser
npx playwright test --project=chromium

# Generate trace
npx playwright test --trace on

# View report
npx playwright show-report

# Install browsers
npx playwright install
npx playwright install chromium --with-deps  # CI-optimized

Sharding for CI

npx playwright test --shard=1/3
npx playwright test --shard=2/3
npx playwright test --shard=3/3

Screenshot / PDF

# Screenshot from CLI
npx playwright screenshot --browser=chromium https://example.com screenshot.png

# PDF (Chromium only)
npx playwright pdf https://example.com page.pdf

Comments

Markdown supported