playwright-cli

Playwright CLI

基于终端的浏览器自动化，使用 npx playwright。本技能涵盖 CLI 用法：运行测试、通过 codegen 生成测试代码、截取屏幕截图/生成 PDF，以及 CI 分片标志。

范围说明

我想要……	使用
运行 E2E 测试	npx playwright test（本技能）
录制浏览器会话 → 测试代码	npx playwright codegen（本技能）
从 URL 一次性生成屏幕截图 / PDF	npx playwright screenshot / pdf（本技能）
编写 / 审查 / 调整 Playwright 测试套件	playwright-test 技能
由 Agent 驱动实时控制浏览器（导航 → 点击 → 读取 → 断言）	mcp__claude-in-chrome__* 工具（不属于本技能）
交互式数据抓取 / SPA 探索	claude-in-chrome MCP 工具，或通过 npx playwright test 执行的 Playwright 脚本

对于需要通过编程方式导航、点击“加载更多”、提取 DOM 并保存 JSON 的数据抓取 / SPA 流程：编写 tests/*.spec.ts 并运行 npx playwright test。有关测试编写模式，请参阅 playwright-test 技能。

快速参考

# 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

CI 分片

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

屏幕截图 / 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