Я протестировал все 3 браузерных инструмента для поиска кода Клода, и вот лучший из них.

Описание: Claude Code не видит ваш браузер. Но теперь есть 3 разных инструмента, которые решают эту проблему: Chrome DevTools MCP от Google, Claude in Chrome от Anthropic и Playwright MCP от Microsoft.

Я протестировал все три и сравнил их бок о бок. В этом видео вы увидите, что делает каждый инструмент, как его настроить и какой из них использовать в зависимости от вашего рабочего процесса.


ВРЕМЕННЫЕ МЕТКИ:
0:00 - Введение
0:45 - Проблема (Claude Code is Blind)
1:30 - Краткий обзор всех 3 инструментов
2:30 - Инструмент 1: Chrome DevTools MCP (Google)
3:00 - Настройка (одной командой)
3:45 - Демонстрация: Анализ производительности
5:00 - Демонстрация: Отладка ошибок в консоли
5:45 - Преимущества и ограничения
6:30 - Инструмент 2: Claude в Chrome (Anthropic)
7:00 - Настройка
7:45 ​​- Демонстрация: Аутентифицированный рабочий процесс
9:00 - Демонстрация: Отладка и проверка
9:30 - Преимущества и ограничения
10:00 - Инструмент 3: Playwright MCP (Microsoft)
10:45 - Почему я бы его пропустил (для большинства людей)
11:30 - Сравнительный анализ Таблица
13:00 - Моя рекомендация
14:00 - Заключение

КОМАНДЫ НАСТРОЙКИ:

Chrome DevTools MCP:
claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest

Playwright MCP:
claude mcp add playwright npx '@playwright/mcp@latest'

Claude в Chrome:
1. Установите расширение: https://chromewebstore.google.com/det...
2. Запустите: claude --chrome

ССЫЛКИ:
Chrome DevTools MCP GitHub: https://github.com/ChromeDevTools/chr...
Playwright MCP GitHub: https://github.com/microsoft/playwrig...
Документация по Claude в Chrome: https://code.claude.com/docs/en/chrome

СВЯЗАННЫЕ ВИДЕО:
Учебник по Claude Code для начинающих (2026):    • Claude Code Tutorial for Beginners 2026  
Создайте свой собственный MCP-сервер для Claude Code:    • Build Your Own MCP Server for Claude Code  
Интеграция Claude AI и Slack:    • How to Use Claude AI in Slack - Complete S...  

---

Статья в блоге: https://ayyaztech.com/blog/chrome-dev...

#ClaudeCode #MCP #ChromeDevTools #AIcoding #WebDevelopment