What problem does it solve? Verifying UI changes on a running dev server manually is slow and error-prone, and full browser automation frameworks like Playwright MCP dump entire DOM trees that consume excessive context tokens. This Skill provides lightweight browser automation through Vercel's agent-browser CLI, using compact accessibility tree snapshots with element refs to cut token usage by roughly 90%. ## Core Features & Use Cases - Compact Snapshots: Capture interactive elements as short refs (@e1, @e2) instead of full DOM dumps, keeping context small. - Ref-Based Interaction: Click, fill, hover, and select elements by ref, then re-snapshot to verify state changes. - Visual & Console Verification: Capture screenshots for PR evidence and inspect console output for JS errors and Vue warnings. - Parallel Sessions: Run named sessions to compare default and modified states side by side. - Use Case: After changing a button component, open the dev server, snapshot the page, click the button via its ref, screenshot the result, and check the console for errors — all before manual QA. ## Quick Start Use agent-browser to open http://localhost:5173, take an interactive snapshot, click the main button, and capture a screenshot of the result.
