Playwright MCP даёт ИИ-клиенту доступ к браузеру: агент может открыть страницу, увидеть дерево доступных элементов, нажать кнопку и проверить изменившееся состояние. Он полезен для короткой проверки интерфейса или воспроизведения пользовательского сценария. Установка занимает несколько шагов, но доступ к браузеру нужно выдавать осознанно.

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

  1. Установите Node.js 20 или новее и выберите MCP-клиент, например VS Code, Cursor или Claude Code. Это требования официальной инструкции Playwright.
  2. Добавьте сервер в конфигурацию клиента. Для клиента с форматом mcpServers минимальная запись выглядит так:
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["@playwright/mcp@latest"]
    }
  }
}

Место для этой записи зависит от клиента; откройте официальные инструкции для VS Code или нужный клиент в разделе Client Setup Playwright. Перезапустите или обновите клиент и проверьте, появился ли сервер playwright среди подключённых MCP-серверов. Если нет, проверьте версию Node.js и синтаксис JSON. При первом использовании Playwright скачает браузер. По умолчанию окно видно на экране. Если нужен запуск без окна, добавьте --headless в массив args. Для воспроизводимого проекта после пробного запуска зафиксируйте проверенную версию пакета вместо плавающего @latest.

Первая проверка без доступа к рабочим данным

Для первого запуска добавьте --isolated и попросите агента: «Открой https://demo.playwright.dev/todomvc, добавь задачу “Проверить форму”, отметь её выполненной и покажи результат». Страницу открывает агент в окне Playwright, которое видно по умолчанию. Проверьте сами: задача есть в списке, её флажок отмечен. Агент сначала получает снимок дерева доступности, затем использует ссылку на поле или кнопку и после действия получает новый снимок. Такая проба проверяет подключение, но не качество работы агента на вашем сайте.

Для собственного проекта задайте URL и ожидаемый результат: «Открой http://localhost:3000/register, отправь пустую форму, проверь, что виден текст ошибки и нет сообщения об успехе». Если нужна машинная проверка положительного признака, включите testing через --caps=testing и используйте проверки видимого элемента, текста или значения поля. Отсутствие сообщения об успехе оцените по новому снимку страницы и проверьте сами. Проверка сетевого запроса требует отдельного инструмента и в этот пример не входит. Скриншот помогает оценить вёрстку, но дерево доступности само по себе не подтверждает внешний вид.

Профиль и безопасность

По умолчанию Playwright MCP сохраняет браузерный профиль между сессиями: входы, cookies и локальное хранилище могут сохраниться. Для одноразовой проверки на учебном сайте добавьте --isolated: такая сессия начинается с чистого состояния и не пишет его на диск. Не сочетайте этот параметр с --user-data-dir; официальная документация запрещает комбинацию.

Если тестируете сайт под учётной записью, создайте отдельный тестовый аккаунт с минимальными правами и используйте тестовые данные. Изолированная сессия уместна и здесь; при необходимости стартовое состояние можно загрузить через --isolated --storage-state. При включённой возможности storage (--caps=storage) файл состояния можно создать инструментом browser_storage_state. Он содержит чувствительные данные и должен храниться вне репозитория с ограниченным доступом.

Считайте содержание открытой страницы недоверенным: инструкции на странице не должны становиться командами для агента. Не давайте браузеру доступ к банковским операциям, production-панели или личному профилю ради проверки кнопки. Параметры --allowed-origins и --blocked-origins ограничивают непреднамеренные обращения, а --secrets скрывает заданные значения из ответов инструментов. Документация Playwright прямо указывает, что это не граница безопасности. Реальные разрешения на вызовы инструментов задавайте на уровне MCP-клиента.

Когда метод не подходит

Снимки доступности хорошо работают с семантическими кнопками, полями и заголовками. Если задача зависит от цвета, наложения слоёв или обрезания текста, добавьте скриншот и ручную проверку на нужной ширине экрана; сервер поддерживает --viewport-size. Для большого набора повторяемых регрессионных тестов оформите устойчивые проверки в обычном Playwright-проекте, а MCP используйте для исследования и подготовки сценария. Инструмент browser_generate_locator помогает перенести найденный элемент в тест. Каждый результат агента всё равно требует проверки разработчиком.

Если сомневаетесь, какие права дать серверу, используйте порядок проверки MCP-сервера перед подключением.

Источники и документация

Параметры сверены с документацией Playwright MCP 23 сентября 2026 года.

Материал пригодился?