Get the FREE Ultimate OpenClaw Setup Guide →

playwright-cli

npx machina-cli add skill baslie/claude-best-practices/playwright-cli --openclaw
Files (1)
SKILL.md
6.0 KB

Browser Automation with playwright-cli

Quick start

playwright-cli open https://playwright.dev
playwright-cli click e15
playwright-cli type "page.click"
playwright-cli press Enter

Core workflow

  1. Navigate: playwright-cli open https://example.com
  2. Interact using refs from the snapshot
  3. Re-snapshot after significant changes

Commands

Core

playwright-cli open https://example.com/
playwright-cli close
playwright-cli type "search query"
playwright-cli click e3
playwright-cli dblclick e7
playwright-cli fill e5 "user@example.com"
playwright-cli drag e2 e8
playwright-cli hover e4
playwright-cli select e9 "option-value"
playwright-cli upload ./document.pdf
playwright-cli check e12
playwright-cli uncheck e12
playwright-cli snapshot
playwright-cli snapshot --filename=after-click.yaml
playwright-cli eval "document.title"
playwright-cli eval "el => el.textContent" e5
playwright-cli dialog-accept
playwright-cli dialog-accept "confirmation text"
playwright-cli dialog-dismiss
playwright-cli resize 1920 1080

Navigation

playwright-cli go-back
playwright-cli go-forward
playwright-cli reload

Keyboard

playwright-cli press Enter
playwright-cli press ArrowDown
playwright-cli keydown Shift
playwright-cli keyup Shift

Mouse

playwright-cli mousemove 150 300
playwright-cli mousedown
playwright-cli mousedown right
playwright-cli mouseup
playwright-cli mouseup right
playwright-cli mousewheel 0 100

Save as

playwright-cli screenshot
playwright-cli screenshot e5
playwright-cli screenshot --filename=page.png
playwright-cli pdf --filename=page.pdf

Tabs

playwright-cli tab-list
playwright-cli tab-new
playwright-cli tab-new https://example.com/page
playwright-cli tab-close
playwright-cli tab-close 2
playwright-cli tab-select 0

Storage

playwright-cli state-save
playwright-cli state-save auth.json
playwright-cli state-load auth.json

# Cookies
playwright-cli cookie-list
playwright-cli cookie-list --domain=example.com
playwright-cli cookie-get session_id
playwright-cli cookie-set session_id abc123
playwright-cli cookie-set session_id abc123 --domain=example.com --httpOnly --secure
playwright-cli cookie-delete session_id
playwright-cli cookie-clear

# LocalStorage
playwright-cli localstorage-list
playwright-cli localstorage-get theme
playwright-cli localstorage-set theme dark
playwright-cli localstorage-delete theme
playwright-cli localstorage-clear

# SessionStorage
playwright-cli sessionstorage-list
playwright-cli sessionstorage-get step
playwright-cli sessionstorage-set step 3
playwright-cli sessionstorage-delete step
playwright-cli sessionstorage-clear

Network

playwright-cli route "**/*.jpg" --status=404
playwright-cli route "https://api.example.com/**" --body='{"mock": true}'
playwright-cli route-list
playwright-cli unroute "**/*.jpg"
playwright-cli unroute

DevTools

playwright-cli console
playwright-cli console warning
playwright-cli network
playwright-cli run-code "async page => await page.context().grantPermissions(['geolocation'])"
playwright-cli tracing-start
playwright-cli tracing-stop
playwright-cli video-start
playwright-cli video-stop video.webm

Install

playwright-cli install-browser
playwright-cli install-skills

Configuration

# Use specific browser when creating session
playwright-cli open --browser=chrome
playwright-cli open --browser=firefox
playwright-cli open --browser=webkit
playwright-cli open --browser=msedge
# Connect to browser via extension
playwright-cli open --extension

# Use persistent profile (by default profile is in-memory)
playwright-cli open --persistent
# Use persistent profile with custom directory
playwright-cli open --profile=/path/to/profile

# Start with config file
playwright-cli open --config=my-config.json

# Close the browser
playwright-cli close
# Delete user data for the default session
playwright-cli delete-data

Browser Sessions

playwright-cli -s=mysession open example.com
playwright-cli -s=mysession click e6
playwright-cli -s=mysession close  # stop a named browser
playwright-cli -s=mysession delete-data  # delete user data for named browser

playwright-cli list
# Close all browsers
playwright-cli close-all
# Forcefully kill all browser processes
playwright-cli kill-all

Example: Form submission

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

Example: Multi-tab workflow

playwright-cli open https://example.com
playwright-cli tab-new https://example.com/other
playwright-cli tab-list
playwright-cli tab-select 0
playwright-cli snapshot

Example: Debugging with DevTools

playwright-cli open https://example.com
playwright-cli click e4
playwright-cli fill e7 "test"
playwright-cli console
playwright-cli network
playwright-cli open https://example.com
playwright-cli tracing-start
playwright-cli click e4
playwright-cli fill e7 "test"
playwright-cli tracing-stop

Specific tasks

Source

git clone https://github.com/baslie/claude-best-practices/blob/main/skills/playwright-cli/SKILL.mdView on GitHub

Overview

playwright-cli automates browser interactions to drive web testing, form filling, screenshots, and data extraction. It lets you navigate pages, interact with elements, and capture data as part of end-to-end tests. With a comprehensive command set for navigation, input, storage, network, and DevTools, you can script complex user flows from the command line.

How This Skill Works

You drive a headless or headed browser session using commands like open, click, type, and snapshot. The core workflow is navigate, interact using refs from the snapshot, and re-snapshot after changes. It also provides storage, network, and DevTools commands to test behavior across scenarios.

When to Use It

  • End-to-end web testing across pages and user flows
  • Automating form filling and submission with validation
  • Capturing screenshots or PDFs for visual checks
  • Managing and testing cookies, LocalStorage, and SessionStorage
  • Intercepting network requests and inspecting DevTools output

Quick Start

  1. Step 1: playwright-cli open https://playwright.dev
  2. Step 2: playwright-cli click e15 && playwright-cli type page.click && playwright-cli press Enter
  3. Step 3: playwright-cli snapshot --filename=initial.yaml

Best Practices

  • Prefer stable, selector-based refs (e3, e5) over brittle text matches
  • Break actions into small steps and verify results after each step
  • Use snapshot saves (filename) to track UI state over time
  • Test across browsers with explicit --browser flags for coverage
  • Clean up sessions and reset state between tests using state-save/load and cookies

Example Use Cases

  • Automated login and post-login verification across a site
  • Scrape product names and prices from listing pages
  • Capture page screenshots for visual regression testing
  • Submit signup and contact forms and confirm success messages
  • Mock API routes to test UI behavior without backend changes

Frequently Asked Questions

Add this skill to your agents
Sponsor this space

Reach thousands of developers