Firefox DevTools MCP — MCP-сервер для Claude Code: обзор
Управляет браузером Firefox через протокол MCP для отладки фронтенда, чтения страниц, снятия скриншотов и отправки веб-форм силами ИИ-агента.
claude mcp add --env FIREFOX_HEADLESS=<FIREFOX_HEADLESS> --env START_URL=<START_URL> --transport stdio firefox-devtools-mcp -- npx -y @mozilla/firefox-devtools-mcpЧто делает Firefox DevTools MCP
Сервер связывает ассистента с браузером через протокол WebDriver BiDi на базе Selenium WebDriver. Агент открывает вкладки, считывает консоль, проверяет сетевые запросы и взаимодействует с интерактивными элементами через DOM-снапшоты. Доступны разные пресеты инструментов: базовый basic, урезанный slim без исполнения произвольных скриптов и расширенный developer для глубокой отладки.
Для запуска сервер требует локально установленный Firefox от 100-й версии и Node.js не ниже 20.19.0. Облачный запуск без браузера не сработает: мосту нужен прямой доступ к бинарному файлу или контейнеру Docker. Безопаснее запускать его с отдельным изолированным профилем через --profile-path, чтобы агент не читал личные куки из основной сессии.
Какие задачи решает
- Отладить логику интерфейса и перехватить ошибки в консоли браузера
- Проверить статус исходящих сетевых запросов и ответы сервера
- Заполнить веб-формы на странице и пройти тестовый сценарий
- Снять скриншот веб-страницы в заданном разрешении
Примеры запросов агенту
- Открой страницу
https://example.comи проверь консоль на ошибки JavaScript - Сделай снимок страницы с разрешением 1280x720 и покажи результат
- Заполни поля на странице и выведи список сетевых запросов после клика
Как установить Firefox DevTools MCP
Командой платформы
claude mcp add --env FIREFOX_HEADLESS=<FIREFOX_HEADLESS> --env START_URL=<START_URL> --transport stdio firefox-devtools-mcp -- npx -y @mozilla/firefox-devtools-mcpВместо <…> подставьте свои значения
Командой платформы
codex mcp add firefox-devtools-mcp --env FIREFOX_HEADLESS=<FIREFOX_HEADLESS> --env START_URL=<START_URL> -- npx -y @mozilla/firefox-devtools-mcpВместо <…> подставьте свои значения
Файл настроек
{
"mcpServers": {
"firefox-devtools-mcp": {
"command": "npx",
"args": [
"-y",
"@mozilla/firefox-devtools-mcp"
],
"env": {
"FIREFOX_HEADLESS": "<FIREFOX_HEADLESS>",
"START_URL": "<START_URL>"
}
}
}
}Вместо <…> подставьте свои значения
Файл настроек
{
"servers": {
"firefox-devtools-mcp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@mozilla/firefox-devtools-mcp"
],
"env": {
"FIREFOX_HEADLESS": "<FIREFOX_HEADLESS>",
"START_URL": "<START_URL>"
}
}
}
}Вместо <…> подставьте свои значения
Командой платформы
gemini mcp add -e FIREFOX_HEADLESS=<FIREFOX_HEADLESS> -e START_URL=<START_URL> firefox-devtools-mcp npx -y @mozilla/firefox-devtools-mcpВместо <…> подставьте свои значения
По шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о Firefox DevTools MCP
Как установить Firefox DevTools MCP в Claude Code?
Выполните команду claude mcp add firefox-devtools-mcp -- npx -y @mozilla/firefox-devtools-mcp. Для headless-режима передайте флаги окружения: `claude mcp add --env FIREFOX_HEADLESS=<FIREFOX_HEADLESS> --env START_URL=<START_URL> --transport stdio firefox-devtools-mcp -- npx -y @mozilla/firefox-devtools-mcp`.
Что делает Firefox DevTools MCP?
Сервер даёт модели доступ к Firefox через WebDriver BiDi для перехода по ссылкам, кликов по кнопкам, анализа консоли, сетевого трафика и создания снимков экрана.
Какие требования нужны для работы сервера?
Нужны среда Node.js от версии 20.19.0 и установленный браузер Firefox версии 100 или новее. Если бинарный файл лежит в нестандартном каталоге, путь к нему передаётся аргументом --firefox-path.
