本文へ移動
cccskills
無料GitHub で公開

qa

Systematically QA test any application — web apps, native macOS apps, Electron apps, CLI tools, interactive REPLs, or anything on screen. Three modes: browser (chromux/CDP, fast, DOM-level), computer (MCP computer-use, screenshot + pixel clicks, any app), and cli (tmux, send-keys + capture-pane for interactive terminals). Auto-selects mode or accepts --browser / --computer / --cli override. Use when asked to "qa", "QA", "test this site", "test this app", "find bugs", "test and fix", "fix what's broken", "dogfood", "exploratory test", "bug hunt", "QA this app", "사이트 테스트", "앱 테스트", "브라우저 QA", "화면 보고 테스트해줘", "네이티브 앱 테스트", "screen test". Three tiers: Quick (critical/high only), Standard (+ medium), Exhaustive (+ cosmetic). Produces before/after health scores, fix evidence, and a ship-readiness summary.

インストール方法を見る

含まれるファイル(8)

  • SKILL.md10.1 KB
  • references/browser-mode.md3.8 KB
  • references/browser-verify.md5.6 KB
  • references/cli-mode.md3.0 KB
  • references/computer-mode.md3.0 KB
  • references/issue-taxonomy.md3.5 KB
  • references/spec-drift-check.md5.2 KB
  • templates/qa-report-template.md2.3 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

/qa: Plan -> Test -> Fix -> Verify

You are a QA engineer AND a bug-fix engineer. Test applications like a real user — click everything, fill every form, check every state. When you find bugs, fix them in source code with atomic commits, then re-verify. Produce a structured report with before/after evidence.


Phase 0: Analyze Target & Select Mode

0.1 Parse User Request

ParameterDefaultOverride example
Target(required)URL, app name, CLI command, or "current branch"
Modeauto-detect--browser, --computer, --cli
TierStandard--quick, --exhaustive
Report-onlyfalse--report-only (no fixes)
Output dir.qa-reports/Output to /tmp/qa
ScopeFull appFocus on the billing page

0.2 Auto-Select Mode

SignalModeWhy
URL provided (http/https/localhost)browserWeb app, CDP gives DOM access
On feature branch, no URLbrowser (diff-aware)Verify branch changes locally
Native app name (Slack, Notes, Figma)computerNot a web app
Electron appcomputerDesktop app, even if web-based
CLI command, REPL, or interactive terminalcliNeeds tmux send-keys + capture-pane
--browser flagbrowserUser override
--computer flagcomputerUser override
--cli flagcliUser override
AmbiguousAskUserQuestionLet user decide

0.3 Setup Mode

Browser mode: Read references/browser-mode.md for chromux setup and interaction patterns.

Computer mode: Read references/computer-mode.md for MCP computer-use setup and interaction patterns.

CLI mode: Read references/cli-mode.md for tmux setup and interaction patterns.

0.4 Clean Working Tree (if fixing code)

If NOT --report-only and source code exists:

git status --porcelain

If dirty, use AskUserQuestion: commit / stash / abort.

0.5 Create Output Directories

mkdir -p .qa-reports/screenshots

Phase 1: Test Plan

Before touching the app, create a structured test plan. This ensures systematic coverage instead of random clicking.

1.1 Gather Context

If diff-aware (feature branch, no URL):

git diff main...HEAD --name-only
git log main..HEAD --oneline

Identify affected pages/routes from changed files.

If URL or app provided:

  • Navigate to the app (using the selected mode's tools)
  • Take an initial screenshot
  • Map the navigation structure: menus, tabs, sidebar, main content areas

1.2 Generate Test Plan

Create a test plan covering:

## Test Plan

### Target
- App: {name/URL}
- Mode: browser / computer
- Tier: quick / standard / exhaustive
- Scope: {full app or specific area}

### Screens to Test (priority order)
1. {Screen name} — {why: core feature / changed in diff / user-specified}
2. {Screen name} — {why}
3. ...

### Test Cases per Screen
For each screen, list what to verify:
- [ ] Page loads without errors
- [ ] Interactive elements respond (buttons, links, forms)
- [ ] Form validation works (empty, invalid, edge cases)
- [ ] Navigation in/out works
- [ ] Visual layout looks correct
- [ ] Empty/loading/error states handled

### Auth / Setup Required
- {Any login, data seeding, or preconditions}

### Out of Scope
- {What we're NOT testing and why}

1.3 Show Plan to User

Present the test plan briefly. For --quick mode, skip user approval and execute immediately. For standard/exhaustive, give the user a chance to adjust scope before proceeding.


Phase 2: Orient

Execute the first part of the test plan — get a map of the application.

  1. Navigate to the starting point
  2. Take initial screenshot (save as evidence)
  3. Identify framework (Next.js, Rails, SPA, native, etc.)
  4. Map navigation structure
  5. Note current state (logged in? which page?)

Phase 3: Explore & Document

Visit screens systematically in test plan order. At each screen:

  1. Navigate to the screen
  2. Take screenshot (save as evidence)
  3. Run the per-screen checklist from references/issue-taxonomy.md:
    • Visual scan
    • Interactive elements
    • Forms
    • Navigation
    • States (empty, loading, error, overflow)
    • Scroll / below-the-fold content
    • Console errors (browser mode) or visual errors (computer mode)
  4. Document issues immediately — don't batch them

Evidence collection:

  • Interactive bugs: screenshot before + after the action, write repro steps
  • Static bugs: single screenshot + zoom into affected area, describe what's wrong

Write each issue to the report using the template from templates/qa-report-template.md.

Quick mode: Only test the main screen + top 3-5 navigation targets. Skip the per-screen checklist.


Phase 4: Health Score

Compute the baseline health score using the rubric at the bottom of this file.


Phase 5: Triage

Sort issues by severity, decide which to fix based on tier:

  • Quick: Critical + high only. Mark medium/low as "deferred."
  • Standard: Critical + high + medium. Mark low as "deferred."
  • Exhaustive: Fix all, including cosmetic/low.

If --report-only or no source code: Skip Phase 6, go to Phase 7.


Phase 6: Fix Loop

For each fixable issue, in severity order:

6a. Locate Source

Use Grep/Glob to find the responsible source file(s).

6b. Fix

Make the minimal fix. Do NOT refactor surrounding code.

6c. Commit

git add <only-changed-files>
git commit -m "fix(qa): ISSUE-NNN — short description

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>"

One commit per fix. Never bundle.

6d. Re-test

Navigate back to affected screen, take before/after screenshots.

6e. Classify

  • verified: re-test confirms fix works
  • best-effort: fix applied but couldn't fully verify
  • reverted: regression detected -> git revert HEAD -> mark as "deferred"

6f. Self-Regulation

Every 5 fixes (or after any revert), compute WTF-likelihood:

Start at 0%
Each revert:                +15%
Each fix touching >3 files: +5%
After fix 15:               +1% per additional fix
All remaining Low severity: +10%
Touching unrelated files:   +20%

If WTF > 20%: STOP. Show progress. Ask user whether to continue. Hard cap: 50 fixes.


Phase 7: Final QA

  1. Re-test all affected screens
  2. Compute final health score
  3. If final score is WORSE than baseline: WARN prominently

Phase 8: Report

Write report to .qa-reports/qa-report-{target}-{YYYY-MM-DD}.md using the template.

Include:

  • Test plan summary (screens tested, mode used)
  • Per-issue details with screenshot evidence
  • Fix status: verified / best-effort / reverted / deferred
  • Health score delta: baseline -> final
  • Ship readiness one-liner

Health Score Rubric

Each category 0-100, then weighted average.

CategoryWeightScoring
Console/Errors15%0 errors=100, 1-3=70, 4-10=40, 10+=10
Navigation10%All works=100, each broken path -15
Visual10%Start 100, critical -25, high -15, med -8, low -3
Functional20%Same deduction scale
UX15%Same deduction scale
Performance10%Same deduction scale
Content5%Same deduction scale
Accessibility15%Same deduction scale

score = sum(category_score * weight)


Important Rules

  1. Plan first, test second. Always create a test plan before interacting with the app.
  2. Repro is everything. Every issue needs at least one screenshot.
  3. Verify before documenting. Retry once to confirm it's reproducible.
  4. Never include credentials. Write [REDACTED] for passwords.
  5. Write incrementally. Append each issue as you find it.
  6. Test like a user. Use realistic data. Complete workflows end-to-end.
  7. Depth over breadth. 5-10 well-documented issues > 20 vague descriptions.
  8. One commit per fix. Never bundle multiple fixes.
  9. Revert on regression. git revert HEAD immediately if a fix makes things worse.
  10. Self-regulate. Follow the WTF-likelihood heuristic.
  11. Mode-specific rules are in references/. Read the relevant mode file for interaction patterns.

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Analyze an open-source project from What/Why perspective (not how-it's-implemented). Use when the user says "/analyze-oss", "분석해줘 이 오픈소스", "이 레포 뭐하는거야", "analyze this repo", "what does X do", "이거 왜 쓰는거야", "이 라이브러리 분석", provides a GitHub URL and wants understanding, or asks to deeply understand an OSS project's purpose, value, target users, and usage flow. Clones the repo to ~/opensource-analysis/<repo-name>/ (git pull if already exists), dispatches parallel subagents per analysis lens, then synthesizes a What/Why-focused report in chat. Supports optional user-specific follow-up questions.

日本語の概要は準備中です。原文の説明を表示しています。

team-attention/hoyeon1732026年5月21日 更新

blueprint

無料

"/blueprint", "blueprint", "task graph", "contract derivation", "execution plan", "plan tasks from requirements", "contract-first planning" Turn requirements.md into an executable blueprint (plan.json + contracts.md). Five phases: Contracts → Tasks → Journeys → Verify Plan → Commit. Sits between /specify and /execute. Scope-adaptive (greenfield → bugfix). Uses hoyeon-cli (plan.json only; requirements.md is read as-is via Read tool).

日本語の概要は準備中です。原文の説明を表示しています。

team-attention/hoyeon1732026年5月21日 更新

Recon-first browser automation. Orchestrator explores the site first via chromux, saves a guide file with insights, then delegates execution to browser-explorer agent. Use when: "/browser-work", "브라우저 작업", "사이트에서 해줘", "웹에서 해줘", "LinkedIn에서", "크롬으로", "browser task", "automate this site".

日本語の概要は準備中です。原文の説明を表示しています。

team-attention/hoyeon1732026年5月21日 更新

bugfix

無料

Root cause based one-shot bug fix. debugger diagnosis → requirements.md generation → /execute. /bugfix "error description" Full investigation pipeline: debugger + gap-analyzer + standard verify. QA suggestion after successful fix.

日本語の概要は準備中です。原文の説明を表示しています。

team-attention/hoyeon1732026年5月21日 更新

check

無料

This skill should be used when the user wants to verify their changes before pushing, or update the project's rule checklists. Phase 1: validate changed files against .hoyeon/rules/ checklists and report PASS/WARN. Phase 2 (conditional): propose rule additions when unmatched patterns are detected. Essential before git push. Trigger phrases: "check", "checklist", "verify changes", "what did I miss", "pre-push check", "cascading changes", "any more changes needed", "update checklist", "update rules", "rules update", "체크", "체크리스트", "변경 확인", "빠뜨린 거 없나", "push 전 확인", "뭐 더 건드려야 해?", "연쇄 변경 확인", "규칙 갱신".

日本語の概要は準備中です。原文の説明を表示しています。

team-attention/hoyeon1732026年5月21日 更新

clarify

無料

"/clarify", "clarify this", "keep asking until clear", "remove ambiguity", "clarify requirements", "clarify design", "clarify the plan", "질문 계속해", "모호한 게 없게", "명확해질 때까지", "계속 물어봐", "Q&A로 정리", "질문답변 기록", "요구사항 명확화", "설계 명확화". Relentless ambiguity-resolution interview that records Q&A under .hoyeon/clarify/<topic>/ and hands off to specify/blueprint/docs when clear.

日本語の概要は準備中です。原文の説明を表示しています。

team-attention/hoyeon1732026年5月21日 更新

team-attention のスキルをすべて見る

このスキルの問題を報告する