メニュー
Use for UI-affecting changes before /ship. Drives an actual browser through the user flow to reproduce what the user will see — clicks, forms, error states, loading spinners. Finds the bugs that unit tests can't catch (DOM event ordering, CSS breakage, auth session edge cases, race conditions in UI state).
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Explicit GPT-5.6 native-first router for auditing, designing, installing, or validating Codex skill combinations, global skill setup, routing fixtures, and harness behavior. Use when the user explicitly invokes $codex-skill-router or asks to change or inspect Codex skills, routing, AGENTS guidance, or global harness configuration. Do not use for ordinary coding, review, debugging, research, or UI work merely because the task is complex.
Use when work introduces or changes shared nouns, states, IDs, ownership, authority, or customer-facing vocabulary.
Use when changing harness gates, routing rules, skills, or automation behavior and benchmark/eval evidence is needed to avoid slowing normal coding performance. Do not use for ordinary app code changes.
Use when a request is early, ambiguous, or lacks a codebase-backed shared language; interview the user to expose assumptions before planning.
Use when a codebase, docs, ADRs, tests, prior reviews, or team traces exist; align new work with existing shared language before implementation.
Use first for normal or high-risk natural-language work to choose task mode, tier, grill path, spec layers, team-rule scan, and required gates before implementation.
| name | qa |
| description | Use for UI-affecting changes before /ship. Drives an actual browser through the user flow to reproduce what the user will see — clicks, forms, error states, loading spinners. Finds the bugs that unit tests can't catch (DOM event ordering, CSS breakage, auth session edge cases, race conditions in UI state). |
UI 변경을 실제 브라우저로 사용자 흐름 재현 해서 검증하는 skill.
/ship 직전 최종 검증/vibe-coding-workflow 내부 검증으로 충분)gstack 은 /browse 전용 바이너리 (Playwright wrapper) 를 쓰지만, 이
프레임워크는 다음 중 하나를 사용:
mcp__claude-in-chrome__*) — 가장 권장.
실제 Chrome 탭에서 DOM 조작 + 스크린샷 + network 검사 + console.Plan.md 의 acceptance criteria 를 사용자 동작 순서 로 번역:
AC-1: 사용자가 로그인 후 대시보드를 본다
→ 시나리오:
1. Navigate /login
2. email + password 입력
3. submit
4. Expect redirect /dashboard
5. Expect user-name 요소에 "홍길동"
6. Expect dashboard-cards >= 1 개
Chrome MCP 쓰는 경우 단계별:
mcp__claude-in-chrome__navigate(url)mcp__claude-in-chrome__form_input 로 필드 채움mcp__claude-in-chrome__left_click 로 submitmcp__claude-in-chrome__get_page_text 또는 스크린샷으로 상태 검증mcp__claude-in-chrome__read_console_messages 로 JS 에러 확인UI QA 는 다음 5가지를 항상 확인 (단위 테스트가 놓치는 영역):
| 영역 | 구체 체크 |
|---|---|
| Loading state | spinner / skeleton 이 실제로 나타나나? |
| Empty state | 데이터 없을 때 무엇을 보이나? ("데이터 없음" 메시지 존재?) |
| Error state | 서버 5xx / 네트워크 끊김 시 UI 가 얼어붙지 않나? |
| Auth boundary | 로그인 없이 접근 시 redirect? 권한 없는 페이지는 403? |
| Event ordering | 빠르게 클릭 두 번 했을 때 중복 제출되나? |
/investigate)# QA Run — <YYYY-MM-DD> — <feature slug>
## Scenarios tested
1. <AC-1> — PASS | FAIL
2. <AC-2> — PASS | FAIL
## 필수 체크
- Loading state: PASS / FAIL / N/A
- Empty state: PASS / FAIL / N/A
- Error state: PASS / FAIL / N/A
- Auth boundary: PASS / FAIL / N/A
- Event ordering: PASS / FAIL / N/A
## Findings
- <bug 또는 이상 동작 — 스크린샷 경로 포함>
## Console errors
- <JS error 캡처>
## Verdict
- ship-ready | fix-needed | needs-more-testing
## Attachments
- screenshots: .claude/audits/qa-<ts>/screenshot-N.png
- network traces (if captured): ...
저장: .claude/audits/qa-<ts>/report.md
Plan.md 의 acceptance criteria.claude/audits/qa-*/) 로 회귀 유무 참조