firefox-devtools-mcp

🥈Silver

Model Context Protocol server for Firefox DevTools. Enables AI assistants to inspect and control Firefox browser through the Remote Debugging Protocol. Useful for operations teams automating browser tasks, testing, and debugging. Integrates with Claude AI agents.

9850Updated 2mo ago

Intermediate30min to implementautomation

Saves ~180 min per use

Quick InstallView Source

git clone https://github.com/freema/firefox-devtools-mcp.git

Works with:

Claude

Overview

About This Skill

Firefox DevTools MCP is a Model Context Protocol server that lets AI assistants automate and control Firefox browsers using WebDriver BiDi through Selenium WebDriver. It runs locally on your machine—requiring Node.js 20.19.0+ and Firefox 100+—and integrates with Claude Code, Claude Desktop, Cursor, Cline, and other MCP clients. The server provides tools to navigate pages, take snapshots, interact with elements by ID, capture network requests, inspect console messages, and execute JavaScript in page context. It supports advanced features like Firefox for Android automation, connection to existing Firefox sessions with preserved cookies and logins, and privileged context access for managing Firefox preferences and extensions. Security is built in: the README emphasizes using a dedicated Firefox profile, being cautious about visited sites to avoid prompt injection, and avoiding unnecessary privilege flags. Operations teams, QA engineers, and developers benefit from automating browser tasks, testing workflows, and debugging without manual intervention.

How to Use

["Install the Firefox DevTools MCP server and ensure Firefox is running with remote debugging enabled (about:config > devtools.chrome.enabled = true).","In your AI assistant (e.g., Claude), load the MCP server module for Firefox DevTools.","Use the prompt template to construct your task. Replace [TASK], [URL], [CSS_SELECTOR], or [API_ENDPOINT] with your specific requirements.","Execute the task and review the structured output. For debugging, focus on the 'inspect_network_request' or 'inspect_dom' actions to identify issues.","Iterate by refining selectors or filters based on the output. Use the 'timestamp' fields to track changes between runs."]

Use Cases

Automate browser testing workflows and verify page behavior across different viewports

Capture network requests and console output for debugging web applications

Interact with web pages programmatically—click elements, fill forms, navigate URLs

Automate Firefox on Android devices for mobile testing via ADB

Setup & Installation

Quick Install

No install command available. Check the GitHub repository for manual installation instructions.

Alternative Install (Git Clone)

git clone https://github.com/freema/firefox-devtools-mcp

Requirements

Claude Code or compatible AI agent
Works with: Claude

Quick Start Guide

Install the Skill

Copy the install command above and run it in your terminal.

Open Your AI Agent

Launch Claude Code, Cursor, or your preferred AI coding agent.

Try It Out

Use the prompt template or examples below to test the skill.

Customize

Adapt the skill to your specific use case and workflow.

Usage Examples

Prompt Template

Use the Firefox DevTools MCP server to [TASK] in Firefox. For example: 'Open a new tab in Firefox, navigate to [URL], and inspect the DOM element with selector [CSS_SELECTOR].' Or: 'Debug the network request for [API_ENDPOINT] in the current tab and report the response headers.'

Example Output

```json
{
  "status": "success",
  "actions": [
    {
      "action": "new_tab",
      "timestamp": "2024-05-15T14:30:22Z",
      "result": "Tab opened successfully (Tab ID: 3)"
    },
    {
      "action": "navigate",
      "url": "https://example.com/api/users",
      "timestamp": "2024-05-15T14:30:25Z",
      "result": "Navigation completed. Status: 200 OK"
    },
    {
      "action": "inspect_network_request",
      "filter": "url=https://example.com/api/users",
      "timestamp": "2024-05-15T14:30:28Z",
      "result": {
        "request_id": "12345.67",
        "method": "GET",
        "status": 200,
        "response_time_ms": 142,
        "headers": {
          "content-type": "application/json",
          "cache-control": "no-cache"
        },
        "response_body": {
          "users": [
            {"id": 1, "name": "Alice", "role": "admin"},
            {"id": 2, "name": "Bob", "role": "user"}
          ]
        }
      }
    }
  ],
  "summary": "Successfully debugged the network request for https://example.com/api/users. Identified 2 users in the response. No errors detected."
}
```