--- name: "Playwright CLI Automation" description: "CLI-first browser automation using Playwright CLI for navigation, form filling, snapshots, screenshots, data extraction, and UI-flow debugging from the terminal." version: 1.0.0 author: openai license: MIT tags: [playwright, cli, browser, automation, snapshot, screenshot] testingTypes: [e2e, integration] frameworks: [playwright] languages: [typescript, javascript] domains: [web] agents: [claude-code, cursor, github-copilot, windsurf, codex, aider, continue, cline, zed, bolt] --- # Playwright CLI Automation Drive a real browser from the terminal using `playwright-cli`. Prefer the bundled wrapper script so the CLI works even when it is not globally installed. Treat this skill as CLI-first automation. Do not pivot to `@playwright/test` unless the user explicitly asks for test files. ## Prerequisite check (required) Before proposing commands, check whether `npx` is available (the wrapper depends on it): ```bash command -v npx >/dev/null 2>&1 ``` If it is not available, pause and ask the user to install Node.js/npm (which provides `npx`). Provide these steps verbatim: ```bash # Verify Node/npm are installed node --version npm --version # If missing, install Node.js/npm, then: npm install -g @playwright/cli@latest playwright-cli --help ``` Once `npx` is present, proceed with the wrapper script. A global install of `playwright-cli` is optional. ## Core workflow 1. Open the page. 2. Snapshot to get stable element refs. 3. Interact using refs from the latest snapshot. 4. Re-snapshot after navigation or significant DOM changes. 5. Capture artifacts (screenshot, pdf, traces) when useful. Minimal loop: ```bash playwright-cli open https://example.com playwright-cli snapshot playwright-cli click e3 playwright-cli snapshot ``` ## When to snapshot again Snapshot again after: - navigation - clicking elements that change the UI substantially - opening/closing modals or menus - tab switches Refs can go stale. When a command fails due to a missing ref, snapshot again. ## Recommended patterns ### Form fill and submit ```bash playwright-cli open https://example.com/form playwright-cli snapshot playwright-cli fill e1 "user@example.com" playwright-cli fill e2 "password123" playwright-cli click e3 playwright-cli snapshot ``` ### Debug a UI flow with traces ```bash playwright-cli open https://example.com --headed playwright-cli tracing-start # ...interactions... playwright-cli tracing-stop ``` ### Multi-tab work ```bash playwright-cli tab-new https://example.com playwright-cli tab-list playwright-cli tab-select 0 playwright-cli snapshot ``` ## Guardrails - Always snapshot before referencing element ids like `e12`. - Re-snapshot when refs seem stale. - Prefer explicit commands over `eval` and `run-code` unless needed. - Use `--headed` when a visual check will help. - Default to CLI commands and workflows, not Playwright test specs.