Chrome DevTools MCP

Chrome DevTools MCP

ChromeDevToolsApache-2.0
42.7k звёзд2.7k форков
Chrome DevTools MCP — это сервер, который подключает AI-ассистента к живому браузеру Chrome. Он работает через протокол MCP и даёт модели (Claude, Cursor, Copilot, Antigravity) управлять браузером так, как это делает разработчик через инструменты разработчика. Вы можете поручить ассистенту открыть страницу, проверить консоль на ошибки, оценить скорость загрузки или сделать скриншот. Сервер использует Puppeteer для надёжного управления браузером и Chrome DevTools для глубокой отладки.
ChromeBrowser
Открыть на GitHub

Установка

npx -y chrome-devtools-mcp

Характеристики

Общее

  • СтатусСообщество
  • РазработчикChromeDevTools
  • ЛицензияApache-2.0

Технологии

  • Языки
    TypeScript
  • Транспорт
    stdio

Описание

Возможности

  • Открывает URL и управляет вкладками браузера — навигация, обновление, закрытие.
  • Анализирует производительность: запись трассировок, поиск узких мест и медленных запросов.
  • Просматривает и анализирует сетевые запросы, заголовки и ответы.
  • Делает скриншоты видимой области страницы или отдельных элементов.
  • Читает сообщения из консоли браузера с трассировкой стека (source-mapped stack traces).
  • Взаимодействует с HTML-кодом страницы: поиск элементов, чтение текста, атрибутов.
  • Собирает полевые данные о производительности через интеграцию с CrUX.
  • Автоматически ждёт завершения загрузки страницы и выполнения скриптов перед следующим действием.

Как подключить

Установка выполняется через npm без скачивания пакета:

npx -y chrome-devtools-mcp

Добавьте сервер в конфигурацию вашего MCP-клиента. Пример для Claude Desktop:

{ "mcpServers": { "chrome-devtools": { "command": "npx", "args": ["-y", "chrome-devtools-mcp"] } } }

После сохранения конфигурации перезапустите клиент. Сервер автоматически найдёт установленный Chrome на вашей системе.

Примеры запросов

  • «Открой сайт example.com и сделай скриншот всей страницы».
  • «Найди все консольные ошибки на странице после отправки формы».
  • «Проанализируй производительность загрузки главной страницы и покажи самые медленные запросы».
  • «Покажи HTML-код элемента с id="main"».

Технические детали

  • Язык: TypeScript.
  • Транспорт: stdio.
  • Лицензия: Apache-2.0.
  • Совместимые клиенты: Claude Desktop, Cursor, Copilot, Antigravity и любые другие MCP-клиенты.
  • Браузеры: Google Chrome, Chrome for Testing. Другие Chromium-браузеры не гарантируют корректной работы.
  • Публичная статистика: сервер может собирать анонимную статистику использования (отключается флагом --no-usage-statistics). Отправка метрик в CrUX отключается флагом --no-performance-crux.

Поделиться