firefox-devtools-mcp

公式

Firefox DevTools 用の Model Context Protocol サーバー。リモートデバッグプロトコルを通じて、AIアシスタントがFirefoxブラウザを検査・制御できるようにします。

GitHub

507

Firefox DevTools MCPで何ができますか？

エージェント型ブラウジング — アシスタントにページの操作、フォームへの入力、take_snapshot、click_by_uid、fill_by_uid を使用した複数ステップのワークフローの完了を依頼します。
Web開発の検査 — アシスタントにページを読み込ませ、list_console_messages、list_network_requests、list_downloads を使用してコンソールメッセージ、ネットワークリクエスト、ダウンロードを検査させます。
JavaScriptの評価 — evaluate_script を使用してページコンテキストでカスタムスクリプトを実行し、データの抽出や機能のテストを行います。
スクリーンショットの取得 — screenshot_page を使用してページのスクリーンショットを要求し、必要に応じて saveTo パラメータを使用して大きな出力を直接ディスクに保存します。
ページ管理 — list_pages、select_page、navigate_page を使用して、開いているタブを切り替えたり、新しいURLに移動したりします。

ドキュメント

Firefox DevTools MCP

AIエージェントがFirefoxを使用できるようにするModel Context Protocolサーバーです。主なユースケースは2つあります：

エージェントによるブラウジング：エージェントがブラウザを使用して、ページの閲覧、フォームへの入力、Webサイトでの複数ステップのフロー実行などの通常のタスクを行います。
エージェント支援によるWeb開発：エージェントが作業中のページを読み込み、コンソール、ネットワークリクエスト、デバッガー、プロファイラーなどの開発者ツールでページを検査します。

WebDriver BiDi（Selenium WebDriver経由）を通じてFirefoxを制御し、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や保存されたセッションを含む）にアクセスできます。
訪問するサイトには注意してください。 ページはエージェントを操作するように設計されたコンテンツ（プロンプトインジェクション）を返すことができます。自分が管理または信頼するサイトに限定してください。
必要なツールモジュールのみを有効にしてください。 デフォルトのbasicプリセットにはすでにevaluate_scriptが含まれています。--tool-preset slimはそれを除外します。--tool-preset developer（デバッグ、ネットワーク、コンソール、プロファイラー）や--tool-preset mozilla（特権コンテキスト）などの上位プリセットは、エージェントが実行できることをさらに拡張します。

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

要件

Node.js ≥ 20.19.0
Firefox 100+がインストールされていること（自動検出、または--firefox-pathで指定）

Claude CodeまたはCodexでのインストールと使用（npx）

推奨：npxを使用して、npmから最新の公開バージョンを実行してください。

オプションA — CLI

Claude Code

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

Codex

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

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

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

オプションB — 設定ファイルを編集

Claude Code

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"
      }
    }
  }
}

Codex

~/.codex/config.tomlに追加：

[mcp_servers.firefox-devtools]
command = "npx"
args = ["-y", "@mozilla/firefox-devtools-mcp@latest", "--headless", "--viewport", "1280x720"]

[mcp_servers.firefox-devtools.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はそのパスのfirefox_devtools_mcp_profileサブフォルダーで実行され、.firefox-devtools-mcpファイルでマークされます。--profile-pathをマークされたプロファイルに向けると、それを直接再利用します
--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 — 既存接続モード用のMarionetteポート、デフォルトは2828（MARIONETTE_PORT）
--pref name=value — 起動時にmoz:firefoxOptions経由でFirefox設定を設定（繰り返し可能）
--tool-preset — 有効にするツールモジュールを選択：slim、basic（デフォルト）、developer、mozilla、またはall。ツールモジュールとプリセットを参照してください。（TOOL_PRESET）
--tools — 有効にするツールモジュールの明示的なリスト。--tool-presetを完全に上書きします（例：--tools pages network script）。ツールモジュールとプリセットを参照してください。
--enable-script — 非推奨。--tool-preset developerまたは--tools ... script debuggingを使用してください。 developerツールプリセットを選択します。（ENABLE_SCRIPT=true）
--enable-privileged-context — 非推奨。--tool-preset mozillaまたは--tools ... privileged prefsを使用してください。 mozillaツールプリセットを選択します。MOZ_REMOTE_ALLOW_SYSTEM_ACCESS=1が必要です（ENABLE_PRIVILEGED_CONTEXT=true）
--android-device — Firefox for Androidモードを有効化。値はADBデバイスシリアルです（例：emulator-5554）。接続されているデバイスを一覧表示するにはadb devicesを実行します。値を省略するかautoを使用すると、接続されている単一のデバイスが自動的に選択されます。
--android-wipe-app-data — Androidモードがターゲットアプリのすべてのデータを消去することを確認します。--android-deviceと一緒に必須です。（ANDROID_WIPE_APP_DATA=true）
--android-package — Androidアプリのパッケージ名。デフォルトはorg.mozilla.firefox。その他のパッケージ：Firefox Betaはorg.mozilla.firefox_beta、Firefox Nightlyはorg.mozilla.fenix、Firefox Nightly Debugはorg.mozilla.fenix.debug、geckoviewはorg.mozilla.geckoview_example（ANDROID_PACKAGE）
--unrestricted-save-paths — saveToパラメータがデフォルトのルートの代わりにディスク上の任意の場所に書き込めるようにします。大きな出力をディスクに保存するとSECURITY.mdのセキュリティに関する注記を参照してください。（UNRESTRICTED_SAVE_PATHS=true）
--log-file — MCPサーバーログをstderrの代わりにファイルに書き込みます。サーバー出力を隠すMCPクライアントでのデバッグセッションに役立ちます。DEBUG=*を設定すると、詳細なデバッグログも含まれます。例：--log-file /tmp/firefox-mcp.log

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

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

プリセット（それぞれが前のプリセットのスーパーセット）：

slim — ページの閲覧と操作に必要な最小限
basic（デフォルト）— 通常のブラウジング用のツールを追加
developer — Web開発者向けのツールを追加
mozilla — Firefox開発者向けのツールを追加
all — すべてのモジュール

モジュールのリストと各プリセットのモジュールについては、docs/tools.mdを参照してください。

デフォルトのbasicにはscriptが含まれ、したがってevaluate_scriptツールが含まれることに注意してください。攻撃対象領域への影響についてはSECURITY.mdを参照し、それを除外するには--tool-preset slimまたは明示的な--toolsリストを使用してください。

# Use the developer preset (adds network, console, debugging and profiler 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内部ビルドでのみ利用可能です。launchモジュールもMozilla内部ビルドが必要です。これは、呼び出し側が選択したバイナリ、プロファイル、環境、および設定セットの下でFirefoxを再起動するものであり、オペレーターが所有すべき設定変更です。代わりに--pref、--firefox-path、およびその他のコマンドラインオプションを使用してください。bidiモジュールもMozilla内部ビルドが必要です。これは任意のWebDriver BiDiコマンドを送信するため、他のモジュールが公開するものへのアクセスを提供します。公開パッケージは、要求された場合でもこれらのモジュールをスキップし、除外したモジュールの名前を記した警告をログに記録します。

便利な設定（`--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が必要です。

警告： Androidモードは、セッションの前にターゲットアプリのすべてのデータを消去します。タブ、履歴、ブックマーク、パスワード、Cookie、設定はすべて失われます。geckodriverはセッション作成時にadb shell pm clear <package>を実行し、それをスキップする方法はなく、その後、セッションは後で削除される独自の一時プロファイルで実行されます。このため、--android-deviceには--android-wipe-app-dataが必要であり、使用しているブラウザーを自動化するのではなく、自動化専用に構築されたビルドをインストールする必要があります。 Bug 2064088で、既存のアプリデータを保持するオプションをgeckodriverに追加する作業が追跡されています。

# List connected devices
adb devices

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

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

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

ホストとデバイス間のポート転送は、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などで保護されたサイトでボット検出がトリガーされる可能性があります。 MCP自動化が必要な場合にのみMarionetteを有効にし、その後はFirefoxを通常どおり再起動してください。

ツール概要

モジュールごとのツールの完全なリスト（説明とパラメータ付き、ソースから生成）については、docs/tools.mdを参照してください。

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

大きなツール出力は、Claude CodeなどのCLIクライアントでかなりのコンテキストを消費する可能性があります。いくつかのツールは、結果をインラインで返す代わりにファイルに書き込むオプションのsaveToパラメータを受け入れます。リストについてはdocs/tools.mdを参照してください。 saveToは次の3つの形式のいずれかを取ります：

ファイルパス（現在の作業ディレクトリからの相対パス、または~/.firefox-devtools-mcp/output内の絶対パス。親ディレクトリは作成されます）。Firefoxプロファイルに到達するパス、またはこのサーバーが読み戻すファイルは拒否されます
既存のディレクトリ（その中にタイムスタンプ付きファイルが生成されます）
true（~/.firefox-devtools-mcp/output/の下にタイムスタンプ付きファイルが生成されます）

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

テキストを生成するツールは、保存された出力のうちインラインで短い抜粋としてエコーバックする文字数であるpreviewも受け入れます。docs/tools.mdのリストは、どのツールがそれをサポートしているかを示しています。

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 セッションをセットアップするためです。以降の実行は高速になります。
古い UID: UID は、その要素が削除されるかページが移動するまで有効です。UID ツールが消えたと報告した場合は、新しいスナップショット（take_snapshot）を取得してください。
Windows 10: MCP サーバー 'firefox-devtools' の検出中にエラーが発生しました: MCP エラー -32000: 接続が閉じられました
- 解決策 1 cmd /c でラップします（詳細）:
```
"mcpServers": {
  "firefox-devtools": {
    "command": "cmd",
    "args": ["/c", "npx", "-y", "@mozilla/firefox-devtools-mcp@latest"]
  }
}
```
- 解決策 2 npx への絶対パスを使用します（拡張子を調整 — .cmd、.bat、.exe、または .ps1 — を設定に合わせて変更してください）:
```
"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 のいずれかを選択してライセンスされています。

firefox-devtools-mcp

Firefox DevTools MCPで何ができますか？

ドキュメント

Firefox DevTools MCP

セキュリティ

要件

Claude CodeまたはCodexでのインストールと使用（npx）

オプションA — CLI

Claude Code

Codex

オプションB — 設定ファイルを編集

Claude Code

Codex

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

MCP Inspectorで試す

CLIオプション

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

便利な設定（--pref）

Firefox for Android

既存のFirefoxに接続

ツール概要

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

ローカル開発

トラブルシューティング

バージョン管理

コントリビューション

作者

ライセンス

便利な設定（`--pref`）