playwright-e2e-builder — скилл для Claude Code
Скилл планирует и собирает E2E-тесты на Playwright: сначала расспрашивает про сценарии и авторизацию, потом пишет код.
npx claude-code-templates@latest --skill development/playwright-e2e-builderЧто делает playwright-e2e-builder
Скилл работает в четыре фазы. Сначала изучает проект: находит фреймворк, проверяет, стоит ли уже @playwright/test, ищет каталоги тестов, маршруты, страницу входа и конфиги CI. Потом задаёт вопросы через AskUserQuestion — какие сценарии закрывать, как устроена авторизация, откуда брать тестовые данные, где гонять тесты. Дальше пишет план и только после подтверждения переходит к реализации.
Внутри — готовые шаблоны: конфиг playwright.config.ts с проектами под браузеры, отдельный проект setup для сохранения состояния авторизации в e2e/.auth/user.json, Page Object Model, свои фикстуры для данных и API-клиента, визуальная регрессия и конфиг CI с шардингом и ретраями.
Скилл рассчитан на проект, где уже есть dev-сервер и известен его порт: в конфиге по умолчанию стоит http://localhost:3000, а адрес переопределяется через BASE_URL. Если приложение на другом порту, поправьте это до первого запуска, иначе тесты уйдут в пустоту.
Какие задачи решает
- Поставить Playwright в существующий проект и не угадывать структуру каталогов
- Описать критические пользовательские сценарии до написания тестов
- Вынести локаторы и действия в Page Object Model
- Сохранить состояние авторизации и переиспользовать его между тестами
- Подключить прогон тестов в CI с шардингом и ретраями
Примеры запросов агенту
- Разберись, что за стек в проекте, и предложи план E2E-тестов на Playwright
- Задай мне вопросы про сценарии и авторизацию, потом собери конфиг
playwright.config.ts - Настрой сохранение состояния входа в
e2e/.auth/user.jsonи фикстуры для тестовых данных
Как установить playwright-e2e-builder
1Через claude-code-templates
npx claude-code-templates@latest --skill development/playwright-e2e-builder2Через Skills CLI (Vercel)
npx skills add davila7/claude-code-templates --skill playwright-e2e-builder -a claude-code3Вручную: положить файлы
~/.claude/skills/playwright-e2e-builder/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/playwright-e2e-builder/
Вручную: положить файлы
.agents/skills/playwright-e2e-builder/SKILL.mdДля всех проектов — ~/.agents/skills/
Вручную: положить файлы
.cursor/skills/playwright-e2e-builder/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install davila7/claude-code-templates playwright-e2e-builder2Вручную: положить файлы
.github/skills/playwright-e2e-builder/SKILL.mdКомандой платформы
gemini skills install https://github.com/davila7/claude-code-templates --path cli-tool/components/skills/development/playwright-e2e-builderВручную: положить файлы
.devin/skills/playwright-e2e-builder/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Claude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о playwright-e2e-builder
Как установить playwright-e2e-builder в Claude Code?
Через шаблоны: npx claude-code-templates@latest --skill development/playwright-e2e-builder. Второй способ — npx skills add davila7/claude-code-templates --skill playwright-e2e-builder -a claude-code. После установки файл скилла лежит в ~/.claude/skills/playwright-e2e-builder/SKILL.md.
Что делает playwright-e2e-builder?
Планирует и собирает набор E2E-тестов на Playwright: конфиг, Page Object Model, фикстуры, сохранение авторизации, визуальную регрессию и конфиг CI. Перед написанием тестов уточняет у вас сценарии, стратегию входа и работу с тестовыми данными.
Нужен ли запущенный сервер приложения?
Да, тесты идут против работающего приложения. В конфиге по умолчанию указан http://localhost:3000, а свой адрес задаётся переменной BASE_URL.
