Firefox DevTools MCP

WebDriver BiDi (Selenium WebDriver 経由) で Firefox を自動化するための Model Context Protocol サーバーです。Claude Code、Claude Desktop、Cursor、Cline などの MCP クライアントで動作します。

リポジトリ: https://github.com/mozilla/firefox-devtools-mcp

注意: この MCP サーバーはローカルへの Firefox ブラウザーのインストールが必要で、glama.ai のようなクラウドホスティングサービスでは実行できません。ローカルで実行するには npx @mozilla/firefox-devtools-mcp@latest を使用するか、提供されている Dockerfile で Docker を使用してください。

セキュリティ

ブラウザー MCP サーバーには本質的なリスクが伴います。重要なプラクティスをいくつか示します:

• 専用の Firefox プロファイルを使用する。 通常のプロファイルに対してサーバーを実行しないでください。エージェントはブラウザーが到達できるすべてのもの (Cookie や保存済みセッションを含む) にアクセスできます。
• 訪問するサイトには注意する。 ページはエージェントを操作するように設計されたコンテンツ (プロンプトインジェクション) を返す可能性があります。自分が管理している、または信頼するサイトだけに留めてください。
• 必要なツールモジュールのみを有効にする。 --tool-preset developer (script、debugging) や --tool-preset mozilla (privileged context) のような上位のプリセットは、エージェントが実行できることを大幅に拡張します。

リスクの完全な内訳と脆弱性の報告方法については、SECURITY.md を参照してください。

要件

• Node.js ≥ 20.19.0
• Firefox 100+ がインストールされていること (自動検出されます。または --firefox-path を指定します)

Claude Code (npx) でのインストールと使用

推奨: npx を使用すると、npm から公開されている最新バージョンを常に実行できます。

オプション A — Claude Code CLI

claude mcp add firefox-devtools npx @mozilla/firefox-devtools-mcp@latest

オプションは引数または環境変数として渡します。例:

# Headless + viewport via args
claude mcp add firefox-devtools npx @mozilla/firefox-devtools-mcp@latest -- --headless --viewport 1280x720

# Or via environment variables
claude mcp add firefox-devtools npx @mozilla/firefox-devtools-mcp@latest \
  --env START_URL=https://example.com \
  --env FIREFOX_HEADLESS=true

オプション B — Claude Code 設定 JSON を編集

Claude Code の設定ファイルに追加します:

• macOS: ~/Library/Application Support/Claude/Code/mcp_settings.json
• Linux: ~/.config/claude/code/mcp_settings.json
• Windows: %APPDATA%\Claude\Code\mcp_settings.json

{
  "mcpServers": {
    "firefox-devtools": {
      "command": "npx",
      "args": ["-y", "@mozilla/firefox-devtools-mcp@latest", "--headless", "--viewport", "1280x720"],
      "env": {
        "START_URL": "about:blank"
      }
    }
  }
}

オプション C — ヘルパースクリプト (ローカル開発ビルド)

npm run setup
# Choose Claude Code; the script saves JSON to the right path

MCP Inspector で試す

npx @modelcontextprotocol/inspector npx @mozilla/firefox-devtools-mcp@latest --start-url https://example.com --headless

次のようなツールを呼び出せます:

• list_pages、select_page、navigate_page
• take_snapshot の後に click_by_uid / fill_by_uid
• list_network_requests (常時キャプチャ)、get_network_request
• list_downloads (常時キャプチャ)、set_download_behavior
• screenshot_page、list_console_messages

CLI オプション

フラグまたは環境変数 (右側の名前) を渡すことができます:

• --firefox-path — Firefox バイナリの絶対パス
• --headless — UI なしで実行 (FIREFOX_HEADLESS=true)
• --viewport 1280x720 — 初期ウィンドウサイズ
• --profile-path — 特定の Firefox プロファイルを使用
• --firefox-arg — 追加の Firefox 引数 (繰り返し指定可能)
• --start-url — 起動時にこの URL を開く (START_URL)
• --accept-insecure-certs — TLS エラーを無視 (ACCEPT_INSECURE_CERTS=true)
• --connect-existing — 新しい Firefox を起動する代わりに、既に実行中の Firefox に接続 (CONNECT_EXISTING=true)
• --marionette-port — connect-existing モード用の Marionette ポート。デフォルトは 2828 ()

ツールモジュールとプリセット

ツールはモジュールにグループ化されています。公開するモジュールは、名前付きプリセット (--tool-preset) か明示的なリスト (--tools) のどちらかで選択します。両方が指定された場合は --tools が優先され、プリセットは無視されます。

モジュール: pages、snapshot、input、network、console、screenshot、utilities、management、webextension、profiler、screencast、script、debugging、prefs、privileged。

プリセット (それぞれが前のプリセットのスーパーセット):

• slim — pages、snapshot、input、network、console
• basic (デフォルト) — slim に加えて screenshot、utilities、management、webextension、profiler、screencast
• developer — basic に加えて 、

# Use the developer preset (adds script and debugging tools)
npx @mozilla/firefox-devtools-mcp --tool-preset developer

# Enable only the modules you need
npx @mozilla/firefox-devtools-mcp --tools pages network console

prefs と privileged モジュールは MOZ_REMOTE_ALLOW_SYSTEM_ACCESS=1 を必要とし、Mozilla 内部ビルドでのみ利用できます。公開パッケージでは、要求された場合でもこれらは静かにスキップされます。

便利な設定 (--pref)

• remote.prefs.recommended=false。Firefox が自動化で実行される場合、テスト用にブラウザーの動作を変更する RecommendedPreferences が適用されます。remote.prefs.recommended を false に設定すると、これらをスキップして通常の Firefox インスタンスに近い構成になります。
• remote.log.level=Trace。Firefox で詳細な WebDriver プロトコルログを有効にします。MCP サーバーは一致するログレベルを geckodriver に自動的に渡すため、両方の側が同じ冗長レベルでログを出力します。
• app.update.disabledForTesting=false。Firefox が更新を自動的にダウンロードして適用できるようにします。更新によりセッションが中断される可能性があることに注意してください。remote.prefs.recommended=false の設定も必要です。

Firefox for Android

--android-device を使用すると、Android デバイス上で実行されている Firefox を自動化できます。PATH に adb が必要です。geckodriver は自動的に管理されます。

# List connected devices
adb devices

# Launch Firefox for Android on the single connected device
npx @mozilla/firefox-devtools-mcp --android-device auto

# Target a specific device
npx @mozilla/firefox-devtools-mcp --android-device <serial>

# Use Firefox Nightly instead
npx @mozilla/firefox-devtools-mcp --android-device <serial> --android-package org.mozilla.fenix

ホストとデバイス間のポートフォワーディングは、geckodriver によって自動的に処理されます。

既存の Firefox に接続

--connect-existing を使用すると、Cookie、ログイン、開いているタブを保持したまま、実際のブラウジングセッションを自動化できます:

# Start Firefox with Marionette and the Remote Agent (BiDi)
firefox --marionette --remote-debugging-port

# Run the MCP server
npx @mozilla/firefox-devtools-mcp --connect-existing --marionette-port 2828

MCP は WebDriver Classic (--marionette) と WebDriver BiDi (--remote-debugging-port) の両方を使用するため、両方のフラグが必要です。Firefox が --marionette のみで起動された場合、MCP サーバーは接続に失敗し、両方のフラグを付けて Firefox を再起動するよう求めます。

警告: 通常のブラウジング中は Marionette を有効にしたままにしないでください。navigator.webdriver = true が設定され、他のブラウザーフィンガープリントシグナルも変更されるため、Cloudflare、Akamai などで保護されたサイトでボット検出がトリガーされる可能性があります。Marionette は MCP 自動化が必要なときだけ有効にし、その後は Firefox を通常どおり再起動してください。

ツール概要

• Pages: list/new/navigate/select/close
• Snapshot/UID: take/resolve/clear (take はオプションの saveTo をサポート)
• Input: click/hover/fill/drag/upload/form fill <<<<<<< HEAD
• Network: list/get (ID 優先、フィルター、常時キャプチャ。両方ともオプションの saveTo をサポート)
• Console: list/clear (list はオプションの saveTo をサポート) =======
• Network: list/get (ID 優先、フィルター、常時キャプチャ)
• Downloads: list_downloads/clear_downloads (常時キャプチャ)、set_download_behavior (allow/deny/default)
• Console: list/clear

6873767 (Bug 2055949 - [firefox-devtools-mcp] expose download events to firefox devtools mcp)

• Screenshot: page/by uid (CLI 環境向けのオプションの saveTo 付き)
• Script: evaluate_script (大きな結果向けのオプションの saveTo 付き)
• Privileged Context: 特権 ("chrome") コンテキストの list/select、evaluate_privileged_script (MOZ_REMOTE_ALLOW_SYSTEM_ACCESS=1 が必要)
• WebExtension: install_extension、uninstall_extension、list_extensions (list には MOZ_REMOTE_ALLOW_SYSTEM_ACCESS=1 が必要)
• Firefox Management: get_firefox_info、get_firefox_output、restart_firefox、set_firefox_prefs、get_firefox_prefs
• Profiler: profiler_is_active、profiler_start (プリセットまたは明示的な設定)、profiler_stop (プロファイルをダウンロードディレクトリに保存)
• Screencast: screencast_start (ページのビューポートをダウンロードディレクトリ内のビデオファイルに録画します)、screencast_stop (Firefox 154+ が必要)
• Utilities: accept/dismiss dialog、history back/forward、set viewport

大きな出力をディスクに保存

大きなツール出力は、Claude Code のような CLI クライアントで大量のコンテキストを消費する可能性があります。screenshot_page、screenshot_by_uid、take_snapshot、list_console_messages、list_network_requests、get_network_request、evaluate_script、evaluate_privileged_script ツールは、結果をインラインで返す代わりにファイルに書き込むオプションの saveTo パラメータを受け入れます。saveTo は次の 3 つの形式のいずれかを取ります:

• ファイルパス (現在の作業ディレクトリからの相対パス、または ~/.firefox-devtools-mcp 内の絶対パス。親ディレクトリは作成されます)
• 既存のディレクトリ (その中にタイムスタンプ付きのファイルが生成されます)
• true (~/.firefox-devtools-mcp/output/ の下にタイムスタンプ付きのファイルが生成されます)

レスポンスはパスとバイトサイズを返します。保存されたファイルは常に完全で切り詰められていないデータを保持します。インラインのサイズ保護 (コンソールメッセージの上限、ネットワークヘッダーの切り詰め、スナップショットの行数上限) はファイルには適用されません。

テキストを生成するツール (スクリーンショット以外のすべて) は、保存された出力のうち、短い抜粋としてインラインでエコーバックする文字数を指定する preview も受け入れます。スクリーンショットにはプレビューはありません。

screenshot_page({ saveTo: "page.png" })
take_snapshot({ saveTo: true })
list_network_requests({ urlContains: "api", saveTo: "network.json" })
evaluate_script({ function: "() => performance.getEntries()", saveTo: true, preview: 2000 })

デフォルトでは、保存パスは制限されています。相対パスは現在の作業ディレクトリに対して解決され、絶対パスは ~/.firefox-devtools-mcp 内でのみ許可されます。これらの場所から外れるパスは拒否されます。そのディレクトリ外の絶対パスを含む任意の場所に書き込むには、--unrestricted-save-paths を指定してサーバーを起動します。

保存されたファイルは、コンテキストサイズに影響を与えずに Claude Code の Read ツールで表示できます。

ローカル開発

npm install
npm run build

# Run with Inspector against local build
npx @modelcontextprotocol/inspector node dist/index.js --headless --viewport 1280x720

# Or run in dev with hot reload
npm run inspector:dev

ローカル開発、テスト、CI の詳細については、CONTRIBUTING.md を参照してください。

トラブルシューティング

• Firefox が見つからない場合: --firefox-path "/Applications/Firefox.app/Contents/MacOS/firefox" (macOS) またはお使いの OS の正しいパスを指定してください。
• 初回実行は遅い: Selenium が BiDi セッションをセットアップするためです。2 回目以降の実行は速くなります。
• ナビゲーション後に UID が失効する: UID ツールを使用する前に、新しいスナップショット (take_snapshot) を取得してください。
• Windows 10: MCP サーバー 'firefox-devtools' の検出中にエラー: MCP error -32000: Connection closed

  • 解決策 1 cmd /c でラップする (詳細):

    root@kitploit:~

    "mcpServers": {
      "firefox-devtools": {
        "command": "cmd",
        "args": ["/c", "npx", "-y", "@mozilla/firefox-devtools-mcp@latest"]
      }
    }
    

  • 解決策 2 npx の絶対パスを使用する (環境に合わせて拡張子 — .cmd、.bat、.exe、.ps1 — を調整してください):

    root@kitploit:~

    "mcpServers": {
      "firefox-devtools": {
        "command": "C:\\nvm4w\\nodejs\\npx.ps1",
        "args": ["-y", "@mozilla/firefox-devtools-mcp@latest"]
      }
    }
    

バージョニング

• 1.0 より前の API: バージョンは 0.x から始まります。最新リリースには npx で @latest を使用してください。

コントリビューション

問題の報告方法、テストの実行方法、プロジェクトへのローカルでの貢献方法については、CONTRIBUTING.md を参照してください。

作者

Mozilla によってメンテナンスされています。

ライセンス

MIT または Apache 2.0 のいずれかを選択してライセンス供与されます。