write-e2e-tests — скилл для Claude Code: E2E-тесты
Помогает писать Playwright E2E-тесты для tldraw: действия в интерфейсе, меню и фигуры на холсте. Нужен при добавлении тестов в примеры SDK или клиент tldraw.com.
npx skills add tldraw/tldraw --skill write-e2e-tests -a claude-codeЧто делает write-e2e-tests
Скилл задаёт правила для Playwright-тестов в apps/examples/e2e/ и apps/dotcom/client/e2e/. Он подсказывает структуру файла test-<feature>.spec.ts, подключение фикстур и подготовку состояния через setupOrReset.
Для работы с редактором применяет page.evaluate(), а элементы интерфейса предлагает искать через getByTestId() или фикстуры панели инструментов. Есть приёмы для меню, проверки событий интерфейса, таблиц тестовых случаев и различий между Mac и мобильным экраном.
Скилл описывает запуск через pnpm e2e, pnpm e2e-dotcom и pnpm e2e-ui. Общая страница подходит только там, где не нужна полная изоляция тестов: это повод проверить, не зависят ли проверки друг от друга.
Какие задачи решает
- добавить Playwright-тест для инструмента рисования
- проверить выбор и свойства фигур на холсте
- нажать пункт главного или контекстного меню
- проверить событие после сочетания клавиш
- учесть различия клавиш на Mac и мобильном экране
Примеры запросов агенту
- Добавь E2E-тест для нового инструмента в `apps/examples/e2e/tests/` с `setupOrReset`.
- Проверь через Playwright, что выбор прямоугольника меняет состояние кнопки панели.
- Напиши тест контекстного меню и проверь событие после нажатия клавиши.
Как установить write-e2e-tests
1Через Skills CLI (Vercel)
npx skills add tldraw/tldraw --skill write-e2e-tests -a claude-code2Вручную: положить файлы
~/.claude/skills/write-e2e-tests/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/write-e2e-tests/
1Через Skills CLI (Vercel)
npx skills add tldraw/tldraw --skill write-e2e-tests -a codex2Вручную: положить файлы
.agents/skills/write-e2e-tests/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add tldraw/tldraw --skill write-e2e-tests -a cursor2Вручную: положить файлы
.cursor/skills/write-e2e-tests/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install tldraw/tldraw write-e2e-tests2Вручную: положить файлы
.github/skills/write-e2e-tests/SKILL.md1Через Skills CLI (Vercel)
npx skills add tldraw/tldraw --skill write-e2e-tests -a gemini-cli2Командой платформы
gemini skills install https://github.com/tldraw/tldraw --path skills/write-e2e-testsВручную: положить файлы
.devin/skills/write-e2e-tests/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add tldraw/tldraw --skill write-e2e-tests -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
Из того же набора7
Весь набор →Похожие
Вопросы о write-e2e-tests
Как установить write-e2e-tests в Claude Code?
Выполните npx skills add tldraw/tldraw --skill write-e2e-tests -a claude-code, затем повторите npx skills add tldraw/tldraw --skill write-e2e-tests -a claude-code. Файл скилла расположен в ~/.claude/skills/write-e2e-tests/SKILL.md.
Что делает write-e2e-tests?
Скилл направляет работу над E2E-проверками tldraw на Playwright. Он охватывает фикстуры, взаимодействие с холстом, меню, события интерфейса и проверки состояния.
Как обращаться к editor внутри page.evaluate()?
Нужно импортировать Editor из tldraw и объявить editor. Для проверки событий интерфейса также объявляется __tldraw_ui_event.
