Agent skill

Playwright CLI Automation

CLI-first browser automation using Playwright CLI for navigation, form filling, snapshots, screenshots, data extraction, and UI-flow debugging from the terminal.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/other/playwright-cli-automation

SKILL.md

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 "[email protected]"
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.

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results