Skip to main content
Glama

browserd

継続的に記録するChromiumとプログラム可能なDevToolsを備え、MCP経由でAIに公開

「LLMに駆動されるPlaywright」ではありません。ブラウザデーモンとして、目にしたすべてを記録するので、エージェントは、聞こうと思った前に発生したトラフィックについて質問できます。

Node TypeScript MCP Tools Tests


これが実際にやっていること

ほとんどのブラウザMCPサーバーはPlaywrightをラップし、モデルに要素をクリックさせるだけです。しかし、それは開発者がブラウザを開いて行うことのほんの一部にすぎません。

browserd は、エージェントが背後で見守る中、あなた自身が使える本物のヘッド付きChromiumを実行します。永続的なCDP接続を保持し、ネットワーク、コンソール、例外、ナビゲーションを継続的に記録してSQLiteに保存します。モデルが最終的に質問すると、ブラウザではなくデータベースをクエリします。

   AI ──MCP──> browserd ──CDP──> Chromium (headed, yours to use)
                  │
                  ├── network recorder ──┐
                  ├── console recorder ──┼──> SQLite + content-addressed blobs
                  ├── page recorder ─────┤
                  └── target manager ────┘        (bodies, traces, heap snapshots)

この違いは重要です。通常のブラウザ自動化MCPに「なぜチェックアウトは失敗したのか?」と尋ねても、何も返ってきません。リクエストは消えてしまっているからです。browserd に尋ねれば、ペイロード、レスポンスボディ、コンソールエラー、スタックトレース、そして正確なソース行が得られます。


エージェントができること

表示

スクリーンショット(ビューポート / 全ページ / 要素)を実際の画像ブロックとして返します。安定したeNN参照を持つアクセシビリティスナップショット — クリック対象を決める際にビジョンより安価で信頼性が高いです。

操作

クリック、ホバー、タイプ、キーコード、スクロール、選択、アップロード、ダイアログ処理。デバイスエミュレーション下ではタッチディスパッチにフォールバックします。

ネットワーク

すべてのリクエストを、すべてのヘッダー(実際にワイヤー上を流れたものも含む)、リクエストペイロード、レスポンスボディ、イニシエーター、タイミング、リダイレクトチェーン、WebSocketフレームとともに記録します。記録は最初のページスクリプトが実行される前に準備されます。

コンソール

console.* の出力とスタック付きの未キャッチ例外を、ナビゲーションをまたいで保持します。さらに、DevToolsコマンドラインAPI($$$$x)を使ったRuntime.evaluateも利用できます。

DOM / CSS

構造のアウトライン、DevToolsが表示する完全なカスケード、そしてcss.explain_visibility — これはスタイルシートを渡す代わりに、要素を隠したルールを特定します。

デバッガ

条件付きの実際のブレークポイント、ステッピング、コールフレーム、スコープチェーン、フレーム上での評価。一時停止中のスタックからローカル変数を読み取れます。

ストレージ

localStorage、sessionStorage、クッキー、IndexedDB(読み取り および 書き込み)、Cache Storage、クォータ。

プロファイリング

CPUサンプリング、JSカバレッジ、ディスクへのトレースストリーミング、リーク探索のためのコンストラクターレベルの差分を備えたヒープスナップショット、プロセス/CPU情報。

シミュレーション

制御されたクロック、タイムゾーン、CPUスロットリング、ネットワークコンディション、デバイスエミュレーション、位置情報、視覚障害、フォールトインジェクション。

人々が予想しない部分

タイムトラベル。 time.run("30m") は時計を進め、期限が来たすべてのタイマーを発火させます — 60秒間隔は即座に30回発火します。time.jump("30m") は各タイマーを1回だけ発火させて前方に跳びます。「ノートPCを3時間閉じていた」ケースです。異なるバグのクラスには、異なるツールがあります。

time.install({ time: "2030-01-01T00:00:00Z" })   # page now believes it is 2030
time.run({ duration: "30m" })                     # 30 interval ticks, no waiting
time.freeze()                                     # pin it and inspect

フォールトインジェクション。 「保存に20秒かかったらUIはどうなる?」と尋ねて、実際に確かめます。

fault.delay({ url: "**/api/save", delay: "20s" })
fault.replace_response({ url: "**/api/user", status: 500, body: {...} })
fault.drop_next({ url: "**/api/payment", count: 1 })

リークハンティング。 2つのヒープスナップショットと差分を、切り離されたDOMノードを指摘してコンストラクターごとに報告します — 古典的なリークのシグネチャです。

ヒューマン ↔ AI ハンドオフ。 inspector.pick は実際のDevTools要素ピッカーを起動し、あなたが壊れたものをクリックします。エージェントはノードハンドルを読み返します。page.highlight はその逆方向です。


インストール

Node ≥ 20.11 が必要です。Chromiumは、Playwrightのバンドルビルドが存在する場合はそこから解決されます(ブランド版Chrome 137+は--load-extensionを廃止しましたが、バンドルビルドにはまだあります)。それ以外の場合はシステムインストールから解決されます。

git clone <your-remote> browserd && cd browserd
npm install
npm run build

MCPクライアントに登録する

node scripts/install-mcp.mjs

これはClaude Desktop、Claude Code、Codex CLI、Cursor、Windsurf、VS Codeを検出し、既存の設定にマージします(まず.bakを書き込みます)。他のサーバーを上書きすることはありません。

node scripts/install-mcp.mjs --print            # show the JSON, change nothing
node scripts/install-mcp.mjs --client codex     # just one client
node scripts/install-mcp.mjs --headless         # auto-launch headless
node scripts/install-mcp.mjs --http --port 7331 # register the HTTP endpoint instead

対応クライアント: Claude DesktopClaude CodeCodex CLICursorWindsurfVS Code。CodexはJSONではなく[mcp_servers.browserd] TOMLセクションを使用します。インストーラーはそのファイルを外科的に編集するため、コメントや他の設定は残ります。

次に、すべてのクライアントが実際に起動できることを確認します:

npm run verify-mcp
  OK    Claude Code      174 tools advertised
  OK    Codex CLI        174 tools advertised
  OK    VS Code          174 tools advertised

これは実際の設定ファイルを読み取り、指定された内容でMCPハンドシェイクを完了します。そのため、古いパスや手動編集されたエントリは、動作を仮定するのではなく検出されます。

または手動で追加します:

{
  "mcpServers": {
    "browserd": {
      "command": "node",
      "args": ["/absolute/path/to/browserd/dist/cli.js"]
    }
  }
}

クライアントを再起動します。ブラウザを開いておく必要はありません — ブラウザを必要とする最初のツール呼び出しが起動します。

試す

エージェントに尋ねてみてください:

news.ycombinator.comを開いて、スクリーンショットを見せて、500ms以上かかったすべてのリクエストと、 最も遅かったものが何を返したか教えてください。

または、完全なデモはこちら:

localhost:3000の自分のアプリに行って、Checkoutをクリックして、なぜ失敗するか教えてください。

失敗のスクリーンショットを撮り、コンソールエラーを読み取り、失敗したリクエストを見つけ、ペイロードと400レスポンスボディを表示し、読み込まれたソースから呼び出し関数をgrepして、ファイルと行を提示します。


デーモンを直接実行する

node dist/cli.js                 # MCP over stdio (default)
node dist/cli.js --http          # Streamable HTTP on 127.0.0.1:7331/mcp
node dist/cli.js --tools         # print the tool surface and exit
node dist/cli.js --help

Flag

意味

--port N

HTTPポート(デフォルト7331; 0は空きポートを選ぶ)

--host HOST

HTTPバインドアドレス(デフォルト127.0.0.1公開しないでください

--profile NAME

自動起動ブラウザで使用されるプロファイル

--headless

ヘッドレスで自動起動。デフォルトは、あなたも使える表示可能なウィンドウ

--no-auto-launch

暗黙的に起動しない。browser.launchを必須にする

--log-level LEVEL

trace | debug | info | warn | error

環境変数: AGENTBROWSER_HOME, AGENTBROWSER_PORT, AGENTBROWSER_LOG_LEVEL, AGENTBROWSER_HEADLESS.

HTTPモードはループバックのみにバインドし、Originを検証します。このエンドポイントは完全なブラウザ制御であり、オープンウェブ上のページが到達できないようにする必要があります。


2つの設計ルール

1. まず記録し、後でクエリする

Chromiumがイベントをプッシュし、デーモンがそれを永続化します。事前に準備する必要はなく、モデルが考えている間もイベントを見逃しません。履歴はナビゲーション、タブを閉じる、デーモンの再起動を超えて存続します。

これは重要な設計です。コレクターはドメインを有効にするにCDPイベントにサブスクライブし、ターゲットマネージャーはインストルメンテーションが有効になるまでwaitForDebuggerOnStartで新しいターゲットを保持します。これにより、「リクエストを見逃さなかった」ということが可能性ではなく事実になります。

2. 大きなペイロードはコンテキストに入らない

200MBのレスポンスは、コンテンツアドレス可能なblobとして保存され、アーティファクトハンドルとして返されます。エージェントはartifact.searchartifact.read_lines、またはartifact.json_query(JSONPathのサブセット)でそれを読み取ります。トレース、ヒープスナップショット、DOMダンプ、コンソールエクスポートも同様です。

ツールは設計上、クエリファーストです。dom.get_htmlの前にdom.summarynetwork.list_requestsの前にnetwork.summarizejs.get_sourceの前にjs.search_sourceを使用します。


1つのブラウザ上の人間とAI

ブラウザはヘッド付きで、あなたのものです。browser.set_control_modeが調停します:

モード

意味

observe

AIはすべてを読み取り、何も変更しない

shared

両方が操作する(デフォルト)

agent

AIが入力を所有する

paused

AIは停止中。読み取りは引き続き機能する

すべての変更系ツールはこれをチェックします — 生のcdp.sendエスケープハッチも含みます。


ツールサーフェス

174のツール。node dist/cli.js --toolsで全リストが表示されます。

browser.*      list, launch, connect, status, list_targets, set_control_mode, close
page.*         navigate, screenshot, snapshot, click, type, press, scroll, extract_text,
               wait_for, highlight, dialogs, viewport, frames, tabs
dom.*          summary, query, inspect, get_html, set_html, set_attribute, remove, export
css.*          computed, matched_rules, set_style, stylesheets, explain_visibility
js.*           evaluate, list_scripts, get_source, search_source
console.*      query, exceptions, export, clear
network.*      list_requests, get_request, get_body, summarize, search_bodies,
               list_websockets, ws_messages, export_har, simulate, clear
storage.*      local/session, cookies, indexeddb, caches, usage, export
debugger.*     enable, breakpoints, pause, resume, step, call_frames,
               evaluate_on_frame, inspect_object, wait_for_pause
inspector.*    pick, picked, element, parents, children, snapshot, accessibility_tree
profile.*      start/stop/status (presets: cpu, slow-page, hang, memory-leak, full)
profiler.*     cpu, coverage, trace, long_tasks
memory.*       heap.snapshot, heap.compare, gc, usage
time.*         install, freeze, run, jump, resume, set_fixed_date, set_wall_clock, virtual
device.*       preset, viewport, orientation, reset
environment.*  timezone, locale, color_scheme, reduced_motion, vision, status, reset
fault.*        abort, delay, replace_response, drop_next, modify_headers, list, clear
artifact.*     list, stat, read, read_lines, search, json_query, export
cdp.send       escape hatch to any raw CDP method

テスト

npm test                      # build + live MCP suite + HTTP suite
npm run test:live             # 117 checks: real MCP client, real Chromium, local fixture
npm run test:live:headed      # same, with a visible window
npm run test:deep             # 35 checks against a real public site
npm run test:http             # Streamable HTTP transport + origin guard
npm run test:real             # headed narrated walkthrough on live sites

すべてのスイートは実際のサーバーを起動し、実際のMCPクライアントに接続します。アサーションはtools/callを通るため、スキーマ検証、ハンドラーの配線、操作が一緒にカバーされます。

それらは呼び出しが返ったことではなく、動作をアサートします:

  • 400のリクエストペイロードとレスポンスボディが両方とも読み取れること

  • 700KBのレスポンスが、インラインで約500文字のアーティファクトとして返ってくること

  • time.run("30m")が60秒間隔をちょうど30回発火させること。time.jump1回だけ発火させること

  • 一時停止中のコールフレームからローカル変数が読み取れることtotal=75tax=15

  • observeモードが読み取りを許可しつつ、3/3の変更を拒否すること

  • エクスポートされたHARが有効なHAR 1.2としてパースし直せること

  • ヒープスナップショットが実際の.heapsnapshotとして読み込めること

tests/deep-dive.mjsは、実際のHacker Newsに対して実行されます。h2/nginx/リモートIPの詳細を含む14件の実際のリクエストを記録し、34KBのレスポンスボディをワイヤーから読み取り、1285ノードのDOMSnapshot、1603ノードのアクセシビリティツリー、8MBのヒープ差分を検出します。


レイアウト

src/
  cdp/        persistent WebSocket, flat-session multiplexing
  browser/    launcher, target manager (auto-attach + debugger hold), registry, faults
  collect/    network, console, page and execution-context recorders
  store/      SQLite schema, blob store, artifact store
  ops/        the actual capabilities, independent of MCP
  mcp/        tool definitions and server wiring
  cli.ts      stdio / HTTP entry point
tests/        live MCP suites
scripts/      install-mcp.mjs

MCPはデーモンへの1つのインターフェースであり、デーモン自体ではありません。src/index.tsはコアをエクスポートするため、CLI、RESTレイヤー、テストハーネスが直接駆動できます。

データは~/.agent-browserにあります(移動するにはAGENTBROWSER_HOME): browserd.dbblobs/artifacts/profiles/logs/


セキュリティに関する注意

  • ループバックのみにバインドします。このエンドポイントは、ログイン中のセッションを保持するブラウザの完全な制御です。

  • ~/.agent-browser/profilesのブラウザプロファイルには、クッキーとセッショントークンが含まれます。記録されたボディには、訪問したページが返したものが含まれます。その両方がgitignoreされています。その状態を維持してください。

  • --net-log-capture-mode=Everythingは、ワイヤー上の生のバイトを含む可能性があります。自分が所有するトラフィックにのみ使用してください。

  • cdp.sendは無制限のCDPであり、制御モードによってのみ制限されます。


既知の制限

  • Debugger.setScriptSource ライブ編集は現在のChromiumには存在しません — ソースを編集してリロードしてください。

  • Network.getRequestPostData はマルチパートアップロードからファイルを省略することがあるため、「すべてのアップロードの全バイト」はそのパスだけでは保証されません。スタックレベルの詳細(DNS、ソケット、TLS)を得るには、capture_netlog を指定して起動してください。

  • 制御されたクロックは、addScriptToEvaluateOnNewDocument を介してインストールされるフェイクタイマーシムであり、デーモンが生のCDPを話すため、PlaywrightのClock APIではありません。time.virtual はChromium自身の仮想時間ポリシーを公開します。この2つを同じターゲットで組み合わせることはできず、デーモンはそれらを重ねることを拒否します。

  • タッチエミュレーションは意図的に Emulation.setEmitTouchEventsForMouse を設定しない: そのフラグはChromiumが Input.dispatchMouseEvent を恒久的に認識しなくさせるからです。代わりに page.click がタップを合成します。

  • ontouchstart in window はドキュメント作成時に決定されるため、リロード後に現れます。navigator.maxTouchPoints は即座にライブです。

  • Target.openDevTools (devtools.open) は実験的であり、一部のビルドはそれを拒否します。

  • センサーエミュレーションは実装されていません。生のプロセスメモリの読み書きは対象外です — それには別のデバッガアダプタが必要です。


ライセンス

MIT

-
license - not tested
-
quality - not tested
C
maintenance

Maintenance

Maintainers
Response time
Release cycle
Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Connectors

  • Live browser debugging for AI assistants — DOM, console, network via MCP.

  • A paid remote MCP for AI agent browser DevTools MCP, built to return verdicts, receipts, usage logs,

  • A paid remote MCP for AI agent browser MCP session, built to return verdicts, receipts, usage logs,

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/Kawai-Senpai/Browsered'

If you have feedback or need assistance with the MCP directory API, please join our Discord server