playwright_skill

Overview

This skill provides browser automation using a local playwright-server controlled via simple curl commands. It maintains a stateful browser session and exposes navigation, interaction, inspection, and screenshot capabilities. Use it to drive end-to-end flows, debug UI, or extract page structure without writing direct Playwright scripts.

How this skill works

The skill talks to a background playwright-server process on localhost (default port 3210) using JSON POST bodies sent with curl. Commands include starting and stopping the browser, navigating to URLs, taking snapshots and screenshots, clicking, filling and typing into elements, and waiting for conditions. The server preserves the browser context between commands so subsequent actions operate against the same page state.

When to use it

• Automating manual test steps or smoke tests against a web app without building a full test suite.
• Capturing screenshots or page snapshots for visual checks or documentation.
• Interacting with forms and flows (login, checkout) to validate behavior or reproduce bugs.
• Extracting page structure or accessibility tree for debugging or scraping tasks.
• Triggering and observing client-side flows that require a real browser context.

Best practices

• Start the server once per session and reuse the stateful browser for related commands to maintain cookies and local storage.
• Prefer snapshot for structural inspection and screenshot for visual verification; combine both for robust checks.
• Use explicit waits (wait, waitUrl, waitLoad) before asserting or interacting to avoid flakiness.
• Address elements with stable selectors (data-test-id, role=, text=) rather than brittle CSS paths.
• Run headed mode for debugging (headless=false) and headless for CI or fast automation.

Example use cases

• Run a quick smoke test: start browser, navigate to /login, fill credentials, click submit, wait for dashboard.
• Capture a full-page screenshot of a landing page for visual regression or documentation.
• Inspect the accessibility tree with snapshot to identify missing roles or labels.
• Automate multi-step workflows like adding items to cart and verifying checkout flow.
• Reproduce intermittent UI bugs by recording interactions in headed mode and examining snapshots.