# Playwright CLI

> Automate browser interactions for web testing, form filling, screenshots, and data extraction using playwright-cli. Use when the user needs to navigate websites, interact with web pages, fill forms, take screenshots, test web applications, scrape data, or extract information from web pages. Triggers on "ブラウザ操作", "Webテスト", "スクリーンショット", "フォーム入力", "スクレイピング", "browser automation", "web testing", "playwright".

- Skill: `nogataka/playwright-cli` (Agent Skill, multi-file: 8 files)
- Install (CLI): `npx skillmds@latest add nogataka/playwright-cli`
- Raw SKILL.md: https://api.skillmd.com/api/skills/nogataka/playwright-cli/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: nogataka (https://skillmd.com/u/nogataka)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/nogataka/playwright-cli

---


# Browser Automation with playwright-cli

## Prerequisites

Before running any `playwright-cli` command, verify installation:

```bash
which playwright-cli || npm install -g @playwright/cli@latest
```

If the global install fails, fall back to `npx playwright-cli` for all commands.

## Quick Start

```bash
playwright-cli open https://example.com
playwright-cli snapshot                    # see page elements with refs
playwright-cli click e15                   # interact using refs
playwright-cli fill e5 "user@example.com"  # fill form fields
playwright-cli screenshot                  # capture screenshot
playwright-cli close                       # close browser
```

## Core Commands

```bash
# Navigation
playwright-cli open [url]
playwright-cli goto <url>
playwright-cli go-back / go-forward / reload

# Interaction (use ref IDs from snapshot)
playwright-cli click <ref>
playwright-cli dblclick <ref>
playwright-cli fill <ref> "<value>"
playwright-cli type "<text>"
playwright-cli select <ref> "<option-value>"
playwright-cli check / uncheck <ref>
playwright-cli hover <ref>
playwright-cli drag <ref-from> <ref-to>
playwright-cli upload <file-path>

# Keyboard & Mouse
playwright-cli press Enter|ArrowDown|Tab|...
playwright-cli keydown / keyup Shift
playwright-cli mousemove <x> <y>
playwright-cli mousedown / mouseup [right]
playwright-cli mousewheel <dx> <dy>

# Page inspection
playwright-cli snapshot [--filename=name.yaml]
playwright-cli screenshot [ref] [--filename=page.png]
playwright-cli pdf [--filename=page.pdf]
playwright-cli eval "<js-expression>" [ref]

# Dialog handling
playwright-cli dialog-accept ["text"]
playwright-cli dialog-dismiss

# Viewport
playwright-cli resize <width> <height>

# Tabs
playwright-cli tab-list / tab-new [url] / tab-select <index> / tab-close [index]

# Sessions
playwright-cli -s=<name> <command>   # isolated browser session
playwright-cli list                  # list sessions
playwright-cli close / close-all / kill-all
```

## Snapshots

After each command, playwright-cli outputs a snapshot with element refs (e1, e2, etc.). Use these refs to interact with elements.

## Named Sessions

Use `-s=<name>` for isolated browser sessions with independent cookies/storage:

```bash
playwright-cli -s=auth open https://app.example.com/login
playwright-cli -s=public open https://example.com
```

## Open Parameters

```bash
playwright-cli open --browser=chrome|firefox|webkit|msedge
playwright-cli open --persistent            # persist profile to disk
playwright-cli open --profile=/path/to/dir  # custom profile directory
playwright-cli open --config=config.json
playwright-cli open --extension             # connect via browser extension
```

## Storage Commands

```bash
# State save/load
playwright-cli state-save [filename.json]
playwright-cli state-load <filename.json>

# Cookies
playwright-cli cookie-list [--domain=example.com]
playwright-cli cookie-get / cookie-set / cookie-delete <name>
playwright-cli cookie-clear

# LocalStorage
playwright-cli localstorage-list / localstorage-get / localstorage-set / localstorage-delete <key>
playwright-cli localstorage-clear

# SessionStorage
playwright-cli sessionstorage-list / sessionstorage-get / sessionstorage-set / sessionstorage-delete <key>
playwright-cli sessionstorage-clear
```

## DevTools

```bash
playwright-cli console [warning]
playwright-cli network
playwright-cli run-code "async page => { /* Playwright code */ }"
playwright-cli tracing-start / tracing-stop
playwright-cli video-start / video-stop <output.webm>
```

## Network Mocking

```bash
playwright-cli route "**/*.jpg" --status=404
playwright-cli route "**/api/users" --body='[{"id":1}]' --content-type=application/json
playwright-cli route-list
playwright-cli unroute ["pattern"]
```

## Specific Tasks (Reference Files)

Read the relevant reference file for detailed guides:

- **Request mocking** — `references/request-mocking.md`
- **Running custom Playwright code** — `references/running-code.md`
- **Browser session management** — `references/session-management.md`
- **Storage state (cookies, localStorage)** — `references/storage-state.md`
- **Test generation** — `references/test-generation.md`
- **Tracing** — `references/tracing.md`
- **Video recording** — `references/video-recording.md`

## Common Workflow: Form Submission

```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
playwright-cli close
```

## Common Workflow: Auth State Reuse

```bash
# Login and save
playwright-cli open https://app.example.com/login
playwright-cli fill e1 "user@example.com"
playwright-cli fill e2 "secret"
playwright-cli click e3
playwright-cli state-save auth.json
playwright-cli close

# Restore later
playwright-cli state-load auth.json
playwright-cli open https://app.example.com/dashboard
```

