
Firefox DevTools 用の Model Context Protocol サーバー - AI アシスタントが WebDriver BiDi を通じて Firefox ブラウザを検査および制御できるようにします
# Firefox DevTools MCP
[](https://www.npmjs.com/package/@mozilla/firefox-devtools-mcp)
[](https://github.com/mozilla/firefox-devtools-mcp/actions/workflows/ci.yml)
[](https://codecov.io/gh/mozilla/firefox-devtools-mcp)
[](LICENSE-MIT) [](LICENSE-APACHE)
<a href="https://glama.ai/mcp/servers/@mozilla/firefox-devtools-mcp"><img src="https://assets.kitploit.com/production/public/readmes/8655/a78a7d97ae218a4638aa3f14a824feef8d0e205b36490113ed8fa15dac83148a.png" height="223" alt="Glama"></a>
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 や保存済みセッションを含む)にアクセスできます。
- **アクセスするサイトには注意してください。** ページはエージェントを操作するように設計されたコンテンツ(プロンプトインジェクション)を返す可能性があります。自分が管理または信頼するサイトに限定してください。
- **必要なツールモジュールのみを有効にしてください。** デフォルトの `basic` プリセットには既に `evaluate_script` が含まれています。`--tool-preset slim` でそれを除外できます。`--tool-preset developer`(デバッグ、ネットワーク、コンソール、プロファイラー)や `--tool-preset mozilla`(特権コンテキスト)などの上位プリセットは、エージェントが実行できる範囲をさらに拡大します。
リスクの完全な内訳と脆弱性の報告方法については、[SECURITY.md](https://github.com/mozilla/firefox-devtools-mcp/blob/main/SECURITY.md) を参照してください。
## 要件
- Node.js ≥ 20.19.0
- Firefox 100+ がインストールされていること(自動検出、または `--firefox-path` で指定)
## Claude Code または Codex でのインストールと使用(npx)
推奨: `npx` を使用して、npm から公開されている最新バージョンを実行してください。
### オプション A — CLI
#### Claude Code
```bash
claude mcp add firefox-devtools npx @mozilla/firefox-devtools-mcp@latest
# 引数によるヘッドレス + ビューポート
claude mcp add firefox-devtools npx @mozilla/firefox-devtools-mcp@latest -- --headless --viewport 1280x720
# または環境変数による指定
claude mcp add firefox-devtools npx @mozilla/firefox-devtools-mcp@latest \
--env START_URL=https://example.com \
--env FIREFOX_HEADLESS=true
```
#### Codex
```bash
codex mcp add firefox-devtools -- npx @mozilla/firefox-devtools-mcp@latest
# 引数によるヘッドレス + ビューポート
codex mcp add firefox-devtools -- \
npx @mozilla/firefox-devtools-mcp@latest -- --headless --viewport 1280x720
# または環境変数による指定
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 に追加:
```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 に追加:
```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 — ヘルパースクリプト(ローカル開発ビルド)
```bash
npm run setup
# Claude Code を選択。スクリプトが JSON を適切なパスに保存します
```
## MCP Inspector で試す
```bash
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(`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](https://github.com/mozilla/firefox-devtools-mcp/blob/main/SECURITY.md) のセキュリティに関する注記を参照してください。(`UNRESTRICTED_SAVE_PATHS=true`)
- `--log-file` — MCP サーバーのログを stderr の代わりにファイルに書き込みます。サーバー出力を隠す MCP クライアントでのデバッグセッションに便利です。詳細なデバッグログも含めるには `DEBUG=*` を設定してください。例: `--log-file /tmp/firefox-mcp.log`
### ツールモジュールとプリセット
ツールはモジュールにグループ化されています。名前付きプリセット(`--tool-preset`)または明示的なリスト(`--tools`)のいずれかで公開するモジュールを選択します。両方が指定された場合、`--tools` が優先され、プリセットは無視されます。
モジュール: `pages`、`snapshot`、`input`、`network`、`console`、`screenshot`、`downloads`、
`utilities`、`management`、`webextension`、`profiler`、`screencast`、`script`、`debugging`、
`prefs`、`privileged`。
プリセット(それぞれが前のプリセットのスーパーセット):
- `slim` — `pages`、`snapshot`、`input`、`screenshot`
- `basic`(デフォルト) — `slim` に加えて `downloads`、`script`、`utilities`、`management`、`webextension`、`screencast`
- `developer` — `basic` に加えて `debugging`、`network`、`console`、`profiler`
- `mozilla` — `developer` に加えて `prefs`、`privileged`
- `all` — すべてのモジュール
デフォルトの `basic` には `script` が含まれ、したがって `evaluate_script` ツールが含まれることに注意してください。攻撃対象領域への影響については [SECURITY.md](https://github.com/mozilla/firefox-devtools-mcp/blob/main/SECURITY.md#tool-modules-and-presets) を参照し、それを除外するには `--tool-preset slim` または明示的な `--tools` リストを使用してください。
```bash
# developer プリセットを使用(network、console、debugging、profiler ツールを追加)
npx @mozilla/firefox-devtools-mcp --tool-preset developer
# 必要なモジュールのみを有効化
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](https://searchfox.org/firefox-main/source/remote/shared/RecommendedPreferences.sys.mjs) が適用されます。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` が必要であり、使用している
> ブラウザーを自動化するのではなく、自動化専用のビルドをインストールする必要があります。
> 既存のアプリデータを保持するオプションを geckodriver に追加する作業は
> [Bug 2064088](https://bugzilla.mozilla.org/show_bug.cgi?id=2064088) で追跡されています。
```bash
# 接続されているデバイスを一覧表示
adb devices
# 接続されている単一のデバイスで Firefox for Android を起動
npx @mozilla/firefox-devtools-mcp --android-device auto --android-wipe-app-data
# 特定のデバイスをターゲットにする
npx @mozilla/firefox-devtools-mcp --android-device <serial> --android-wipe-app-data
# 代わりに Firefox Nightly を使用
npx @mozilla/firefox-devtools-mcp --android-device <serial> --android-package org.mozilla.fenix --android-wipe-app-data
```
ホストとデバイス間のポート転送は geckodriver によって自動的に処理されます。
### 既存の Firefox に接続
`--connect-existing` を使用して、Cookie、ログイン、開いているタブを保持したまま実際のブラウジングセッションを自動化します:
```bash
# Marionette と Remote Agent(BiDi)で Firefox を起動
firefox --marionette --remote-debugging-port
# MCP サーバーを実行
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](https://github.com/mozilla/firefox-devtools-mcp/blob/main/docs/tools.md) を参照してください。
- Pages: list/new/navigate/select/close/get_page_text(get_page_text はオプションの `saveTo` をサポート)
- Snapshot/UID: take/resolve/clear(take はオプションの `saveTo` をサポート)
- Input: click/hover/fill/drag/upload/form fill/press_key/type_text
- Network: list/get(ID 優先、フィルター、常時キャプチャ。両方ともオプションの `saveTo` をサポート)
- Downloads: list_downloads/clear_downloads(常時キャプチャ)、set_download_behavior(allow/deny/default)
- Console: list/clear(list はオプションの `saveTo` をサポート)
- Screenshot: page/by uid(CLI 環境用のオプションの `saveTo` 付き)
- Script: evaluate_script(分離レルム用のオプションの `sandbox`。大きな結果用のオプションの `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
- Firefox Preferences: get_firefox_prefs、set_firefox_prefs(`MOZ_REMOTE_ALLOW_SYSTEM_ACCESS=1` が必要)
- 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`、`get_page_text`、
`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` ツールでコンテキストサイズに影響を与えずに表示できます。
## ローカル開発
```bash
npm install
npm run build
# ローカルビルドで Inspector を実行
npx @modelcontextprotocol/inspector node dist/index.js --headless --viewport 1280x720
# またはホットリロード付きで開発実行
npm run inspector:dev
```
ローカル開発、テスト、CI の詳細については [CONTRIBUTING.md](https://github.com/mozilla/firefox-devtools-mcp/blob/main/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 error -32000: Connection closed
- **解決策 1** `cmd /c` でラップする([詳細](https://github.com/modelcontextprotocol/servers/issues/1082#issuecomment-2791786310)):
```json
"mcpServers": {
"firefox-devtools": {
"command": "cmd",
"args": ["/c", "npx", "-y", "@mozilla/firefox-devtools-mcp@latest"]
}
}
```
- **解決策 2** `npx` の絶対パスを使用する(拡張子 — `.cmd`、`.bat`、`.exe`、または `.ps1` — を環境に合わせて調整):
```json
"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](https://github.com/mozilla/firefox-devtools-mcp/blob/main/CONTRIBUTING.md) を参照してください。
## 作者
[Mozilla](https://www.mozilla.org) によってメンテナンスされています。
## ライセンス
お好みに応じて [MIT](https://github.com/mozilla/firefox-devtools-mcp/blob/main/LICENSE-MIT) または [Apache 2.0](https://github.com/mozilla/firefox-devtools-mcp/blob/main/LICENSE-APACHE) のいずれかでライセンス供与されます。