ReddRadar
Agent skill
e2e-runner
E2E 테스트, Playwright, 엔드투엔드, 통합 테스트, UI 테스트 - Generates, runs, and maintains E2E tests using Playwright. Use when creating browser-based tests, debugging flaky E2E tests, or maintaining Playwright test suites. Do NOT use for unit/integration tests (use tdd-workflow) or test strategy planning (use testing-strategy).
Install this agent skill to your Project
npx add-skill https://github.com/aimskr/aims-claude-toolkit/tree/main/skills/e2e-runner
Metadata
Additional technical details for this skill
- author
- jaehashin
- version
- 1.2.0
SKILL.md
E2E Runner
Playwright를 사용한 엔드투엔드 테스트 워크플로우입니다.
핵심 기능
- 테스트 생성: 사용자 시나리오 기반 테스트 자동 생성
- 테스트 실행: 다양한 브라우저에서 테스트 실행
- 결과 분석: 실패 원인 분석 및 수정 제안
- 유지보수: 깨진 테스트 자동 수정
테스트 시나리오 템플릿
기본 구조
import { test, expect } from '@playwright/test';
test.describe('Feature: [기능명]', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/');
});
test('should [expected behavior]', async ({ page }) => {
// Arrange
// Act
// Assert
});
});
테스트 생성 프로세스
Phase 1: 시나리오 정의
사용자 스토리 → 테스트 시나리오 변환
예: "사용자가 로그인할 수 있다"
→
1. 유효한 자격 증명으로 로그인 성공
2. 잘못된 비밀번호로 로그인 실패
3. 존재하지 않는 이메일로 로그인 실패
4. 빈 필드로 로그인 시도
Phase 2: 선택자 식별
우선순위:
1. data-testid (권장)
2. role + name
3. text content
4. CSS selector (최후 수단)
Phase 3: 테스트 작성
AAA 패턴:
- Arrange: 테스트 환경 설정
- Act: 사용자 액션 수행
- Assert: 결과 검증
테스트 유지보수
깨진 테스트 수정
1. 실패 원인 분석 (스크린샷, 트레이스)
2. 선택자 변경 확인
3. 타이밍 이슈 확인
4. API 응답 변경 확인
5. 테스트 수정 또는 기능 버그 보고
Playwright 상세 참조
Playwright 설정, 실행 명령어, 코드 패턴, Page Object 패턴, 테스트 구조 등 상세 참조:
Read references/playwright-reference.md in this skill directory.
사용 방법
테스트 생성 요청
로그인 기능에 대한 E2E 테스트를 생성해주세요.
테스트 실행 및 분석
E2E 테스트를 실행하고 실패한 테스트를 분석해주세요.
깨진 테스트 수정
이 E2E 테스트가 실패합니다. 수정해주세요.
[테스트 코드]
[에러 메시지]
문서화 (작업 완료 후 자동 실행)
작업 완료 시 auto-documenter를 호출하여 프로젝트 문서를 업데이트한다.
Completion
모든 대상 테스트가 통과하거나, 실패 원인 분석 리포트가 전달되면 완료.
Troubleshooting
테스트가 간헐적으로 실패 (flaky): 타이밍 이슈가 대부분. waitFor / expect().toBeVisible() 등 명시적 대기로 교체. page.waitForTimeout() 사용 금지.
Selector가 자주 깨지는 경우: CSS selector 대신 data-testid 또는 role + name 선택자로 전환. 선택자 우선순위 Phase 2 참조.
CI에서만 실패하는 테스트: headless 모드 차이, 화면 해상도, 네트워크 지연 확인. --trace on으로 trace 수집 후 분석.
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
aimskr/aims-claude-toolkit
build-error-resolver
빌드 에러, 빌드 오류, 컴파일 에러, 빌드 실패 해결, 의존성 에러 - Specialized in resolving build errors, compilation failures, and dependency issues. Use when build fails, compilation errors occur, or dependency conflicts arise. Do NOT use for runtime bugs or logic errors (use debug-specialist instead).
aimskr/aims-claude-toolkit
brainstorming
브레인스토밍, 아이디어, 기획, 구상, 아이디어회의, 설계, 요구사항 분석, 접근법 탐색 - Use before creating new features or significant changes to explore user intent, requirements, and design options. Collaborative brainstorming through step-by-step questioning. Do NOT use for simple bug fixes, config changes, or tasks with clear requirements already defined.
aimskr/aims-claude-toolkit
doc-coauthoring
문서 작성, 문서화, 문서, 스펙 작성, 기술 문서, 제안서, RFC, 설계 문서, 의사결정 문서 - Collaborative document co-authoring through 3 stages: context gathering, iterative refinement, and reader testing. Use when writing docs, proposals, tech specs, decision docs, or RFCs. Do NOT use for PRD/product requirements (use prd-strategist) or implementation plans (use writing-plans).
aimskr/aims-claude-toolkit
testing-strategy
테스트 전략, 테스팅 계획, QA 전략, 품질 보증, 테스트 피라미드, 테스트 시나리오, 커버리지 목표 - Designs test strategies including test pyramid ratios, scenario categories, and coverage targets. Use when planning how to test a feature, designing QA approach, or creating test plans. Do NOT use for TDD implementation (use tdd-workflow) or E2E test execution (use e2e-runner).
aimskr/aims-claude-toolkit
learning-research
학습 리서치, 학습 자료, 공부 자료, 학습, 공부, 스터디, 개념 정리, 이해 - 특정 주제를 깊이 이해하기 위한 학습 자료를 수집·정리한다. 병렬 전문가 서브에이전트로 개념, 원리, 실습, 심화 자료를 수집하고 이해도별로 체계화된 학습 노트를 생성한다. Obsidian vault에 자동 저장. 의사결정용 자료 조사는 research 스킬을, 시장조사는 market-research 스킬을 사용할 것.
aimskr/aims-claude-toolkit
devil-advocate
Didn't find tool you were looking for?