스킬 e2e-testing-patterns
📦
엔드투엔드 테스트 작성은 어렵습니다. 이 스킬은 Playwright와 Cypress를 위한 검증된 패턴을 제공하여 사용자가 버그를 발견하기 전에 잡아내는 안정적이고 유지보수 가능한 테스트를 생성합니다.
지원: Claude Codex Code(CC)
1
스킬 ZIP 다운로드
2
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
3
토글을 켜고 사용 시작
테스트해 보기
"e2e-testing-patterns" 사용 중입니다. Create a login test with Playwright
예상 결과:
- Step 1: 이메일, 비밀번호, 제출 버튼의 로케이터가 있는 LoginPage 클래스 생성
- Step 2: goto() 및 login(email, password) 메서드 구현
- Step 3: URL 및 성공 메시지에 대한 어설션과 함께 페이지 객체를 사용하여 테스트 작성
- Step 4: 잘못된 자격 증명에 대한 오류 처리 테스트 추가
"e2e-testing-patterns" 사용 중입니다. How do I debug a flaky test?
예상 결과:
- 1. 고정된 waitForTimeout을 명시적 대기로 교체
- 2. 트레이스 뷰어 사용: npx playwright test --trace on
- 3. 실패 시 스크린샷 추가
- 4. 비동기 작업의 레이스 컨디션 확인
- 5. 크로스 테스트 오염을 방지하기 위해 테스트 데이터 격리
보안 감사
안전v1 • 2/24/2026
All 63 static findings are false positives. The analyzer incorrectly interprets markdown code fences as Ruby shell commands, JavaScript operators as cryptographic issues, and test configuration as system reconnaissance. This is a documentation skill with educational content about E2E testing patterns using Playwright and Cypress. No actual security risks exist.
2
스캔된 파일
576
분석된 줄 수
3
발견 사항
1
총 감사 수
위험 요인
⚙️ 외부 명령어 (32)
resources/implementation-playbook.md:25-33 resources/implementation-playbook.md:33-46 resources/implementation-playbook.md:46-77 resources/implementation-playbook.md:77-81 resources/implementation-playbook.md:81-137 resources/implementation-playbook.md:137-141 resources/implementation-playbook.md:141-160 resources/implementation-playbook.md:160-194 resources/implementation-playbook.md:194-198 resources/implementation-playbook.md:198-227 resources/implementation-playbook.md:227-231 resources/implementation-playbook.md:231-277 resources/implementation-playbook.md:277-283 resources/implementation-playbook.md:283-301 resources/implementation-playbook.md:301-305 resources/implementation-playbook.md:305-331 resources/implementation-playbook.md:331-337 resources/implementation-playbook.md:337-341 resources/implementation-playbook.md:341-371 resources/implementation-playbook.md:371-377 resources/implementation-playbook.md:377-405 resources/implementation-playbook.md:405-409 resources/implementation-playbook.md:409-431 resources/implementation-playbook.md:431-435 resources/implementation-playbook.md:435-459 resources/implementation-playbook.md:459-463 resources/implementation-playbook.md:463 resources/implementation-playbook.md:463-472 resources/implementation-playbook.md:472-481 resources/implementation-playbook.md:481-495 resources/implementation-playbook.md:495-522 SKILL.md:43
🌐 네트워크 접근 (4)
🔑 환경 변수 (8)
resources/implementation-playbook.md:57 resources/implementation-playbook.md:58 resources/implementation-playbook.md:59 resources/implementation-playbook.md:174 resources/implementation-playbook.md:57 resources/implementation-playbook.md:58 resources/implementation-playbook.md:59 resources/implementation-playbook.md:174
감사자: claude
품질 점수
38
아키텍처
100
유지보수성
85
콘텐츠
26
커뮤니티
100
보안
100
사양 준수
만들 수 있는 것
새 프로젝트에 E2E 테스트 설정
적절한 구조, 리포터, CI 통합과 함께 처음부터 Playwright 또는 Cypress 구성
플리키(不稳定한) 테스트 수정
취약한 선택자와 고정된 타임아웃을 적절한 대기 전략과 안정적인 로케이터로 교체
테스트 실행 확장
병렬 실행과 테스트 셰딩을 구현하여 CI 파이프라인 시간을 시간에서 분으로 단축
이 프롬프트를 사용해 보세요
로그인 테스트 생성
Playwright를 사용하여 로그인 페이지의 엔드투엔드 테스트를 생성합니다. 적절한 선택자, 어설션, 성공 및 실패한 로그인 시도에 대한 오류 처리를 포함합니다.
API 응답 모의
실제 백엔드 서비스에 의존하지 않고 오류 처리를 테스트하기 위해 Cypress에서 API 응답을 모의하는 방법을 보여줍니다.
CI 파이프라인 설정
병렬 실행, 재시도 로직, HTML 리포트 생성과 함께 Playwright를 CI에서 테스트를 실행하도록 구성합니다.
접근성 테스트
axe-core를 사용하여 애플리케이션이 WCAG 가이드라인을 충족하도록 접근성 테스트를 구현합니다.
모범 사례
- 안정적인 로케이터를 위해 CSS 선택자 대신 data-testid 또는 시맨틱 역할 사용
- 테스트 데이터의 적절한 설정 및 정리와 함께 테스트를 독립적으로 유지
- 실행 시간을 줄이기 위해 CI에서 병렬로 테스트 실행
피하기
- waitForTimeout(3000)과 같은 고정 타임아웃 사용 - 플리키함 발생
- 사용자可见 동작 대신 구현 세부 사항 테스트
- 테스트 간 상태 공유 - 연쇄 실패로 이어짐
자주 묻는 질문
Playwright vs Cypress: 어느 것을 선택해야 합니까?
Playwright는 더 나은 크로스 브라우저 지원과 더 빠른 실행을 제공합니다. Cypress는 더 성숙한 생태계와 더 쉬운 디버깅을 가지고 있습니다. 브라우저 요구 사항과 팀 친숙도에 따라 선택하세요.
테스트의 플리키함을 줄이려면 어떻게 해야 합니까?
대신 명시적 대기를 사용하고, 구현 세부 사항 테스트를 피하고, 테스트 데이터가 적절하게 격리되어 있는지 확인하며, 네트워크 종속 작업에 재시도 로직을 추가하세요.
테스트를 병렬로 실행하려면 어떻게 해야 합니까?
Playwright workers 또는 Cypress 병렬화를 구성합니다. 테스트 셰딩을 사용하여 CI에서 여러 머신에 테스트를 분할합니다. 충돌을 피하기 위해 테스트가 독립적인지 확인하세요.
E2E 도구로 API를 테스트할 수 있습니까?
네, Playwright와 Cypress 모두 API 테스트를 지원합니다. UI 상호작용 없이 직접 API 호출에는 Playwright의 page.request() 또는 Cypress의 cy.request()를 사용하세요.
테스트에서 인증을 어떻게 처리합니까?
API 로그인을 사용하여 쿠키 또는 토큰을 설정하거나, 브라우저 스토리지 API를 사용하여 세션 데이터를 직접 설정합니다. 더 나은 성능을 위해 모든 테스트에서 UI 로그인을 피하세요.
Page Object Model이란 무엇입니까?
페이지별 로직과 선택자를 클래스에 캡슐화하는 디자인 패턴입니다. 모든 테스트에서가 아닌 한 곳에서 페이지 변경을 중앙화하여 테스트 유지보수를 개선합니다.