playwright-cli

# Browser Automation with playwright-cli ## Quick start ```bash # open new browser playwright-cli open # navigate to a page playwright-cli goto https://playwright.dev # interact with the page using refs from the snapshot playwright-cli click e15 playwright-cli type "page.click" playwright-cli press Enter # take a screenshot (rarely used, as snapshot is more common) playwright-cli screenshot # close the browser playwright-cli close ``` ## Commands ### Core ```bash playwright-cli open # open and navigate right away playwright-cli open https://example.com/ playwright-cli goto https://playwright.dev 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 playwright-cli close ``` ### Navigation ```bash playwright-cli go-back playwright-cli go-forward playwright-cli reload ``` ### Keyboard ```bash playwright-cli press Enter playwright-cli press ArrowDown playwright-cli keydown Shift playwright-cli keyup Shift ``` ### Mouse ```bash 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 ```bash playwright-cli screenshot playwright-cli screenshot e5 playwright-cli screenshot --filename=page.png playwright-cli pdf --filename=page.pdf ``` ### Tabs ```bash 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 ```bash 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 ```bash 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 ```bash 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 ``` ## Open parameters ```bash # 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 ``` ## Snapshots After each command, playwright-cli provides a snapshot of the current browser state. ```bash > playwright-cli goto https://example.com ### Page - Page URL: https://example.com/ - Page Title: Example Domain ### Snapshot [Snapshot](.playwright-cli/page-2026-02-14T19-22-42-679Z.yml) ``` You can also take a snapshot on demand using `playwright-cli snapshot` command. If `--filename` is not provided, a new snapshot file is created with a timestamp. Default to automatic file naming, use `--filename=` when artifact is a part of the workflow result. ## Browser Sessions ```bash # create new browser session named "mysession" with persistent profile playwright-cli -s=mysession open example.com --persistent # same with manually specified profile directory (use when requested explicitly) playwright-cli -s=mysession open example.com --profile=/path/to/profile 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 persistent session playwright-cli list # Close all browsers playwright-cli close-all # Forcefully kill all browser processes playwright-cli kill-all ``` ## Local installation In some cases user might want to install playwright-cli locally. If running globally available `playwright-cli` binary fails, use `npx playwright-cli` to run the commands. For example: ```bash npx playwright-cli open https://example.com npx playwright-cli click e1 ``` ## Example: 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 ``` ## Example: Multi-tab workflow ```bash 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 playwright-cli close ``` ## Example: Debugging with DevTools ```bash playwright-cli open https://example.com playwright-cli click e4 playwright-cli fill e7 "test" playwright-cli console playwright-cli network playwright-cli close ``` ```bash playwright-cli open https://example.com playwright-cli tracing-start playwright-cli click e4 playwright-cli fill e7 "test" playwright-cli tracing-stop playwright-cli close ``` ## Connecting to the Electron App (Keybase) The Electron app must be running with remote debugging enabled: ```bash cd shared && KB_ENABLE_REMOTE_DEBUG=1 yarn desktop:start:hot ``` ### Connecting ```bash # The --persistent flag is required — it disables isolated mode, which Electron doesn't support PLAYWRIGHT_MCP_CDP_ENDPOINT=http://localhost:9222 playwright-cli open --persistent ``` ### Tab layout Tab order is NOT stable. It changes when the app restarts, and a DevTools window can take slot 0: - Seen: `0: menubar, 1: main app` - Also seen (after an app restart with DevTools open): `0: DevTools, 1: main app, 2: menubar` ### Identifying the main app tab — do this EVERY time Never reuse a remembered index. Re-run `tab-list` and pick the row whose URL contains `main.html` after every restart, reload, or reconnect, then confirm with one cheap eval before trusting anything: ```bash playwright-cli tab-list # find the row whose URL has main.html playwright-cli tab-select <that index> playwright-cli eval "document.title + ' ' + location.href" # assert before proceeding ``` **A wrong tab fails silently.** DevTools is a real page: it answers every `eval` plausibly and its console is nearly empty, so readings look like findings rather than mistakes. Treat a suspiciously empty console or a tiny `document.body.innerText` as "wrong tab" first, not as evidence. Also note `console` only captures output from the moment playwright attached to that page. Anything logged before the attach lives in the user's own DevTools and cannot be retrieved through playwright — ask them to paste it, or have them re-trigger while you are attached. Use the page URL, not the title — the title stays `"Keybase DEV"` until the router navigates and can't be relied on: - Main app: URL contains `main.html` - Menubar: URL contains `remote.html?component=menubar` (the menubar is a remote window, not its own shell) - Avoid: `devtools://` pages and the `"Keybase DEV"` standalone DevTools window ```js // Find the main app page by URL let mainPage for (const ctx of browser.contexts()) { for (const p of ctx.pages()) { if (p.url().includes('main.html')) { mainPage = p; break } } if (mainPage) break } ``` ### Quirk: snapshot vs eval `snapshot` always captures the first CDP page (usually the menubar), regardless of which tab is "current". Use `eval` instead — it correctly targets the selected tab. ```bash playwright-cli tab-select 1 # select main app tab playwright-cli eval "document.title" # works correctly ✅ playwright-cli snapshot # captures menubar instead ❌ ``` ### DOM inspection with eval Use `eval` with simple JS expressions (not multi-line functions — they fail serialization): ```bash # find element and get surrounding HTML playwright-cli eval "document.body.innerHTML.indexOf('some text')" playwright-cli eval "document.body.innerHTML.substring(111424, 112200)" # check if element exists playwright-cli eval "document.body.innerHTML.includes('cnn.com')" # get computed styles playwright-cli eval "getComputedStyle(document.querySelector('.my-class')).position" ``` ### Why --persistent is required Electron's CDP endpoint doesn't support `Target.createBrowserContext`. By default playwright-cli runs in `isolated` mode which calls `browser.newContext()` — this fails with: ``` Protocol error (Target.createBrowserContext): Failed to create browser context. ``` `--persistent` sets `isolated: false`, so playwright-cli uses the existing `browser.contexts()[0]` instead. ## Specific tasks * **Request mocking** [references/request-mocking.md](references/request-mocking.md) * **Running Playwright code** [references/running-code.md](references/running-code.md) * **Browser session management** [references/session-management.md](references/session-management.md) * **Storage state (cookies, localStorage)** [references/storage-state.md](references/storage-state.md) * **Test generation** [references/test-generation.md](references/test-generation.md) * **Tracing** [references/tracing.md](references/tracing.md) * **Video recording** [references/video-recording.md](references/video-recording.md)