ChromeDevTools/chrome-devtools-mcp

解決的問題

本專案提供 AI 編碼代理與即時 Chrome 瀏覽器互動與控制的方法。它彌補了 AI 寫程式碼的能力與其實時觀察與除錯 Web 應用程式實際執行行為能力之間的差距。

運作方式

它作為 Model-Context-Protocol (MCP) 伺服器運作。當連接到支援 MCP 的 AI 客戶端（如 Claude、Cursor 或 Copilot）時，會公開一組工具，讓 AI 可呼叫執行瀏覽器操作。它使用 Puppeteer 實現可靠的自動化，並利用 Chrome DevTools Protocol 存取瀏覽器內部以進行除錯與效能分析。

適用對象

需要透過 AI 界面自動化瀏覽器互動、執行深度除錯並直接分析 Web 性能的 Web 開發者與 AI 輔助編碼代理。

主要特色

• 瀏覽器自動化：完整的輸入與導航工具集（點擊、輸入、填寫表單、頁面導航）。
• 詳細除錯：可分析網路請求、截取螢幕截圖，並讀取帶有原始碼對應堆疊追蹤的瀏覽器控制台訊息。
• 效能洞察：提供記錄追蹤並提取可操作效能資料的工具。
• 廣泛的客戶端支援：為大量 AI IDE 與 CLI 工具（如 Claude Code、Cursor、VS Code、Gemini）提供預設設定。
• 彈性模式：包含 --slim 模式，適用於基本瀏覽器任務。