### Example prompts

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/installation.mdx

Various example prompts for interacting with the AI assistant.

```txt
Go to https://example.com and take a screenshot.
```

```txt
Open https://demo.playwright.dev/todomvc, add three todos,
check off the first one, and take a screenshot.
```

```txt
Navigate to https://news.ycombinator.com and list the top 5 stories.
```

```txt
Save the current browser state to auth.json so we can skip login next time.
```

--------------------------------

### Environment setup

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/installation.mdx

Command to configure a coding agent to use a specific Playwright CLI session.

```bash
PLAYWRIGHT_CLI_SESSION=todo-app claude .
```

--------------------------------

### browser_mouse_drag_xy example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/keyboard-mouse.mdx

Example demonstrating how to drag the mouse from a start to an end position.

```txt
→ browser_mouse_drag_xy { startX: 100, startY: 200, endX: 400, endY: 200 }
```

--------------------------------

### Setup the repo

Source: https://github.com/microsoft/playwright.dev/blob/main/README.md

Install project dependencies.

```sh
npm install
```

--------------------------------

### Interactive Demo Prompt

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/quick-start.mdx

An example prompt to ask a coding agent to test a website using Playwright skills.

```text
Use playwright skills to test https://demo.playwright.dev/todomvc/.
Take screenshots for all successful and failing scenarios.
```

--------------------------------

### Basic Trace Recording Example

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/tracing.mdx

Demonstrates how to start tracing, perform navigation and interactions, and then stop tracing to save the trace file.

```bash
playwright-cli tracing-start
playwright-cli goto https://example.com
playwright-cli click e5
playwright-cli fill e3 "test"
playwright-cli tracing-stop
# Trace saved to .playwright-cli/trace.zip
```

--------------------------------

### Targeting elements example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

Example showing how to get a ref from `browser_snapshot` and use it with `browser_click`.

```txt
→ browser_snapshot
  - button "Submit" [ref=e12]       ← ref is "e12"
  - link "Learn more" [ref=e15]     ← ref is "e15"

→ browser_click { ref: "e12" }      // clicks the Submit button
```

--------------------------------

### Installing browsers

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/installation.mdx

Commands to install default or specific browsers, with or without system dependencies.

```bash
playwright-cli install-browser               # install default (chromium)
playwright-cli install-browser firefox       # install specific browser
playwright-cli install-browser --with-deps   # install with system dependencies
```

--------------------------------

### Basic recording

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/video-recording.mdx

Example of starting, performing actions, and stopping a video recording.

```bash
playwright-cli video-start demo.webm
playwright-cli goto https://example.com
playwright-cli click e5
playwright-cli fill e3 "test"
playwright-cli video-stop
# Video saved to: .playwright-cli/demo.webm
```

--------------------------------

### browser_resize examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

Examples of resizing the browser window to different dimensions.

```txt
→ browser_resize { width: 375, height: 812 }    // mobile viewport
→ browser_resize { width: 1920, height: 1080 }  // desktop
```

--------------------------------

### browser_press_key examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/keyboard-mouse.mdx

Examples demonstrating how to use `browser_press_key` with various keys and key combinations.

```txt
→ browser_press_key { key: "Enter" }         // submit form
→ browser_press_key { key: "Tab" }           // move to next field
→ browser_press_key { key: "Escape" }        // close modal
→ browser_press_key { key: "Control+a" }     // select all text
→ browser_press_key { key: "ArrowDown" }     // navigate dropdown
```

--------------------------------

### Init scripts

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/configuration/options.mdx

Example JavaScript initialization script.

```js
// setup.js
window.isPlaywrightMCP = true;
```

--------------------------------

### Workflow example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/navigation.mdx

A workflow demonstrating multiple navigation and interaction tools.

```txt
You: Open the TodoMVC app, add an item, then go back to see
     if the item persists.

→ browser_navigate { url: "https://demo.playwright.dev/todomvc" }
→ browser_type { ref: "e5", text: "Buy groceries", submit: true }
→ browser_navigate { url: "https://example.com" }
→ browser_navigate_back
→ browser_snapshot

  - heading "todos" [level=1]
  - textbox "What needs to be done?" [ref=e5]
  - listitem:
    - checkbox "Toggle Todo" [ref=e10]
    - text: "Buy groceries"
```

--------------------------------

### browser_click examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

Examples of using `browser_click` with different element references.

```txt
→ browser_click { ref: "e12" }       // clicks the Submit button
→ browser_click { ref: "e15" }       // clicks the Learn more link
```

--------------------------------

### Assistant calls and snapshots

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/installation.mdx

Output showing browser navigation, snapshots, and interaction steps.

```txt
→ browser_navigate { url: "https://demo.playwright.dev/todomvc" }
→ browser_snapshot

  - heading "todos" [level=1]
  - textbox "What needs to be done?" [ref=e5]

→ browser_type { ref: "e5", text: "Buy groceries", submit: true }
→ browser_snapshot

  - heading "todos" [level=1]
  - textbox "What needs to be done?" [ref=e5]
  - listitem:
    - checkbox "Toggle Todo" [ref=e10]
    - text: "Buy groceries"
  - contentinfo:
    - text: "1 item left"
```

--------------------------------

### Video size

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/video-recording.mdx

Example of specifying video dimensions when starting a recording.

```bash
playwright-cli video-start --size=800x600
```

--------------------------------

### browser_navigate_forward example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/navigation.mdx

Example of going forward to the next page using `browser_navigate_forward`.

```txt
You: Go forward.

→ browser_navigate_forward
```

--------------------------------

### browser_mouse_click_xy examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/keyboard-mouse.mdx

Examples showing how to click at specific coordinates, including a double-click.

```txt
→ browser_mouse_click_xy { x: 150, y: 300 }
→ browser_mouse_click_xy { x: 150, y: 300, clickCount: 2 }  // double-click
```

--------------------------------

### browser_select_option example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

Example of selecting an option in a combobox after taking a snapshot.

```txt
→ browser_snapshot
  - combobox "Country" [ref=e7]

→ browser_select_option { ref: "e7", values: ["United States"] }
```

--------------------------------

### Installing skills

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/skills.mdx

Command to install skill files locally for coding agents.

```bash
playwright-cli install --skills
```

--------------------------------

### browser_verify_value Example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/assertions.mdx

Example demonstrating the usage and output of the `browser_verify_value` command.

```txt
→ browser_verify_value { ref: "e3", value: "alice@example.com" }
  ✓ Value matches: "alice@example.com"
```

--------------------------------

### browser_verify_list_visible Example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/assertions.mdx

Example demonstrating the usage and output of the `browser_verify_list_visible` command.

```txt
→ browser_verify_list_visible {
    label: "Todo list",
    items: ["Buy groceries", "Walk the dog", "Read a book"]
  }
  ✓ List "Todo list" visible with 3 matching items
```

--------------------------------

### browser_navigate example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/navigation.mdx

Example of navigating to a specific URL using `browser_navigate`.

```txt
You: Go to https://demo.playwright.dev/todomvc

→ browser_navigate { url: "https://demo.playwright.dev/todomvc" }
→ Returns snapshot of the loaded page:

  - heading "todos" [level=1]
  - textbox "What needs to be done?" [ref=e5]
```

--------------------------------

### browser_type examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/forms.mdx

Examples demonstrating how to type text into editable elements, including submitting with Enter and typing slowly to trigger key handlers.

```txt
→ browser_type { ref: "e5", text: "Buy groceries" }
→ browser_type { ref: "e5", text: "Buy groceries", submit: true }  // types + Enter
→ browser_type { ref: "e8", text: "search query", slowly: true }   // triggers autocomplete
```

--------------------------------

### browser_navigate_back example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/navigation.mdx

Example of going back to the previous page using `browser_navigate_back`.

```txt
You: Go back to the previous page.

→ browser_navigate_back
→ Returns snapshot of the previous page
```

--------------------------------

### browser_drag example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

Example of dragging an element from `startRef` to `endRef`.

```txt
→ browser_drag { startRef: "e5", endRef: "e10" }
```

--------------------------------

### browser_fill_form example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/forms.mdx

Example demonstrating how to fill multiple form fields simultaneously, including textboxes, checkboxes, and comboboxes, after taking a snapshot of the form elements.

```txt
→ browser_snapshot
  - textbox "First name" [ref=e3]
  - textbox "Last name" [ref=e5]
  - textbox "Email" [ref=e7]
  - checkbox "Accept terms" [ref=e9]
  - combobox "Country" [ref=e11]
  - radio "Monthly plan" [ref=e13]
  - radio "Annual plan" [ref=e15]

→ browser_fill_form {
    fields: [
      { ref: "e3", value: "Alice" },
      { ref: "e5", value: "Smith" },
      { ref: "e7", value: "alice@example.com" },
      { ref: "e9", value: true },
      { ref: "e11", value: "United States" },
      { ref: "e15", value: true }
    ]
  }
```

--------------------------------

### Init scripts

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/configuration.mdx

Example JSON configuration for specifying initialization scripts for browser and page.

```json
{
  "browser": {
    "initScript": ["./setup.js"],
    "initPage": ["./setup-page.ts"]
  }
}
```

--------------------------------

### Global installation

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/installation.mdx

Command to install Playwright CLI globally and verify the installation.

```bash
npm install -g @playwright/cli@latest
playwright-cli --help
```

--------------------------------

### browser_verify_element_visible Examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/assertions.mdx

Examples demonstrating the usage and output of the `browser_verify_element_visible` command.

```txt
→ browser_verify_element_visible { role: "heading", name: "Dashboard" }
  ✓ Element visible: heading "Dashboard"

→ browser_verify_element_visible { role: "button", name: "Submit" }
  ✗ Element not visible: button "Submit"
```

--------------------------------

### Chapter options

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/video-recording.mdx

Example of using options with the `video-chapter` command.

```bash
playwright-cli video-chapter "Title" \
  --description="Detailed description" \
  --duration=2000  # show chapter card for 2 seconds
```

--------------------------------

### browser_reload example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/navigation.mdx

Example of reloading the current page using `browser_reload`.

```txt
You: Reload the page.

→ browser_reload
→ Returns fresh snapshot after reload
```

--------------------------------

### browser_verify_text_visible Example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/assertions.mdx

Example demonstrating the usage and output of the `browser_verify_text_visible` command.

```txt
→ browser_verify_text_visible { text: "3 items left" }
  ✓ Text visible: "3 items left"
```

--------------------------------

### localStorage management commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/storage.mdx

Examples of using `playwright-cli` commands to list, get, and set localStorage values.

```bash
$ playwright-cli localstorage-list
# Key                Value
# user_preferences   {"theme":"dark","lang":"en"}
# onboarding_done    true

$ playwright-cli localstorage-get user_preferences
# {"theme":"dark","lang":"en"}

$ playwright-cli localstorage-set onboarding_done "false"
$ playwright-cli reload
# Onboarding wizard appears
```

--------------------------------

### Page-level JavaScript evaluation examples

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/console-eval.mdx

Examples of evaluating JavaScript expressions that interact with the entire page, such as getting the document title or window dimensions.

```bash
$ playwright-cli eval "() => document.title"
# React - TodoMVC

$ playwright-cli eval "() => window.innerWidth + 'x' + window.innerHeight"
# 1280x720
```

--------------------------------

### Manual Walkthrough Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/quick-start.mdx

A sequence of commands to manually operate the Playwright CLI for testing a todomvc application.

```bash
playwright-cli open https://demo.playwright.dev/todomvc/ --headed
playwright-cli type "Buy groceries"
playwright-cli press Enter
playwright-cli type "Water flowers"
playwright-cli press Enter
playwright-cli check e21
playwright-cli screenshot
```

--------------------------------

### Local installation (npx)

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/installation.mdx

Command to run Playwright CLI locally using npx.

```bash
npx playwright-cli --help
```

--------------------------------

### browser_hover example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

Example of using `browser_hover` to reveal a dropdown menu and then taking a snapshot.

```txt
→ browser_hover { ref: "e3" }
→ browser_snapshot
  // Snapshot now shows the revealed dropdown menu
  - menuitem "Profile" [ref=e20]
  - menuitem "Settings" [ref=e21]
  - menuitem "Logout" [ref=e22]
```

--------------------------------

### Init page

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/configuration/options.mdx

Example TypeScript code to run on the page object at startup.

```ts
// setup-page.ts
export default async ({ page }) => {
  await page.context().grantPermissions(['geolocation']);
  await page.context().setGeolocation({ latitude: 37.7749, longitude: -122.4194 });
};
```

--------------------------------

### browser_generate_locator Examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/assertions.mdx

Examples demonstrating the usage and output of the `browser_generate_locator` command for generating Playwright locators.

```txt
→ browser_generate_locator { ref: "e15" }
  page.getByRole('button', { name: 'Submit' })

→ browser_generate_locator { ref: "e3" }
  page.getByLabel('Email')
```

--------------------------------

### Inspect Network Requests Example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/network-mocking.mdx

Example of listing network requests, filtered by 'api'.

```txt
→ browser_network_requests { filter: "api" }

  GET  200 https://api.example.com/me              8ms   application/json
  POST 201 https://api.example.com/users/create     45ms  application/json
  GET  200 https://api.example.com/settings         12ms  application/json
```

--------------------------------

### browser_close example

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/navigation.mdx

Example of closing the current page and browser using `browser_close`.

```txt
→ browser_close
```

--------------------------------

### browser_check / browser_uncheck examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/forms.mdx

Examples demonstrating how to check and uncheck a checkbox using their element references.

```txt
→ browser_check { ref: "e9" }     // check the "Accept terms" checkbox
→ browser_uncheck { ref: "e9" }   // uncheck it
```

--------------------------------

### browser_start_tracing command output

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/tracing.mdx

Example output when the `browser_start_tracing` command is executed, indicating that tracing has begun.

```txt
→ browser_start_tracing
  Tracing started
```

--------------------------------

### Skills-less operation example

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/skills.mdx

Example of an agent prompt for playwright-cli without pre-installed skills.

```txt
Test the "add todo" flow on https://demo.playwright.dev/todomvc using playwright-cli.
Check playwright-cli --help for available commands.
```

--------------------------------

### Local development

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/configuration.mdx

Example JSON configuration for local development, setting headless mode to false.

```json
{
  "browser": {
    "launchOptions": { "headless": false }
  }
}
```

--------------------------------

### List active routes

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/network-mocking.mdx

Example of listing currently active network routes.

```txt
→ browser_route_list

  Pattern              Status  Content-Type
  **/api/users         200     application/json
  **/*.jpg             404     -
  **/analytics/**      204     -
```

--------------------------------

### Device emulation

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/configuration.mdx

Example JSON configuration for device emulation, setting viewport and user agent.

```json
{
  "browser": {
    "contextOptions": {
      "viewport": { "width": 375, "height": 812 },
      "userAgent": "Mozilla/5.0 (iPhone; CPU iPhone OS 16_0 like Mac OS X)..."
    }
  }
}
```

--------------------------------

### Creating tabs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/tabs.mdx

Examples of opening new tabs, either blank or navigating to a URL immediately.

```bash
playwright-cli tab-new                  # blank tab
playwright-cli tab-new https://example.com  # navigate immediately
```

--------------------------------

### Multiple files

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/file-upload.mdx

Example demonstrating how to upload multiple files using the browser_file_upload command.

```txt
→ browser_file_upload {
    paths: [
      "/home/user/photos/image1.jpg",
      "/home/user/photos/image2.jpg"
    ]
  }
```

--------------------------------

### Switching tabs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/tabs.mdx

Examples of switching between tabs using their index.

```bash
playwright-cli tab-select 1             # switch to second tab
playwright-cli tab-select 0             # switch back to first
```

--------------------------------

### Using Selectors

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/snapshots.mdx

Examples of `playwright-cli` commands interacting with elements using CSS selectors and Playwright locators.

```bash
# CSS selectors
playwright-cli click "#main > button.submit"
playwright-cli click "[data-testid='submit']"

# Playwright locators
playwright-cli click "getByRole('button', { name: 'Submit' })"
playwright-cli click "getByTestId('submit-button')"
playwright-cli click "getByText('Login')"
```

--------------------------------

### Wait for text to appear

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/waiting.mdx

Example of waiting for specific text to appear on the page.

```txt
→ browser_wait_for { text: "Upload complete" }
  ✓ Text appeared: "Upload complete"
```

--------------------------------

### Element-level JavaScript evaluation examples

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/console-eval.mdx

Examples of evaluating JavaScript expressions on specific elements identified by a reference.

```bash
$ playwright-cli eval "(el) => el.getAttribute('data-id')" e15
# item-42

$ playwright-cli eval "(el) => getComputedStyle(el).color" e5
# rgb(255, 0, 0)
```

--------------------------------

### browser_file_upload

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/file-upload.mdx

Example demonstrating how to handle a single file upload using the browser_file_upload command.

```txt
→ browser_click { ref: "e8" }  // clicks "Choose file" button
  ⚠ File chooser opened

→ browser_file_upload { paths: ["/home/user/documents/report.pdf"] }
→ browser_snapshot
  - text: "report.pdf selected"
  - button "Upload" [ref=e12]

→ browser_click { ref: "e12" }
```

--------------------------------

### CI environment

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/configuration.mdx

Example JSON configuration for a CI environment, setting headless mode to true and a specific viewport.

```json
{
  "browser": {
    "launchOptions": { "headless": true },
    "contextOptions": { "viewport": { "width": 1280, "height": 720 } }
  },
  "outputDir": "./test-output"
}
```

--------------------------------

### Alert dialogs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/dialogs.mdx

Example of handling an alert dialog by accepting it.

```bash
$ playwright-cli click e5
# ⚠ Dialog appeared: [alert] "Item has been deleted."

$ playwright-cli dialog-accept
```

--------------------------------

### List Browser Cookies

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/storage.mdx

Example of listing all cookies for the current browser context, showing their properties.

```txt
→ browser_cookie_list

  Name          Value       Domain            HttpOnly  Secure  Expires
  session_id    abc123      .example.com      true      true    2024-12-31
  theme         dark        .example.com      false     false   Session
  _ga           GA1.2...    .example.com      false     false   2026-01-01
```

--------------------------------

### Refs from snapshots (recommended)

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/interaction.mdx

Examples of using element references obtained from snapshots to interact with elements.

```bash
playwright-cli snapshot                 # get element refs
playwright-cli click e15                # click by ref
playwright-cli fill e3 "hello"          # fill by ref
```

--------------------------------

### Enabling capabilities via config file

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/capabilities.mdx

Example of enabling capabilities within a configuration file.

```json
{
  "capabilities": ["core", "vision", "pdf", "devtools", "network", "storage", "testing"]
}
```

--------------------------------

### Using Element Refs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/snapshots.mdx

Examples of `playwright-cli` commands interacting with elements using their unique refs.

```bash
playwright-cli click e10                   # check the checkbox
playwright-cli fill e5 "Walk the dog"      # type into textbox
playwright-cli hover e20                   # hover over "All" link
```

--------------------------------

### Alert dialog

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/dialogs.mdx

Example of handling an alert dialog by accepting it.

```txt
→ browser_click { ref: "e5" }
  ⚠ Dialog appeared: [alert] "Are you sure you want to delete this?"

→ browser_handle_dialog { accept: true }
```

--------------------------------

### CDP endpoint

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/attach.mdx

Example of starting Chrome with remote debugging and then connecting via the CLI.

```bash
# Start Chrome with remote debugging
google-chrome --remote-debugging-port=9222

# Connect from the CLI
playwright-cli attach --cdp=http://localhost:9222
playwright-cli snapshot
playwright-cli click e5
```

--------------------------------

### Screenshot Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/screenshots-pdf.mdx

Examples of using the `playwright-cli screenshot` command with various options.

```bash
$ playwright-cli screenshot
# Screenshot saved to .playwright-cli/screenshot-2026-03-15.png

$ playwright-cli screenshot e15
# Screenshot of element e15

$ playwright-cli screenshot --filename=login-page.png
$ playwright-cli screenshot --full-page --filename=full-page.png
```

--------------------------------

### Verify element content

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/code-execution.mdx

Example of using `browser_run_code` to get the text content of an element by its test ID.

```JavaScript
async (page) => { return await page.getByTestId('todo-count').textContent(); }
```

--------------------------------

### History navigation

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/navigation.mdx

Examples demonstrating 'go-back', 'go-forward', and 'reload' commands for navigating through browser history.

```bash
$ playwright-cli goto https://example.com/page1
$ playwright-cli goto https://example.com/page2
$ playwright-cli go-back
# Now at page1

$ playwright-cli go-forward
# Now at page2

$ playwright-cli reload
# page2 reloaded
```

--------------------------------

### Conditional mocking with code

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/network-mocking.mdx

Example of using `browser_run_code` to implement conditional API mocking based on query parameters.

```txt
→ browser_run_code {
    code: "async (page) => {
      await page.route('**/api/search', async route => {
        const url = new URL(route.request().url());
        const query = url.searchParams.get('q');
        await route.fulfill({
          body: JSON.stringify(query === 'empty' ? [] : [{ title: 'Result: ' + query }])
        });
      });
    }"
  }
```

--------------------------------

### Prompt dialog

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/dialogs.mdx

Example of handling a prompt dialog by accepting it and providing text input.

```txt
→ browser_click { ref: "e8" }
  ⚠ Dialog appeared: [prompt] "Enter your name:"

→ browser_handle_dialog { accept: true, promptText: "My new name" }
```

--------------------------------

### Automatic recording via environment variable

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/video-recording.mdx

Environment variable example for automatically recording all sessions.

```bash
PLAYWRIGHT_MCP_SAVE_VIDEO=800x600 playwright-cli open https://example.com
```

--------------------------------

### Restore Browser Storage State

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/storage.mdx

Example of restoring a previously saved browser state and navigating to a dashboard.

```txt
→ browser_set_storage_state { path: "./auth-state.json" }
→ browser_navigate { url: "https://app.example.com/dashboard" }
→ browser_snapshot
  // Already logged in
  - heading "Dashboard" [level=1]
```

--------------------------------

### Cookie management commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/storage.mdx

Examples of using `playwright-cli` commands to list, get, set, delete, and clear cookies, including options for `cookie-set`.

```bash
$ playwright-cli cookie-list
# Name          Value       Domain            HttpOnly  Secure  Expires
# session_id    abc123      .example.com      true      true    2024-12-31
# theme         dark        .example.com      false     false   Session

$ playwright-cli cookie-list --domain=.github.com
$ playwright-cli cookie-get session_id
$ playwright-cli cookie-set theme light
$ playwright-cli cookie-set session abc123 --domain=.example.com --secure --http-only
$ playwright-cli cookie-delete session_id
$ playwright-cli cookie-clear
```

--------------------------------

### Example Usage

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/introduction.mdx

Demonstrates a sequence of Playwright CLI commands to open a page, type text, press Enter, check an element, and take a screenshot.

```bash
$ playwright-cli open https://demo.playwright.dev/todomvc --headed
$ playwright-cli type "Buy groceries"
$ playwright-cli press Enter
$ playwright-cli type "Water flowers"
$ playwright-cli press Enter
$ playwright-cli check e21
$ playwright-cli screenshot
```

--------------------------------

### Snapshot Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/screenshots-pdf.mdx

Examples of using the `playwright-cli snapshot` command for accessibility tree output.

```bash
playwright-cli snapshot                 # full page snapshot
playwright-cli snapshot --filename=f    # custom filename
playwright-cli snapshot [ref]           # element snapshot
playwright-cli snapshot --depth=N       # limit depth
```

--------------------------------

### Chapter markers

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/video-recording.mdx

Example of adding chapter markers to a video recording for structured navigation.

```bash
playwright-cli video-start

playwright-cli video-chapter "Step 1: Login"
playwright-cli goto https://app.example.com/login
playwright-cli fill e3 "user@example.com"
playwright-cli fill e5 "password"
playwright-cli click e7

playwright-cli video-chapter "Step 2: Navigate to settings"
playwright-cli goto /settings

playwright-cli video-chapter "Step 3: Update profile"
playwright-cli fill e10 "New Display Name"
playwright-cli click e15

playwright-cli video-stop
```

--------------------------------

### PDF Export Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/screenshots-pdf.mdx

Examples of using the `playwright-cli pdf` command to export pages as PDF.

```bash
playwright-cli pdf                      # save with auto-generated name
playwright-cli pdf --filename=page.pdf  # save with custom name
```

--------------------------------

### Debugging a broken page

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/console.mdx

Example workflow demonstrating how to use console messages to debug a page.

```txt
You: The page looks broken. Check the console for errors.

→ browser_console_messages { level: "error" }
  [error] Failed to fetch: GET https://api.example.com/data 404
  [error] Uncaught Error: API returned 404

→ // LLM now knows the API endpoint is returning 404
→ // Can mock the route or investigate further
```

--------------------------------

### Configuration Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/introduction.mdx

Commands and options for configuring Playwright CLI behavior, such as browser mode, profile, and skill installation.

```bash
open --headed               open --browser=firefox      open --persistent
open --profile=<path>       open --config=file.json     attach --extension
install --skills            config-print
```

--------------------------------

### Block resources

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/network-mocking.mdx

Examples of blocking image files (`.jpg`) with a 404 status and analytics requests with a 204 status.

```txt
→ browser_route { pattern: "**/*.jpg", status: 404 }
→ browser_route { pattern: "**/analytics/**", status: 204 }
```

--------------------------------

### Workflow: filling a form and submitting

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/interaction.mdx

A complete workflow example demonstrating snapshot, typing, selecting, and clicking to fill and submit a form.

```txt
→ browser_snapshot
  - textbox "Email" [ref=e3]
  - textbox "Password" [ref=e5]
  - combobox "Role" [ref=e7]
  - button "Sign up" [ref=e9]

→ browser_type { ref: "e3", text: "alice@example.com" }
→ browser_type { ref: "e5", text: "s3cret!" }
→ browser_select_option { ref: "e7", values: ["Admin"] }
→ browser_click { ref: "e9" }

→ browser_snapshot
  - heading "Welcome, Alice!" [level=1]
  - text: "Your account has been created."
```

--------------------------------

### Save Browser Storage State

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/storage.mdx

Example of saving the current browser state to a JSON file.

```txt
→ browser_storage_state
  State saved to: auth-state.json
```

--------------------------------

### Remove mock and verify recovery

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/network-mocking.mdx

Example of unrouting a mock, clicking a retry button, and taking a snapshot to verify recovery.

```txt
→ browser_unroute
→ browser_click { ref: "e5" }
→ browser_snapshot
  - heading "Users" [level=1]
  - list "User list":
    - listitem: "Alice Johnson"
    - listitem: "Bob Smith"
```

--------------------------------

### browser_evaluate examples

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/code-execution.mdx

Examples of using `browser_evaluate` to run JavaScript expressions on the page or a specific element.

```JavaScript
document.title
```

```JavaScript
el => el.getAttribute('data-testid')
```

```JavaScript
window.innerWidth + 'x' + window.innerHeight
```

--------------------------------

### Console error output example

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/console-eval.mdx

Example output when filtering console messages to show only errors.

```bash
$ playwright-cli console error
# [error] Uncaught TypeError: Cannot read property 'map' of undefined
#   at app.js:42:15
# [error] Failed to fetch: GET /api/users 404
```

--------------------------------

### Start a test in debug mode

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/test-debugging.mdx

Start a Playwright test with the debug flag to pause execution at the beginning, allowing for interactive debugging.

```bash
npx playwright test --debug=cli
```

--------------------------------

### Workflow: comparing two pages

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/tabs.mdx

An example workflow demonstrating how to open and compare two different web pages using browser navigation and tab management commands.

```txt
You: Open staging and production, compare the headers.

→ browser_navigate { url: "https://staging.example.com" }
→ browser_snapshot   // snapshot of staging
→ browser_tabs { action: "new", url: "https://example.com" }
→ browser_snapshot   // snapshot of production
  // LLM compares the two snapshots
```

--------------------------------

### Example Interaction

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/introduction.mdx

An example of an LLM interacting with a web page using Playwright MCP, showing navigation, snapshot capture, and typing actions.

```txt
You: Navigate to https://demo.playwright.dev/todomvc and add "Buy groceries".

→ browser_navigate { url: "https://demo.playwright.dev/todomvc" }
→ browser_snapshot

  - heading "todos" [level=1]
  - textbox "What needs to be done?" [ref=e5]

→ browser_type { ref: "e5", text: "Buy groceries", submit: true }
→ browser_snapshot

  - heading "todos" [level=1]
  - textbox "What needs to be done?" [ref=e5]
  - listitem:
    - checkbox "Toggle Todo" [ref=e10]
    - text: "Buy groceries"
  - contentinfo:
    - text: "1 item left"
```

--------------------------------

### Form interaction

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/interaction.mdx

Examples demonstrating various form interaction commands like filling text fields, selecting dropdowns, checking checkboxes, uploading files, and resizing the browser window.

```bash
# Fill a text field
playwright-cli fill e3 "test@example.com"

# Fill and submit (presses Enter)
playwright-cli fill e3 "search query" --submit

# Select from dropdown
playwright-cli select e7 "United States"

# Checkboxes
playwright-cli check e10                # check
playwright-cli uncheck e10              # uncheck

# File upload
playwright-cli upload /path/to/file.pdf

# Resize browser window
playwright-cli resize 375 812           # mobile viewport
playwright-cli resize 1920 1080         # desktop
```

--------------------------------

### Confirm dialog

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/dialogs.mdx

Examples of accepting and dismissing a confirm dialog.

```txt
→ browser_click { ref: "e10" }
  ⚠ Dialog appeared: [confirm] "Are you sure you want to delete this?"

→ browser_handle_dialog { accept: true }     // click OK
→ browser_handle_dialog { accept: false }    // click Cancel
```

--------------------------------

### Navigating

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/navigation.mdx

Example of navigating to a specific URL using the Playwright CLI 'goto' command and the output showing page details and a snapshot link.

```bash
$ playwright-cli goto https://demo.playwright.dev/todomvc
### Page
- Page URL: https://demo.playwright.dev/todomvc/#/
- Page Title: React - TodoMVC
### Snapshot
[Snapshot](.playwright-cli/page-2026-02-14T19-22-42-679Z.yml)
```

--------------------------------

### Workflow: Save login and restore state

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/storage.mdx

Demonstrates how to log in once, save the authenticated state, and then restore it later to skip the login process.

```bash
# Login once
playwright-cli open https://app.example.com/login
playwright-cli fill e3 "user@example.com"
playwright-cli fill e5 "password123"
playwright-cli click e7

# Save authenticated state
playwright-cli state-save auth.json

# Later, skip login entirely
playwright-cli state-load auth.json
playwright-cli goto https://app.example.com/dashboard
# Already logged in!
```

--------------------------------

### Wait a fixed duration

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/waiting.mdx

Example of waiting for a fixed number of seconds.

```txt
→ browser_wait_for { time: 3 }
  ✓ Waited 3 seconds
```

--------------------------------

### Run dev server

Source: https://github.com/microsoft/playwright.dev/blob/main/README.md

Start the Docusaurus development server for Node.js.

```sh
npm run start-nodejs
```

--------------------------------

### Browser selection

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/configuration/options.mdx

Command-line argument for selecting a browser.

```json
["@playwright/mcp@latest", "--browser=firefox"]
```

--------------------------------

### Wait for text to disappear

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/waiting.mdx

Example of waiting for specific text to disappear from the page.

```txt
→ browser_wait_for { textGone: "Loading..." }
  ✓ Text disappeared: "Loading..."
```

--------------------------------

### Minimal (default) configuration

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/capabilities.mdx

Configuration for enabling only core tools.

```json
["@playwright/mcp@latest"]
```

--------------------------------

### Closing tabs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/tabs.mdx

Examples of closing the current tab or a specific tab by index.

```bash
playwright-cli tab-close                # close current tab
playwright-cli tab-close 2              # close specific tab
```

--------------------------------

### Device emulation

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/configuration/options.mdx

Command-line argument for emulating a specific device.

```json
["@playwright/mcp@latest", "--device=iPhone 15"]
```

--------------------------------

### CSS selectors

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/interaction.mdx

Examples of using CSS selectors to target and interact with elements.

```bash
playwright-cli click "#main > button.submit"
playwright-cli click "[data-testid='submit']"
playwright-cli fill "#email" "test@example.com"
```

--------------------------------

### Listing tabs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/tabs.mdx

Example of listing all open tabs using `playwright-cli tab-list`.

```bash
$ playwright-cli tab-list
# Tab 0: "TodoMVC" - https://demo.playwright.dev/todomvc  [active]
# Tab 1: "Example" - https://example.com
# Tab 2: "Google" - https://google.com
```

--------------------------------

### Workflow: login form

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/interaction.mdx

A step-by-step workflow example for interacting with a login form, including snapshotting, filling fields, checking a checkbox, and clicking a button.

```bash
$ playwright-cli snapshot
# - textbox "Email" [ref=e3]
# - textbox "Password" [ref=e5]
# - checkbox "Remember me" [ref=e7]
# - button "Sign in" [ref=e9]

$ playwright-cli fill e3 "alice@example.com"
$ playwright-cli fill e5 "s3cureP@ss!"
$ playwright-cli check e7
$ playwright-cli click e9

$ playwright-cli snapshot
# - heading "Welcome back, Alice!" [level=1]
```

--------------------------------

### Manage LocalStorage

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/storage.mdx

Examples of listing localStorage key-value pairs and setting a specific value, then observing the effect after a page reload.

```txt
→ browser_localstorage_list
  Key                Value
  user_preferences   {"theme":"dark","lang":"en"}
  onboarding_done    true

→ browser_localstorage_set { key: "onboarding_done", value: "false" }
→ browser_reload
→ browser_snapshot
  // Onboarding wizard appears
  - heading "Welcome! Let's get started" [level=1]
```

--------------------------------

### Handle iframes

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/code-execution.mdx

Example of using `browser_run_code` to interact with elements inside an iframe.

```JavaScript
async (page) => { const frame = page.frameLocator('#payment-iframe'); return await frame.locator('.total').textContent(); }
```

--------------------------------

### browser_console_messages

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/console.mdx

Example output of browser console messages, including filtering by error level.

```txt
→ browser_console_messages

  [error] Uncaught TypeError: Cannot read property 'map' of undefined
    at app.js:42:15
  [warning] Deprecation: 'window.webkitStorageInfo' is deprecated.
  [info] App initialized in 234ms
  [info] User session restored

→ browser_console_messages { level: "error" }
  [error] Uncaught TypeError: Cannot read property 'map' of undefined
    at app.js:42:15
```

--------------------------------

### Mouse commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/keyboard-mouse.mdx

Examples demonstrating how to use playwright-cli mouse commands for clicking at coordinates, right-clicking, and scrolling horizontally and vertically.

```bash
# Click at coordinates
playwright-cli mousemove 100 200
playwright-cli mousedown
playwright-cli mouseup

# Right-click
playwright-cli mousemove 300 400
playwright-cli mousedown right
playwright-cli mouseup right

# Scroll down 500 pixels
playwright-cli mousewheel 0 500

# Scroll right 200 pixels
playwright-cli mousewheel 200 0
```

--------------------------------

### Behind a proxy

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/configuration.mdx

Example JSON configuration for running Playwright CLI behind a proxy.

```json
{
  "browser": {
    "launchOptions": {
      "proxy": {
        "server": "http://proxy.corp.example.com:8080",
        "bypass": "localhost,*.internal.com"
      }
    }
  }
}
```

--------------------------------

### Playwright server endpoint

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/attach.mdx

Example of connecting to a remote Playwright server.

```bash
playwright-cli attach --endpoint=ws://localhost:3000
playwright-cli snapshot
```

--------------------------------

### Storage Management Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/introduction.mdx

Commands for managing browser state, cookies, local storage, and session storage.

```bash
state-save [file]           state-load <file>
cookie-list [--domain]      cookie-get <name>           cookie-set <name> <val>
cookie-delete <name>        cookie-clear
localstorage-list           localstorage-get <key>      localstorage-set <k> <v>
localstorage-delete <key>   localstorage-clear
sessionstorage-list         sessionstorage-get <key>    sessionstorage-set <k> <v>
sessionstorage-delete <k>   sessionstorage-clear
```

--------------------------------

### Prompt dialogs

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/dialogs.mdx

Example of handling a prompt dialog by accepting it with provided text or dismissing it.

```bash
$ playwright-cli click e8
# ⚠ Dialog appeared: [prompt] "Enter your name:"

# Accept with text
$ playwright-cli dialog-accept "Alice"

# Or dismiss (cancels the prompt)
$ playwright-cli dialog-dismiss
```

--------------------------------

### Tracing Commands

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/tracing.mdx

Basic `playwright-cli` commands to start and stop recording execution traces.

```bash
playwright-cli tracing-start
playwright-cli tracing-stop
```

--------------------------------

### Workflow: testing error handling

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/network-routing.mdx

A step-by-step workflow demonstrating how to mock an API error, reload the page, verify the error state, screenshot it, then remove the mock and retry.

```bash
# 1. Mock the API to return 503
playwright-cli route "**/api/users" --status=503

# 2. Reload to trigger the error
playwright-cli reload

# 3. Verify the error page
playwright-cli snapshot
# - heading "Something went wrong" [level=1]
# - button "Retry" [ref=e5]

# 4. Screenshot the error state
playwright-cli screenshot --filename=error-state.png

# 5. Remove mock and retry
playwright-cli unroute
playwright-cli click e5
playwright-cli snapshot
# - heading "Users" [level=1]
```

--------------------------------

### Playwright CLI Open and Attach Parameters

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/configuration.mdx

Examples of using `playwright-cli open` and `playwright-cli attach` commands with various options for browser interaction and connection.

```bash
playwright-cli open [url]                          # open browser
playwright-cli open --headed                       # show browser window
playwright-cli open --browser=firefox              # specific browser
playwright-cli open --persistent                   # persist profile to disk
playwright-cli open --profile=<path>               # custom profile directory
playwright-cli open --config=file.json             # use config file
playwright-cli attach --extension                  # connect via extension
playwright-cli attach --cdp <url>                  # connect via CDP
playwright-cli attach --endpoint <url>             # connect to Playwright server
```

--------------------------------

### browser_stop_video output

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/video.mdx

Example output showing the path where the video is saved after calling browser_stop_video.

```txt
→ browser_stop_video
  Video saved to: /output/login-flow.webm
```

--------------------------------

### Wait for specific condition

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/code-execution.mdx

Example of using `browser_run_code` to wait for a selector to become hidden.

```JavaScript
async (page) => { await page.waitForSelector('.loading', { state: 'hidden' }); return 'Loading complete'; }
```

--------------------------------

### Workflow: completing a multi-step form

Source: https://github.com/microsoft/playwright.dev/blob/main/mcp/tools/forms.mdx

A workflow example demonstrating how to complete a multi-step registration form using a combination of browser_type, browser_click, and browser_fill_form commands.

```txt
You: Fill out the registration form on this page.

→ browser_snapshot
  // Page 1: Personal info
  - textbox "Email" [ref=e3]
  - textbox "Password" [ref=e5]
  - button "Next" [ref=e7]

→ browser_type { ref: "e3", text: "alice@example.com" }
→ browser_type { ref: "e5", text: "s3cureP@ss!" }
→ browser_click { ref: "e7" }

→ browser_snapshot
  // Page 2: Profile
  - textbox "Display name" [ref=e3]
  - combobox "Timezone" [ref=e5]
  - checkbox "Subscribe to newsletter" [ref=e7]
  - button "Create account" [ref=e9]

→ browser_fill_form {
    fields: [
      { ref: "e3", value: "Alice S." },
      { ref: "e5", value: "US/Pacific" },
      { ref: "e7", value: true }
    ]
  }
→ browser_click { ref: "e9" }
```

--------------------------------

### Workflow

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/dialogs.mdx

Demonstrates the workflow of handling a dialog before continuing with subsequent commands, such as taking a snapshot.

```bash
$ playwright-cli click e12
# ⚠ Dialog appeared: [confirm] "Discard unsaved changes?"

$ playwright-cli dialog-accept

$ playwright-cli snapshot
# Page now shows updated state after dialog was accepted
```

--------------------------------

### Key combinations

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/keyboard-mouse.mdx

Examples of using playwright-cli to press key combinations like Control+a for select all, Control+c for copy, Control+v for paste, Shift+Tab for focusing previous element, and Alt+Enter.

```bash
playwright-cli press Control+a          # select all
playwright-cli press Control+c          # copy
playwright-cli press Control+v          # paste
playwright-cli press Shift+Tab          # focus previous
playwright-cli press Alt+Enter          # alt+enter
```

--------------------------------

### Workflow: navigation with history

Source: https://github.com/microsoft/playwright.dev/blob/main/agent-cli/commands/navigation.mdx

A workflow example combining opening a browser, filling a form, navigating to another page, going back in history, and taking a snapshot.

```bash
$ playwright-cli open https://demo.playwright.dev/todomvc
$ playwright-cli fill e5 "Buy groceries" --submit
$ playwright-cli goto https://example.com
$ playwright-cli go-back
$ playwright-cli snapshot
# - heading "todos" [level=1]
# - textbox "What needs to be done?" [ref=e5]
# - listitem:
#   - checkbox "Toggle Todo" [ref=e10]
#   - text: "Buy groceries"
```