dev-browser

作者 SawyerHood已验证

A Claude Skill to give your agent the ability to use a web browser

6,555
Stars
432
Forks
TypeScript
语言
2026/8/23
添加时间

⚠️ 第三方软件声明

本 Skill 为第三方开源软件,独立托管于 GitHub。SkillTip 仅为信息目录,不控制或维护底层仓库。所显示的安全检查为自动化且范围有限,安装前请自行审查源码。

阅读服务条款

安装

添加到你的 Claude Code skills 目录:

# Add to your Claude Code skills
git clone https://github.com/SawyerHood/dev-browser

快速入门

使用 dev-browser 等 Skills 的指南。

安全报告

已验证

上次扫描:—

{
  "status": "PASSED",
  "issues": []
}

README.md

Brought to you by Do Browser.

A browser automation tool that lets AI agents and developers control browsers with sandboxed JavaScript scripts.

Key features:

  • Sandboxed execution - Scripts run in a QuickJS WASM sandbox with no host access

  • Persistent pages - Navigate once, interact across multiple scripts

  • Auto-connect - Connect to your running Chrome or launch a fresh Chromium

  • Full Playwright API - goto, click, fill, locators, evaluate, screenshots, and more

Demo

https://github.com/user-attachments/assets/c6cf7fb9-b1dc-46ed-93b9-6e7240990c53

CLI Installation

npm install -g dev-browser
dev-browser install    # installs Playwright + Chromium

Quick start

# Launch a headless browser and run a script
dev-browser --headless <<'EOF'
const page = await browser.getPage("main");
await page.goto("https://example.com", { waitUntil: "domcontentloaded" });
console.log(await page.title());
EOF

# Connect to your running Chrome (enable at chrome://inspect/#remote-debugging)
dev-browser --connect <<'EOF'
const tabs = await browser.listPages();
console.log(JSON.stringify(tabs, null, 2));
EOF

PowerShell (Windows)

@"
const page = await browser.getPage("main");
await page.goto("https://example.com", { waitUntil: "domcontentloaded" });
console.log(await page.title());
"@ | dev-browser

With --connect:

@"
const page = await browser.getPage("main");
console.log(await page.title());
"@ | dev-browser --connect

Windows notes

PowerShell install:

npm install -g dev-browser
dev-browser install

To attach to a running Chrome instance on Windows:

chrome.exe --remote-debugging-port=9222
dev-browser --connect

Windows npm installs download the native dev-browser-windows-x64.exe release asset during postinstall, and the generated npm shims invoke that executable directly.

Using with AI agents

After installing, tell your agent to run dev-browser --help — the help output includes the current LLM usage guide and API reference.

For agents that discover local skills, install or refresh the embedded skill explicitly:

dev-browser install-skill --codex   # ~/.codex/skills/dev-browser/SKILL.md
dev-browser install-skill --claude  # ~/.claude/skills/dev-browser/SKILL.md
dev-browser install-skill --agents  # ~/.agents/skills/dev-browser/SKILL.md

Flags may be combined. With an interactive terminal, dev-browser install-skill prompts for targets. In non-interactive environments it updates all three locations, including Codex, so an older copied skill does not survive a CLI upgrade.

Idle browser cleanup

Daemon-launched named Chromium instances can be closed automatically after they have been idle for a configured duration:

dev-browser --idle-timeout 5m < script.js
DEV_BROWSER_IDLE_TIMEOUT_MS=300000 dev-browser status

The flag accepts 30s, 5m, 1h, or raw milliseconds. You can also set a user default in ~/.dev-browser/config.json:

{
  "idleTimeout": "5m"
}

Precedence is --idle-timeout, then DEV_BROWSER_IDLE_TIMEOUT_MS, then idleTimeout in the user config, then disabled. Set any source to 0 to disable cleanup. The effective setting is sent to an already-running daemon and shown by dev-browser status.

Cleanup is applied independently to each named browser. Activity is measured from both the start and completion of each request, so running requests are never reaped. Only Chromium instances launched by dev-browser are eligible; browsers attached with --connect are never closed by idle cleanup. Closing an idle browser does not delete its profile directory, cookies, or login state, and the next request relaunches it from the same persistent profile. dev-browser stop keeps its existing behavior of stopping the daemon and all managed browser connections.

By default, Claude Code asks for approval each time it runs a bash command. You can pre-approve dev-browser so it runs without permission checks by adding it to the allow list in your settings.

Per-project — add to .claude/settings.json in your project root:

{
  "permissions": {
    "allow": [
      "Bash(dev-browser *)"
    ]
  }
}

Per-user (global) — add to ~/.claude/settings.json:

{
  "permissions": {
    "allow": [
      "Bash(dev-browser *)"
    ]
  }
}

The pattern Bash(dev-browser *) matches any command starting with dev-browser followed by arguments (e.g. dev-browser --headless, dev-browser --connect). This is safe because dev-browser scripts run in a sandboxed QuickJS WASM environment with no host filesystem or network access.

You can also allow related commands in the same list:

{
  "permissions": {
    "allow": [
      "Bash(dev-browser *)",
      "Bash(npx dev-browser *)"
    ]
  }
}

Tip: If you've already been prompted and clicked "Always allow", Claude Code adds the specific command pattern automatically. The settings file approach lets you pre-approve it before the first run.

Claude Code

/plugin marketplace add sawyerhood/dev-browser
/plugin install dev-browser@sawyerhood/dev-browser

Restart Claude Code after installation.

Script API

Scripts run in a sandboxed QuickJS runtime (not Node.js). Available globals:

// Browser control
browser.getPage(nameOrId)    // Get/create named page, or connect to tab by targetId
browser.newPage()            // Create anonymous page (cleaned up after script)
browser.listPages()          // List all tabs: [{id, url, title, name}]
browser.closePage(name)      // Close a named page

// File I/O (restricted to ~/.dev-browser/tmp/)
await saveScreenshot(buf, name)   // Save screenshot buffer, returns path
await writeFile(name, data)       // Write file, returns path
await readFile(name)              // Read file, returns content

// Output
console.log/warn/error/info       // Routed to CLI stdout/stderr

Pages are full Playwright Page objectsgoto, click, fill, locator, evaluate, screenshot, and everything else, including page.snapshotForAI({ track?, depth?, timeout? }), which returns { full, incremental? } for AI-friendly page snapshots.

Every page also exposes two computer-use toolsets:

  • page.cua.* — pixel/vision tier: screenshot() saves a JPEG whose pixels map 1:1 onto CSS coordinates at any DPR and returns { path, width, height }; click, doubleClick, drag, move, scroll, keypress, and type act at those coordinates.

  • page.domCua.* — DOM-id tier: getVisibleDom() snapshots visible interactive elements as pseudo-HTML lines with node_id=N; click, doubleClick, and scroll act by node id (ids are only valid against the latest snapshot of the current document), plus type and keypress for the focused element.

Benchmarks

Method Time Cost Turns Success

Dev Browser 3m 53s $0.88 29 100%

Playwright MCP 4m 31s $1.45 51 100%

Playwright Skill 8m 07s $1.45 38 67%

Claude Chrome Extension 12m 54s $2.81 80 100%

See dev-browser-eval for methodology.

License

MIT

Author

Sawyer Hood

常见问题

What is dev-browser?

dev-browser is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by SawyerHood. A Claude Skill to give your agent the ability to use a web browser. It has 6,555 GitHub stars.

Is dev-browser safe to use?

Yes. dev-browser passed SkillsLLM's automated security scan — a dependency vulnerability audit plus prompt-injection heuristics — with no high-severity issues. You can read the full report in the Security Report section on this page.

How do I install dev-browser?

Clone the repository with "git clone https://github.com/SawyerHood/dev-browser" and add it to your Claude Code skills directory (see the Installation section above).

What programming language is dev-browser written in?

dev-browser is primarily written in TypeScript. It is open-source under SawyerHood on GitHub, so you can review or fork the full source.

Are there alternatives to dev-browser?

Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh dev-browser against similar tools.

评论 (0)

暂无评论,成为第一个分享想法的人!

ECC

by affaan-m

10

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

242,21936,702JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情
15

An agentic skills framework & software development methodology that works.

234,96620,863Shell
AI 智能体ai-agentsbrainstorming
查看详情

hermes-agent

by NousResearch

10

The agent that grows with you

234,43747,175Python
AI 智能体ai-agentsagent-orchestration
查看详情

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

185,94028,768JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情

cc-switch

by farion1231

3

A cross-platform desktop All-in-One assistant for Claude Code, Codex, OpenCode, OpenClaw, Grok Build & Hermes Agent. Only official website: ccswitch.io

128,8688,826Rust
AI 智能体claude-codeai-tools
查看详情

claude-code

by anthropics

Claude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.

120,03119,897Shell
AI 智能体
查看详情

开发者还喜欢

基于喜欢此 Skill 的开发者投票和收藏

ECC

by affaan-m

10

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

242,21936,702JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情
15

An agentic skills framework & software development methodology that works.

234,96620,863Shell
AI 智能体ai-agentsbrainstorming
查看详情

hermes-agent

by NousResearch

10

The agent that grows with you

234,43747,175Python
AI 智能体ai-agentsagent-orchestration
查看详情

n8n

by n8n-io

12

Fair-code workflow automation platform with native AI capabilities. Combine visual building with custom code, self-host or cloud, 400+ integrations.

201,88160,308TypeScript
MCP 服务器apisai-tools
查看详情

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

185,94028,768JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情

cc-switch

by farion1231

3

A cross-platform desktop All-in-One assistant for Claude Code, Codex, OpenCode, OpenClaw, Grok Build & Hermes Agent. Only official website: ccswitch.io

128,8688,826Rust
AI 智能体claude-codeai-tools
查看详情