紹介
DevBridgeは、任意のAIツールをChromeブラウザに接続し、デバッグと自動化を実現するChrome拡張機能とMCPサーバーです。
MCPとは？
Model Context Protocol（MCP）は、AIアプリケーションが外部ツールやサービスと連携するためのオープン標準です。DevBridgeを使用すると、AIエディタからMCPツール呼び出しが送信され、DevBridgeがChromeで実行して結果を返します。
DevBridgeでできること
DevBridgeは18のMCPツールを提供し、2つのコアワークフローをカバーします：
デバッグ — コンソールログの読み取り、ネットワークリクエストのキャプチャ、アクセシビリティツリーの検査、JavaScriptの実行、スクリーンショット。Chrome DevToolsの完全なデバッグワークフローをAIエディタから直接利用できます。
自動化 — クリック、入力、スクロール、ドラッグ、フォーム入力、ファイルアップロード、ページナビゲーション、セッションのGIF録画。エンドツーエンドのテストフローを構築し、繰り返しのブラウザ作業を自動化します。
動作の仕組み
AIツール ←stdio→ MCPサーバー ←IPC→ ネイティブホスト ←Native Messaging→ Chrome拡張 ←CDP→ ブラウザすべての通信はローカルで行われ、データは外部サーバーに送信されません。
主な機能
- 18のMCPツール：ページ読み取り、インタラクション、ナビゲーション、デバッグ、視覚的キャプチャ、タブ管理
- クロスオリジンiframe対応（クロスオリジンOOPIF含む）
- Shadow DOM穿透（openおよびclosed Shadow DOM）
- Canvasインタラクション（12のサブアクション）
- GIF録画：複数ステップのインタラクションをアニメーションGIFとして録画
- 3プラットフォーム対応：Windows、macOS、Linux
- 権限管理：ドメインベースのきめ細かいアクセス制御