ChromeDevTools/chrome-devtools-mcp

これは何？

主な機能

• 01Chrome DevToolsを使ってパフォーマンストレースを記録し、実用的な分析結果を抽出します。
• 02ネットワークリクエストを調査し、スクリーンショットを撮影して、ソースマップに対応したスタックトレース付きでコンソールメッセージを読み取ります。
• 03Puppeteerでブラウザー操作を自動化し、結果を自動的に待機します。
• 04基本的なツールを備えたスリムモードを提供し、ヘッドレスでの実行にも対応します。
• 05MCPを使わずに利用できるCLIを提供します。

ユースケース

• AIコーディングアシスタントに、Webページのコンソールエラーやネットワーク障害をデバッグさせる。
• サイトのパフォーマンスを監査し、トレースに基づく改善案を得る。
• 開発中にエージェント主導のブラウザーテストを自動化する。
• エージェント型ツールにブラウザーサブエージェントを組み込む。

クイックスタート

1. 1

   Node.js LTS と Chrome（現行の安定版）をインストールします

2. 2

   MCP クライアントに MCP サーバーの設定を追加します

   npx -y chrome-devtools-mcp@latest
3. 3

   MCP クライアントでテスト用プロンプトを入力し、動作することを確認します

使う前に知っておきたいこと

• !公式にサポートされているのは Google Chrome と Chrome for Testing のみです。他の Chromium ブラウザーの動作は保証されません。
• !ツールによってブラウザーのすべてのデータが MCP クライアントに公開される可能性があるため、機密情報の共有は避けてください。
• !使用統計の収集はデフォルトで有効になっており、フラグまたは環境変数でオプトアウトする必要があります。

トピック

よくある質問

chrome-devtools-mcp とは？

Chrome DevToolsを使って、コーディングエージェントが実行中のChromeブラウザーを操作・調査し、デバッグやパフォーマンス分析を行えるMCPサーバー。 エージェント向けChrome DevTools（chrome-devtools-mcp）は、Claude、Cursor、Copilot、AntigravityなどのAIコーディングアシスタントから、起動中のChromeブラウザーにアクセスできるModel Context Protocolサーバーです。エージェントはページを操作したり、スクリーンショットを撮影したり、ソースマップに対応したスタックトレース付きでネットワークリクエストやコンソールメッセージを読み取ったり、パフォーマンストレースを記録したりできます。

chrome-devtools-mcp は無料で使えますか？ライセンスは？

chrome-devtools-mcp は Apache-2.0 ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

chrome-devtools-mcp は今もメンテナンスされていますか？

活発にメンテナンス中。chrome-devtools-mcp の最終コミットは 2026年10月19日 です。

chrome-devtools-mcp は何に使えますか？

AIコーディングアシスタントに、Webページのコンソールエラーやネットワーク障害をデバッグさせる。 サイトのパフォーマンスを監査し、トレースに基づく改善案を得る。 開発中にエージェント主導のブラウザーテストを自動化する。 エージェント型ツールにブラウザーサブエージェントを組み込む。

chrome-devtools-mcp のインストール方法は？

Node.js LTS と Chrome（現行の安定版）をインストールします MCP クライアントに MCP サーバーの設定を追加します: npx -y chrome-devtools-mcp@latest MCP クライアントでテスト用プロンプトを入力し、動作することを確認します

chrome-devtools-mcp はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/ChromeDevTools/chrome-devtools-mcp