H/Ai Browser MCP server

H/Ai — hai-browser

Share VS Code's integrated browser with Claude Code, GitHub Copilot, Codex CLI, Gemini CLI, Cline or any other MCP agent. You and the agent work in the same browser tab: it reads the page, clicks and types with real input, takes screenshots and watches the console, while you watch and take over at any time.

Point at an element and H/Ai opens the line of code that rendered it, and the agent gets the same element (source location, HTML, styles, screenshot), so "make this button match the header" just works.

Status: prototype (phases 0–2). See docs/plan.md.

How it works

Claude Code ──stdio MCP──▶ hai-browser-mcp ──ws://127.0.0.1 (token)──▶ H/Ai VS Code extension
                                                                          │ editor-browser debug session
                                                                          │ + js-debug requestCDPProxy
                                                                          ▼
                                                               VS Code integrated browser tab (CDP)

• The extension attaches to an integrated-browser tab through VS Code's built-in JavaScript debugger (editor-browser debug type) and asks it for a Chrome DevTools Protocol proxy (extension.js-debug.requestCDPProxy). This uses only stable, public APIs, so it works in published extensions.
• Each VS Code window runs a localhost-only WebSocket server and writes a lockfile (~/.hai-browser/sessions/.json, mode 0600) with its port and a random token.
• hai-browser-mcp picks the window whose workspace contains the agent's working directory and forwards tool calls to it.

Everything runs on your machine. There is no hosted service and no telemetry.

Requirements

• VS Code 1.119+ (integrated browser + built-in JavaScript debugger). VSCodium and Windsurf work too; they install H/Ai from Open VSX. Cursor and Antigravity don't yet: Cursor ships without VS Code's integrated browser, and Antigravity is based on VS Code 1.107.
• Claude Code, GitHub Copilot, Codex CLI, Gemini CLI, Cline or another MCP client
• Node.js 20+ to build from source (installed users can do without it; H/Ai falls back to VS Code's runtime)

Install

1. Install the extension: search for H/Ai Browser in VS Code's Extensions view, or run code --install-extension hai-browser.hai-browser. You can also download hai-browser.vsix from the latest release and run code --install-extension hai-browser.vsix, or use the one-line installer:

# macOS / Linux
   curl -fsSL https://raw.githubusercontent.com/SnapBlock/hai-browser/main/scripts/install.sh | sh

# Windows (PowerShell)
   irm https://raw.githubusercontent.com/SnapBlock/hai-browser/main/scripts/install.ps1 | iex

1. Open a folder in VS Code and trust it (the extension does not run in Restricted Mode). H/Ai asks "let Claude Code use this browser?". Click Connect Claude Code. You can run it again any time with H/Ai: Connect Claude Code.
2. Start claude in that folder (VS Code's terminal is easiest) and ask it to open your app, e.g. "open http://localhost:5173 and check the signup form works". Or share a tab you already have open with H/Ai: Share Browser Tab with Agent (also in the status bar).

The MCP server ships inside the extension. Connecting copies it to ~/.hai-browser/mcp/index.mjs (kept up to date when the extension updates) and runs claude mcp add --scope user hai-browser -- node ~/.hai-browser/mcp/index.mjs. If Node.js 20+ isn't on your PATH, it uses VS Code's own runtime instead.

Other agents

Shortened. The full README is on GitHub.