Firefox DevTools MCP

Model Context Protocol server that lets AI agents use Firefox. It has two main use cases:

• Agentic browsing: the agent uses the browser for regular tasks, such as reading pages, filling forms and going through multi-step flows on websites.
• Agent-assisted web development: the agent loads the page you are working on and inspects it with developer tools, such as the console, network requests, the debugger and the profiler.

It controls Firefox through WebDriver BiDi (via Selenium WebDriver) and works with Claude Code, Claude Desktop, Cursor, Cline and other MCP clients.

Repository: https://github.com/mozilla/firefox-devtools-mcp

Note: This MCP server requires a local Firefox browser installation and cannot run on cloud hosting services like glama.ai. Use npx @mozilla/firefox-devtools-mcp@latest to run locally, or use Docker with the provided Dockerfile.

Security

Browser MCP servers carry inherent risks. A few key practices:

• Use a dedicated Firefox profile. Never run the server against your regular profile — the agent has access to whatever the browser can reach, including cookies and saved sessions.
• Be cautious about which sites you visit. Pages can return content designed to manipulate the agent (prompt injection). Stick to sites you control or trust.
• Enable only the tool modules you need. The default basic preset already includes evaluate_script; --tool-preset slim drops it. Higher presets such as --tool-preset developer (debugging, network, console, profiler) and --tool-preset mozilla (privileged context) expand what the agent can do further.

See SECURITY.md for a full breakdown of risks and how to report vulnerabilities.

Requirements

• Node.js ≥ 20.19.0
• Firefox 100+ installed (auto‑detected, or pass --firefox-path)

Install and use with Claude Code or Codex (npx)

Recommended: use npx so you run the latest published version from npm.

Option 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

Option B — Edit the configuration file

Claude Code

Add to Claude Code’s mcp_settings.json:

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

Codex

Add to ~/.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"

Option C — Helper script (local dev build)

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

Try it with MCP Inspector

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

Then call tools like:

• list_pages, select_page, navigate_page
• take_snapshot then click_by_uid / fill_by_uid
• list_network_requests (always‑on capture), get_network_request
• list_downloads (always‑on capture), set_download_behavior
• screenshot_page, list_console_messages

CLI options

You can pass flags or environment variables (names on the right):