Akshay Parkhi's Weblog

playwright-cli: How to Give Your AI Coding Assistant a Real Browser

9th March 2026

If you use Claude Code (or any AI coding assistant), there’s a tool that makes browser automation trivially easy: playwright-cli. It’s a command-line wrapper around Microsoft’s Playwright that lets you control a real browser from your terminal — navigate pages, click buttons, fill forms, take screenshots, and scrape content. Here’s how to set it up and why it’s genuinely useful.

What Is playwright-cli?

playwright-cli is a terminal tool that gives you direct browser control without writing test scripts. Instead of creating .spec.ts files and running a test framework, you issue commands like:

playwright-cli open https://example.com
playwright-cli click "Sign In"
playwright-cli fill "#email" "user@example.com"
playwright-cli snapshot
playwright-cli screenshot output.png

It launches a real Chrome (or Firefox/WebKit) instance and lets you interact with it programmatically. The browser persists between commands, so you can build up multi-step workflows interactively.

Why This Matters for AI Assistants

The real power comes when you pair playwright-cli with an AI coding assistant like Claude Code. Instead of you manually browsing, you can say:

• “Go to my deployed app and check if the homepage loads correctly”
• “Fill out the signup form and verify the confirmation page”
• “Search Google Flights for IAD to SFO on March 26”
• “Take a screenshot of every page in my app”

The AI translates your intent into playwright-cli commands, executes them, reads the page content, and reports back. It turns your AI assistant into something that can see and interact with the web.

Installation

Three steps:

# 1. Install globally via npm
npm install -g @playwright/cli@latest

# 2. Initialize workspace (detects your browser)
playwright-cli install

# 3. Verify installation
playwright-cli --version

The install command scans for available browsers and sets Chrome as the default. You should see output like:

✔ Workspace initialized at /your/project/directory
✔ Found chrome, will use it as the default browser.

Setting Up as a Claude Code Skill

To make Claude Code automatically use playwright-cli when you ask about browser tasks, create a skill file:

# Create the skills directory
mkdir -p ~/.claude/skills

# Create the skill definition
cat <<'EOF' > ~/.claude/skills/playwright-cli.md
# playwright-cli

Use when the user wants to automate browser interactions,
test web pages, take screenshots, fill forms, click elements,
navigate websites, or perform any browser automation task.

## Commands
- `playwright-cli open <url>` - Open a URL in the browser
- `playwright-cli goto <url>` - Navigate to a URL
- `playwright-cli click <selector>` - Click an element
- `playwright-cli fill <selector> <value>` - Fill an input field
- `playwright-cli snapshot` - Get page content as text
- `playwright-cli screenshot <path>` - Take a screenshot
- `playwright-cli close` - Close the browser
EOF

Once this file exists, Claude Code will recognize browser-related requests and automatically invoke playwright-cli commands.

Core Commands Reference

Command	What It Does	Example
open <url>	Launch browser and navigate	playwright-cli open https://example.com
goto <url>	Navigate existing browser	playwright-cli goto /about
click <selector>	Click an element	playwright-cli click "Sign In"
fill <sel> <val>	Type into an input	playwright-cli fill "#email" "me@x.com"
snapshot	Get page text content	playwright-cli snapshot
screenshot <path>	Save screenshot to file	playwright-cli screenshot page.png
close	Close the browser	playwright-cli close
cookie-list	List all cookies	playwright-cli cookie-list
localstorage-list	List localStorage items	playwright-cli localstorage-list

Real-World Usage: Flight Search

Here’s a practical example. I asked Claude Code to find flights from IAD to SFO using playwright-cli. Here’s what happened under the hood:

# Step 1: Open Google Flights with search parameters
playwright-cli open "https://www.google.com/travel/flights?q=flights+from+IAD+to+SFO+on+2026-03-26+return+2026-03-29"

# Step 2: Wait for results to load, then snapshot the page
playwright-cli snapshot

# Step 3: Read the structured content from the snapshot file
# (Claude Code reads the snapshot and extracts flight data)

# Step 4: Close the browser
playwright-cli close

The AI parsed the snapshot, extracted departure times, airlines, prices, and layover details, and presented them in a clean table. No manual browsing required.

Real-World Usage: Blog Content Validation

Another example — validating all posts on a blog:

# Open the blog homepage
playwright-cli open https://www.akshayparkhi.net

# Snapshot to get all post links
playwright-cli snapshot

# Navigate to each post
playwright-cli goto https://www.akshayparkhi.net/2026/Mar/9/context-engineering/

# Snapshot each post's content for validation
playwright-cli snapshot

# Repeat for all posts, then close
playwright-cli close

Claude Code went through 10 blog posts, read the full content of each, and produced an accuracy rating with specific fact-checks for every claim. That kind of systematic review would take a human an hour — it took under two minutes.

What playwright-cli Can Do

• End-to-end testing — Walk through signup flows, checkout processes, form submissions
• Content scraping — Extract structured data from web pages without writing scrapers
• Visual regression — Take screenshots before and after changes to spot differences
• Monitoring — Check if your deployed site loads correctly, returns expected content
• Form automation — Fill out repetitive forms across multiple sites
• Cookie/storage inspection — Debug authentication issues by examining cookies and localStorage
• Cross-site workflows — Chain actions across multiple sites (search Google, open result, extract data)

Limitations

Some honest limitations to be aware of:

• Anti-bot detection — Sites like CheapOAir block automated browsers. Google Flights works, but many commercial sites don’t.
• JavaScript-heavy SPAs — Some single-page apps need explicit waits for content to render before snapshots capture meaningful data.
• Authentication — Sessions don’t persist across open/close cycles by default. You’ll need to manage cookies manually for authenticated workflows.
• No headless by default — It opens a visible browser window, which means you need a display (or configure headless mode).

The Architecture

How it works under the hood:

Your Terminal
  → playwright-cli (CLI wrapper)
    → Playwright Node.js library
      → Chrome DevTools Protocol (CDP)
        → Real Chrome Browser Instance

Each command:
1. Sends a CDP command to the browser
2. Browser executes the action
3. Returns result to your terminal
4. Browser stays open for next command

The browser process persists between commands (tracked by PID), so state (cookies, localStorage, navigation history) carries across your session until you explicitly close.

Tips for Best Results

• Use snapshot liberally — It’s how the AI “sees” the page. Take a snapshot after every navigation or interaction.
• Use CSS selectors for precision — playwright-cli click "#submit-btn" is more reliable than clicking by text.
• Chain with AI naturally — Just describe what you want in plain English. The AI handles the command translation.
• Close browsers when done — Each open starts a Chrome process. Close them to avoid resource leaks.

Summary

playwright-cli bridges the gap between your terminal and the browser. For AI coding assistants, it’s the difference between “I can only work with code” and “I can see and interact with your running application.” Setup takes two minutes, and it immediately unlocks browser automation, testing, scraping, and monitoring — all through natural language commands.