скилл

playwright · davila7 — скилл для Claude Code: что делает и как установить

Q: Как установить playwright в Claude Code?

Выполните команду `npx claude-code-templates@latest --skill development/playwright`. Также можно использовать менеджер навыков: `npx skills add davila7/claude-code-templates --skill playwright -a claude-code`.

Q: Зачем запускать snapshot перед кликами?

Команда `snapshot` сканирует структуру страницы и назначает элементам временные идентификаторы вроде `e1` или `e15`. Без свежего снимка агент не сможет обратиться к нужному узлу разметки.

Управляет реальным браузером из терминала через playwright-cli. Помогает заполнять веб-формы, снимать скриншоты и отлаживать интерфейсы без написания отдельных тест-кейсов.

Установить в Claude Code · Через claude-code-templates Все способы и платформы ↓

npx claude-code-templates@latest --skill development/playwright

Открыть на GitHub

Что делает playwright

Скилл настраивает работу с браузером через консольную утилиту playwright-cli и готовый bash-скрипт. В отличие от фреймворка тестов @playwright/test, здесь упор сделан на быстрые разовые действия прямо из консоли: перейти по адресу, кликнуть по кнопке, ввести текст или переключить вкладку.

Вся работа строится вокруг снимков страницы: команда snapshot присваивает интерактивным элементам короткие метки вроде e1, e2 или e3. По этим идентификаторам агент нажимает ссылки или заполняет поля ввода. Как только интерфейс обновился или сменился адрес, снимок нужно делать заново, иначе старые метки перестанут срабатывать.

Для запуска обёртки в системе обязательно нужен npx, поэтому наличие Node.js проверяется в первую очередь. Глобально ставить пакет @playwright/cli не требуется, а артефакты работы и скриншоты скилл сохраняет в каталог output/playwright/.

Какие задачи решает

заполнить и отправить веб-форму прямо из консоли
снять скриншот или записать трейс сессии браузера
проверить работу интерфейса в видимом окне с ключом --headed
переключаться между открытыми вкладками браузера в терминале

Примеры запросов агенту

Открой https://example.com/form, заполни поле почты и сделай скриншот.
Запусти https://playwright.dev с флагом --headed и начни запись трейса.
Сделай snapshot страницы и нажми на элемент e3.

Как установить playwright

1Через claude-code-templates

npx claude-code-templates@latest --skill development/playwright

2Через Skills CLI (Vercel)

npx skills add davila7/claude-code-templates --skill playwright -a claude-code

3Вручную: положить файлы

~/.claude/skills/playwright/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/playwright/

Вручную: положить файлы

.agents/skills/playwright/SKILL.md

Для всех проектов — ~/.agents/skills/

Вручную: положить файлы

.cursor/skills/playwright/SKILL.md

Cursor читает и .agents/skills/, и .claude/skills/

1GitHub CLI

gh skill install davila7/claude-code-templates playwright

2Вручную: положить файлы

.github/skills/playwright/SKILL.md

Командой платформы

gemini skills install https://github.com/davila7/claude-code-templates --path cli-tool/components/skills/development/playwright

Вручную: положить файлы

.devin/skills/playwright/SKILL.md

Старый путь .windsurf/skills/ тоже читается

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о playwright

Как установить playwright в Claude Code?

Выполните команду npx claude-code-templates@latest --skill development/playwright. Также можно использовать менеджер навыков: npx skills add davila7/claude-code-templates --skill playwright -a claude-code.

Зачем запускать snapshot перед кликами?

Команда snapshot сканирует структуру страницы и назначает элементам временные идентификаторы вроде e1 или e15. Без свежего снимка агент не сможет обратиться к нужному узлу разметки.

Нужно ли устанавливать playwright-cli глобально?

Глобальная установка необязательна. Скилл использует встроенный bash-скрипт, запускающий утилиту через npx, поэтому достаточно наличия установленного Node.js в системе.

Сначала — playwright от других авторов.

playwright PyModel Скилл для Playwright в Next.js: 45 правил по 8 категориям — от архитектуры тестов до отладки в CI. Пригодится, когда тесты падают через раз. CX Codex +1 485установок playwright Mindrally Скилл для автоматизации end-to-end тестов веб-приложений на TypeScript и JavaScript. Учит агента писать тесты по best practices: правильные локаторы, web-first assertions, отсутствие hardcoded таймаутов. CX Codex +1 1 100установок playwright secondsky Скилл для браузерной автоматизации и E2E-тестов на Playwright. Сам находит запущенный dev-сервер и пишет скрипты под вашу задачу. CX Codex +1 1 000установок playwright bobmatnyc Скилл по Playwright для написания end-to-end тестов: локаторы, авто-ожидание, кросс-браузерный прогон. Пригодится, когда нужно покрыть тестами пользовательские сценарии. CX Codex +1 879установок playwright oakoss Скилл для ИИ-агента по Playwright: локаторы, ассерты, скриншоты и PDF, обход бот-защиты, авторизованные сессии, отладка ошибок. CX Codex +1 452установок agent-browser vercel-labs Скилл управляет браузером через CLI: открывает страницы, заполняет формы, нажимает кнопки и проверяет веб-приложения. Подходит для задач, где агенту нужно действовать в интерфейсе. CX Codex +1 1 200 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. 186 758установок computer-use stablyai Скилл ведёт видимое окно приложения через orca computer: читает дерево доступности, кликает, печатает и снимает скриншоты. Нужен, когда задача упирается в интерфейс. CX Codex +1 239 600установок browser-use browser-use Даёт агенту живой Chrome через CDP: клики, ввод, скриншоты и страницы, которым нужен JS или ваша логин-сессия. CX Codex +1 98 200установок playwright-cli microsoft Скилл, который даёт агенту браузер: открыть страницу, кликнуть по элементу, снять снимок и разобрать тесты Playwright. CX Codex +1 195 700установок last30days mvanhorn Собирает посты и реакции по любой теме за последние 30 дней из Reddit, X, YouTube, TikTok, Hacker News, Polymarket, GitHub и веба. Пригодится, когда нужно понять, что реально говорят люди, а не что пишут в обзорах. CX Codex +1 53 000установок

Из того же набора740

Весь набор →

e2e-setup Команда разворачивает сквозное E2E-тестирование в проекте, подбирает фреймворк и настраивает запуск тестов в CI. 477установок optimize-memory-usage Команда ищет утечки и лишний расход памяти, затем предлагает настройки и проверки для frontend, backend или базы данных. 476установок podcast-content-analyzer Субагент для Claude разбирает транскрипты подкастов: находит яркие моменты, режет на главы, вытаскивает ключевые слова и оценивает потенциал клипов. 474установок ci-pipeline Настраивает и проверяет CI/CD в GitHub Actions прямо из диалога. Пригодится, когда нужно развернуть пайплайн с тестами, матрицей версий и деплоем на staging и production. 470установок project-health-check Команда собирает метрики репозитория и формирует отчёт о состоянии проекта с оценкой от 0 до 100. Пригодится перед релизом или планированием спринта. 466установок validate-branch-name Хук перехватывает команды Bash перед запуском и не даёт создать ветку, которая не подходит под Git Flow. 464установок write-tests Собирает unit-, integration-, e2e- и component-тесты с моками. Пригодится, когда нужно разобрать файл и добавить тестовый набор под его фреймворк. 459установок scientific-writing Помогает готовить научные статьи в формате IMRAD со связным текстом без списков, библиографией и диаграммами. 455установок