dev-browser

Automates browser navigation, form filling, and screenshots with persistent page state.

1|Updated Feb 23, 2026
One-click install
npx skills add https://github.com/UtsavBalar1231/oh-my-claudeagent --skill dev-browser-utsavbalar1231
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: dev-browser
Source: https://github.com/UtsavBalar1231/oh-my-claudeagent/tree/main/skills/dev-browser
Command: npx skills add https://github.com/UtsavBalar1231/oh-my-claudeagent --skill dev-browser-utsavbalar1231

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires tsx.

What problem does it solve? Manually testing web apps, scraping pages, or repeating browser workflows is slow and error-prone. This Skill drives a real Chromium browser through small, focused scripts while keeping page state alive between steps, so multi-step automations can be built and debugged incrementally. ## Core Features & Use Cases - Persistent Page State: Named pages survive script failures and disconnects, letting you resume exactly where an automation left off. - ARIA Snapshot Element Discovery: getAISnapshot() returns the accessibility tree with stable refs, so you can click elements without guessing CSS selectors. - Two Connection Modes: Launch a standalone Chromium instance or attach to the user's existing Chrome via a relay extension to reuse logged-in sessions. - Use Case: Automate an end-to-end checkout flow — navigate to the store, fill the cart and payment forms, screenshot each step, and verify the confirmation page, all as a sequence of small debuggable scripts. ## Quick Start Ask the agent to open a website in the dev browser, fill in a form, and take a screenshot of the result.

Frequently Asked Questions about dev-browser

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate browser tasks with persistent page state?

Start the browser server with server.sh, then connect via the client API and create named pages with client.page(). Pages persist after scripts disconnect, so subsequent scripts can resume the same session and continue the workflow.

How to find and click elements without CSS selectors in browser automation?

Use getAISnapshot() to retrieve the page's accessibility tree as YAML with refs like e5, then call selectSnapshotRef() to get the element and click it. Take a fresh snapshot after navigation since refs change when the page updates.

Can I automate a browser where I am already logged in?

Yes, use Extension Mode to connect to your existing Chrome via the companion extension and relay started with npm run start-extension. This reuses your logged-in sessions instead of launching a fresh Chromium instance.

Why does TypeScript syntax fail inside page.evaluate()?

page.evaluate() runs code in the browser context, which only understands plain JavaScript. Type annotations like 'const el: HTMLElement' cause runtime failures, so write plain JS inside evaluate callbacks.

How do I debug a failed browser automation script?

Page state persists after failures, so reconnect with the client, open the same named page, and inspect page.url() or take a screenshot to see the current state. Then write a small recovery script for the next step.