AIコーディングエージェントにブラウザの目を向けさせましょう。BrowserTools MCPストリームコンソール 出力、ネットワーク活動、スクリーンショット、そしてあなたの本物からのライトハウス監査 Chromeセッション** — すでにあなたのアプリにログインしているもの — は任意のMCP互換のものです クライアント:Cursor、Claude Code、Windsurf、Cline、Zed、Gemini CLIなど。

バージョン2.0は書き直しです。 3つのプロセスではなく1つのプロセス、認証されていない ローカルサーバー>、認証情報はブラウザから出る前にスクワッシュされ、実際の テストスイート。もし1.xから来るなら、MIGRATION.md を読んでください— そしてアップグレードしてください。なぜなら1.2.xには重大な脆弱性があるからです。 参照してください SECURITY.md。

---

なぜCDPベースのサーバーではなく、これが理由なのか

Chrome DevTools MCPやPlaywright MCPのようなツールは、新鮮で自動化されたを駆動します ブラウザ。テストを書くのに正しい選択です。しかし、 実際に見ているアプリのデバッグを指すのは、Chrome 136以降 ブラウザがあなたのデフォルトプロファイル、つまりあなたのプロフィールをリモートデバッグするのを拒否します ログイン。つまり、以前は使い捨てのプロフィールで認証状態を再作成することになります 何でもデバッグできます。

BrowserToolsは、DevToolsを通じてすでに参加しているセッションにアタッチします 延長。

BrowserTools MCP

If you are still on 1.x, upgrade. 1.x is unsupported. It has known critical vulnerabilities (remote code execution, unauthenticated access to captured data) that were fixed in 2.0 and will not be patched on 1.x. See SECURITY.md and MIGRATION.md.

Give your AI coding agent eyes on the browser. BrowserTools MCP streams console output, network activity, screenshots and Lighthouse audits from your real Chrome session — the one already logged into your app — to any MCP-compatible client: Cursor, Claude Code, Windsurf, Cline, Zed, Gemini CLI, and others.

Version 2.0 is a rewrite. One process instead of three, no unauthenticated local server, credentials scrubbed before they leave the browser, and a real test suite. Coming from 1.x? Read MIGRATION.md.

---

Why this instead of a CDP-based server

Tools like Chrome DevTools MCP and Playwright MCP drive a fresh, automated browser. That is the right choice for writing tests. It is the wrong choice for debugging the app you are actually looking at, because since Chrome 136 the browser refuses remote debugging on your default profile — the one holding your logins. So you end up recreating your auth state in a throwaway profile before you can debug anything.

BrowserTools attaches to the session you are already in, through a DevTools extension. You stay logged in, on the page you were already on, and your agent reads what you see. It also reports Lighthouse-grade performance, accessibility and SEO data, which the automation-first servers do not.

Install

Two pieces: an MCP server (one command) and a Chrome extension.

1. Point your MCP client at the server

{
  "mcpServers": {
    "browser-tools": {
      "command": "npx",
      "args": ["-y", "@agentdeskai/browser-tools-mcp@latest"]
    }
  }
}

On Windows, if your client cannot find npx, use "command": "cmd" with "args": ["/c", "npx", "-y", "@agentdeskai/browser-tools-mcp@latest"].

Requires Node 22.19 or newer. Check with node --version; if you use nvm or asdf, make sure your editor inherits the same version.

2. Load the Chrome extension

1. Download or clone this repository.
2. Open chrome://extensions and turn on Developer mode.
3. Choose Load unpacked and select the chrome-extension directory.

That is the whole setup. There is no second server to start — the MCP server runs the connector itself.

3. Use it

Open Chrome DevTools (F12) on the page you want to inspect. Capture begins as soon as DevTools is open; the BrowserTools panel is only for settings and status. Then ask your agent something like “check the console for errors” or “run an accessibility audit on this page”.

Not working? Run npx @agentdeskai/browser-tools-mcp --doctor, which reports exactly which piece is missing.

To watch capture happen live — useful when checking a fresh install — start the connector with --verbose: