Перейти к содержимому

Playwright MCP: даём AI-агенту браузер — веб-автоматизация и парсинг

Кодинг-агент читает файлы, правит их и запускает терминал. Браузер для него — закрытая система: чтобы «посмотреть, что происходит на странице», агент не умеет ни открыть сайт, ни кликнуть по кнопке. Пока задача не касается веба, это не мешает. Но как только нужно вытащить данные с сайта, проверить форму или понять, что показывает страница за логином, упираешься в стену.

MCP-сервер Playwright от Microsoft закрывает эту дыру: подключаешь его к агенту — и тот получает браузер как набор инструментов. Он открывает страницы, читает их структуру, кликает, заполняет формы и возвращает результат прямо в контекст. Ниже — как он устроен, что реально умеет, два кейса из практики и один честный разбор того, где он не справляется.

Что такое Playwright MCP

Playwright MCP — MCP-сервер, который отдаёт модели браузерную автоматизацию на базе Playwright. Ставится как обычный npm-пакет, требует Node.js 18 или новее и работает с любым MCP-клиентом: VS Code, Cursor, Windsurf, Claude Desktop, Goose, Grok, Codex, Gemini CLI.

Ключевая особенность — модель видит страницу не как картинку, а как структурированный accessibility-снимок:

Fast and lightweight. Uses Playwright’s accessibility tree, not pixel-based input.

«Быстро и легко. Использует accessibility-дерево Playwright, а не пиксельный ввод.»

README microsoft/playwright-mcp

Это значит, что агенту не нужна vision-модель: страница приходит к нему как список элементов (роли, имена, тексты, состояния), и он принимает решения по структуре, а не по картинке. Отсюда детерминированность — один и тот же элемент кликается одинаково, в отличие от «кликни примерно туда» при работе со скриншотами.

Схема: AI-агент → MCP (Playwright) → браузер через accessibility-дерево
Путь запроса: агент вызывает тул, Playwright MCP исполняет его в браузере, результат возвращается в контекст. Своя схема.

Кейс 1: 21 инструмент и 13,7 тыс. токенов до первого вопроса

Главное, с чем сталкивается любой, кто подключает Playwright MCP, — цена в контексте. MCP-инструменты описываются JSON-схемами, и эти описания грузятся в контекст каждой сессии, даже если браузер в ней не нужен.

Machine learning-инженер Eugene Trapeznikov разобрал это на практике в посте «MCP Profiles: The Config Layer Between User and Repo Config» (июль 2026). У него своя боль: на работе нужен Jira-коннектор, в личных проектах — Linear, а конфиг MCP даёт только два уровня: «везде» или «в каждом репозитории по отдельности». Плюс токены:

Playwright MCP alone is 21 tools, about 13.7k tokens.

«Один только Playwright MCP — это 21 инструмент, примерно 13,7 тыс. токенов.»

Это не единичный замер. Scott Spence в Claude Code на пустой сессии увидел предупреждение о 66–82 тыс. токенах только на MCP-инструменты: omnisearch — 20 тулов (~14,2 тыс.), playwright — 21 тул (~13,6 тыс.), sqlite — 19 тулов (~13,4 тыс.). При окне Claude Sonnet 4.5 в 200 тыс. токенов треть контекста уходит до того, как написан первый промпт. DeployStack объясняет механику: сам MCP-транспорт токенов не ест, но дефиниции тулов загружаются целиком и масштабируются линейно — 100 инструментов ≈ 15–20 тыс. токенов, а результаты тулов при этом ещё и инжектятся обратно в контекст.

Диаграмма: дефиниции MCP-серверов съедают десятки тысяч токенов до первого сообщения
Замер Scott Spence: Playwright MCP — 21 тул ≈ 13,7 тыс. токенов; у Spence суммарно 66–82 тыс. токенов на инструменты в пустой сессии. Своя схема по данным из статьи.

Вывод Трапезникова радикальный: Playwright вообще не попадает ни в один профиль по умолчанию:

A browser-automation server loaded everywhere is a lot of trust to hand out by default.

«Браузерный сервер, загруженный везде, — это слишком большое доверие по умолчанию.»

Он выносит Playwright в отдельный профиль web.json и подключает его отдельной командой-обёрткой claude-web(). Правило простое: браузер — это ad-hoc задача, а не фоновый инструмент каждой сессии. Подход к разделению профилей он отдал в gist.

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

Стандартный конфиг работает почти везде:

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["@playwright/mcp@latest"]
    }
  }
}

Для Claude Code проще одной командой:

claude mcp add playwright npx @playwright/mcp@latest
Официальный README microsoft/playwright-mcp: разделы про CLI vs MCP, требования и конфиг
Официальный README (снимок на момент публикации): стандартный конфиг и установка для Claude Code, Cursor, Codex и других клиентов.

В Cursor: Settings → MCP → Add new MCP server → command npx @playwright/mcp@latest. В Codex CLI:

codex mcp add playwright npx "@playwright/mcp@latest"

В VS Code и остальных — тот же стандартный конфиг. Подробная таблица установки для каждого клиента — в README репозитория.

После подключения у агента появляется набор инструментов browser_*: открыть страницу, получить снимок, кликнуть, ввести текст, подождать элемент, снять скриншот, работать с вкладками и cookies. Дополнительные возможности включаются флагами: --caps=vision (клики по координатам), --caps=pdf (сохранить страницу в PDF), --caps=devtools (профилирование), --caps=testing (проверки видимости), --caps=network (моки сетевых запросов).

Кейс 2: сессии и логины — GhostSession

Парсинг «публичной» страницы Playwright MCP делает сразу. Сложнее — данные за логином: агент открывает сайт, а там форма входа. Облачные рутины с этим мучаются, и у этого есть имя.

Разработчик из r/ClaudeAI описал проблему в треде про GhostSession (июль 2026). Его рутина автоматически работала с лентой LinkedIn:

Day one worked perfectly. Day two the browser was signed out because the container was brand new.

«В первый день всё работало. На второй день браузер оказался разлогинен, потому что контейнер был новым.»

Облачные контейнеры эфемерны по дизайну — состояние браузера (cookies, localStorage) не переживает перезапуск. Его решение — GhostSession: self-hosted прокси, который хранит состояние сессии в Postgres и «гидрирует» свежий браузер перед подключением агента. Паттерн: агент подключается к ws://ghost/connect?sessionId=..., сервер грузит сохранённое состояние, поднимает Chromium, впрыскивает cookies и пробрасывает CDP — для агента это выглядит как обычный браузер. По отключении состояние сохраняется обратно. Автор встроил это в Playwright MCP, и рутины теперь живут залогиненными в LinkedIn, Gmail и панели клиента.

Для России этот кейс вдвойне актуален: часть нужных данных (личные кабинеты, аналитика, закрытые разделы) доступна только за логином, и «подержать сессию» — не каприз, а условие задачи.

Что реально делать: парсинг и автоматизация

Типичная задача выглядит как обычный промпт:

Открой страницу каталога на целевом сайте, собери первые 10 товаров
в markdown-таблицу: название, цена, ссылка. Не кликай по рекламе.

Агент откроет страницу, прочитает accessibility-дерево, выберет нужные элементы и вернёт таблицу. Никакого CSS-селектора писать не нужно — модель сама находит элементы по ролям и именам.

Ещё варианты, которые закрываются сразу:

  • вытащить JSON с ценой/наличием со страницы товара и сравнить с прошлым замером;
  • заполнить форму и проверить, что после сабмита появилось нужное сообщение;
  • собрать список ссылок из раздела документации и проверить, что ни одна не ведёт в 404;
  • прогнать свой сайт глазами агента: открыть главную, перейти в каталог, оформить заказ.

Важная деталь: результат возвращается текстом в контекст, а не файлом. Для десятка товаров это удобно, для тысячи строк — переполнит контекст. Крупные объёмы лучше отдавать скриптам, а агента использовать для разведки и точечных проверок.

Кейс 3: где Playwright MCP не справляется

Честный контр-пример. В треде «Claude Code is only as good as the validation loops around it» (апрель 2026) разработчик строил e2e-валидацию: код компилируется, линт проходит, но фича не работает, потому что агент «не пробует кликнуть». Он попробовал Playwright MCP — и вынес вердикт:

Playwright MCP and Chrome DevTools MCP were a pain: too slow, claude wanders aimlessly, and most of the time is spent setting up the scenario / fake data.

«Playwright MCP и Chrome DevTools MCP были мучением: слишком медленно, Клод бесцельно бродит, и большую часть времени занимает подготовка сценария и тестовых данных.»

В итоге он собрал собственный плагин для валидации с жёсткими проверками «элемент виден / значение в базе». Вывод: для проверки каждой фичи Playwright MCP медленный и «блуждающий» — это инструмент разведки, а не фабрика e2e-тестов.

Сам Microsoft согласен с разделением. В README репозитория прямо сказано: для высоконагруженных кодинг-агентов сейчас рекомендуют CLI + SKILLS — команды дешевле по токенам, чем загрузка больших схем тулов и accessibility-деревьев в контекст. MCP остаётся уместным там, где нужны постоянное состояние, богатая интроспекция и длинные автономные воркфлоу — разведка страниц, самовосстанавливающиеся тесты, долгие обходы.

Таблица опций запуска из официального README: allowed-hosts, caps, browser, codegen
Официальные флаги запуска playwright-mcp: ограничение хостов, capabilities, выбор браузера. Снимок на момент публикации.

Держать под контролем: управление набором MCP

Токеновый урок из кейса Трапезникова переносится на любой MCP-сервер. Инструменты для этого уже есть:

  • Профили через --mcp-config — файл с профилем (работа/личное/веб) и функция-обёртка в шелле, которая выбирает профиль по пути репозитория или git-remote (приём Трапезникова, «около двадцати строк shell»).
  • McPick — CLI для включения/выключения серверов перед сессией, создаёт бэкап конфига.
  • mcp-switch — переключение серверов прямо в сессии через флаг disabled.
  • MCPM — пакетный менеджер MCP-серверов с тегами.
  • MetaMCP — агрегирует несколько серверов за одним шлюзом.

Трапезников честно отмечает границу: эти утилиты управляют серверами, но не решают, какие серверы должны быть в сессии — это решение о маршрутизации, которое он оставляет своему gist-приёму.

Российские реалии

Playwright MCP — локальный open-source пакет (Apache-2.0) с npm. Поэтому по-российски просто:

  • Работает в РФ без VPN: установка через npx из npm-реестра, весь инструментарий локальный, облака нет.
  • Бесплатно и без аккаунта: регистрация и банковская карта не нужны — в отличие от моделей агента. Если агент Claude Code — нужна подписка или API с зарубежной картой (гайд); связка с локальными моделями (Aider + Ollama) обходится вообще без оплаты.
  • Парсинг и закон: публичные данные — серая зона; персональные данные защищены 152-ФЗ, а обход авторизации и капчи нарушает условия сервиса сайта. Playwright MCP — инструмент, а не индульгенция: соблюдение ToS и robots.txt — ваша ответственность.

Рунет-опыт вокруг темы есть, но точечно: «Как использовать Claude в России в 2026» (Habr) — про доступность и оплату агентов; «Агентность на практике: Codex CLI и российский AI-ландшафт» (Habr) — про MCP-экосистему в наших реалиях. Отдельного материала именно про Playwright MCP на русском мы не нашли — тема в рунете не освещена, так что эта статья закрывает пробел.

Ограничения (честно)

  • Токены: 21 тул ≈ 13,7 тыс. токенов в каждой сессии, где включён сервер. Держите Playwright опт-in, а не в дефолтном профиле.
  • Скорость: для помассовой e2e-валидации медленный и «блуждающий» (кейс 3); для быстрых проверок каждой фичи лучше специализированные тулы или CLI+SKILLS.
  • Контекст-потолок: результаты приходят текстом в контекст; большие выгрузки переполняют окно — нужны скрипты.
  • Сессии: состояние браузера по умолчанию не сохраняется между запусками; логины требуют отдельного слоя (GhostSession и аналоги).
  • Безопасность: браузер у агента — это доверие «нажатия кнопок» от чужого кода. Страница может содержать промпт-инъекции; ограничивайте хосты (--allowed-hosts), запрещайте unrestricted file access и не оставляйте фоновых агентов с браузером без присмотра.
  • Не для всего веба: тяжело с SPA-анимациями и капчами; там, где нужен «человеческий» обход, инструмент бессилен — и правильно.

Итог

Playwright MCP — самый простой способ дать кодинг-агенту браузер: 21 инструмент, никакой vision-модели, страница приходит как структура. Он закрывает задачи, которые агенты без браузера не решают вовсе: парсинг «живых» страниц, проверка форм, работа с данными за логином. Плата за это — токены (≈13,7 тыс. на сервер в каждой сессии) и медлительность на массовых проверках, поэтому разумная схема — подключать его по требованию, отдельной командой, как это делает Трапезников.

Начать можно сегодня: claude mcp add playwright npx @playwright/mcp@latest, затем промпт «открой страницу и собери данные». Первые же двадцать минут покажут, где инструмент силён (разведка и парсинг) и где его лучше не использовать (валидация каждой фичи).

Дальше по серии «Агентный кодинг для программистов»: фундамент — «Что такое агентный кодинг», стандарт подключения инструментов — «Что такое MCP», контекст для агентов — «AGENTS.md», агент в терминале — «Как установить OpenCode» и «Gemini CLI от Google».

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка / 5. Количество оценок:

Оценок пока нет. Поставьте оценку первым.

Добавить комментарий

Adblock
detector