From ccc-skills
Automates UAT for web apps: analyzes git branches/specs, generates test cases, sets up dev server, runs Playwright E2E tests with screenshots, reports pass/fail and fixes.
npx claudepluginhub joshuarweaver/cascade-code-general-misc-3 --plugin ooiyeefei-cccThis skill uses the workspace's default tool permissions.
End-to-end UAT workflow: analyze → generate test cases → set up environment → execute → report.
Guides Next.js Cache Components and Partial Prerendering (PPR) with cacheComponents enabled. Implements 'use cache', cacheLife(), cacheTag(), revalidateTag(), static/dynamic optimization, and cache debugging.
Guides building MCP servers enabling LLMs to interact with external services via tools. Covers best practices, TypeScript/Node (MCP SDK), Python (FastMCP).
Generates original PNG/PDF visual art via design philosophy manifestos for posters, graphics, and static designs on user request.
End-to-end UAT workflow: analyze → generate test cases → set up environment → execute → report.
Phase 1: Discovery
├─ Read spec/requirements (if provided)
├─ Analyze git branch diff against base
└─ Identify what was built/changed
Phase 2: Environment Setup
├─ Determine target: local or production/staging?
├─ Local path:
│ ├─ Check for .env.local → ask user if missing
│ └─ Start dev server (npm run dev or equivalent)
├─ Prod/staging path:
│ └─ Get application URL, verify reachable
└─ Ask user for test account credentials (both paths)
Phase 3: Test Case Generation
├─ Write uat-test-cases.md (see references/test-case-template.md)
├─ Cover: happy path, errors, persistence, auth, responsive
└─ Present to user for review before execution
Phase 4: Test Execution
├─ Start dev server (framework-appropriate command)
├─ Authenticate with test account via browser
├─ Execute test cases with Playwright MCP tools
├─ Take screenshots as evidence
└─ If a test fails → document the failure, continue testing
Phase 5: Reporting
├─ Write uat-results.md (see references/results-template.md)
├─ Include: summary table, detailed results, screenshots, fixes
└─ Present overall PASS/FAIL verdict
Look for feature context in this priority order:
specs/[branch-name]/spec.md or specs/[feature-id]/spec.mdtasks/todo.md or similar for what was plannedgh pr view# What branch are we on?
git branch --show-current
# What changed vs base branch?
git log main..HEAD --oneline
git diff main..HEAD --stat
# What files were modified?
git diff main..HEAD --name-only
Read the changed files to understand what was built. Focus on:
Summarize findings to the user:
Ask the user (or infer from context) whether this is local or production testing:
Are we testing locally (I'll start the dev server) or against a deployed environment (provide the URL)?
| Aspect | Local | Production / Staging |
|---|---|---|
| Server | Start with npm run dev | Already running at provided URL |
| Env vars | Need .env.local with all keys | N/A — app is already configured |
| Test data | May need seeding or setup | Uses existing real/staging data |
| Auth | Test account on local auth provider | Test account on prod/staging auth |
| Base URL | http://localhost:3000 (or configured port) | https://app.example.com |
# Check if env file exists
ls -la .env.local .env 2>/dev/null
If .env.local does not exist, ask the user:
I don't see a
.env.localfile. Do you have an environment file or credentials I should use? Common needs:
- Database connection (e.g., Convex URL/deploy key)
- Auth provider keys (e.g., Clerk publishable/secret key)
- API keys (e.g., AI model keys, external service keys)
Please provide the file path or paste the required variables.
Detect the framework and start the dev server:
| Signal | Framework | Start Command |
|---|---|---|
next.config.* | Next.js | npm run dev |
vite.config.* | Vite | npm run dev |
angular.json | Angular | ng serve |
nuxt.config.* | Nuxt | npm run dev |
package.json scripts | Generic | Read dev script |
If the project needs multiple services (e.g., Next.js + Convex), start all of them.
Verify the server is reachable before proceeding:
curl -s -o /dev/null -w "%{http_code}" http://localhost:3000
No server startup or env file needed. Ask the user for:
Please provide:
- Application URL (e.g.,
https://app.example.com)- Any test data considerations (is there a staging org/business to use?)
Verify the URL is reachable:
curl -s -o /dev/null -w "%{http_code}" https://app.example.com
Always ask before attempting to authenticate:
For UAT testing I need a test account to log in. Most auth systems require email verification, so I can't create a new account.
Please provide:
- Login URL (if not the default
/sign-in)- Email/username for the test account
- Password
- Any 2FA/MFA steps I should be aware of
- Which business/org/team to select after login (if applicable)
Read references/test-case-template.md for the full template format.
Write uat-test-cases.md to the spec directory (e.g., specs/[feature-id]/uat-test-cases.md) or to the project root if no spec directory exists.
Present the test cases to the user for review before executing. Ask:
I've generated [N] test cases in [file path]. Review them and let me know:
- Any test cases to add or remove?
- Any priority adjustments?
- Ready to proceed with execution?
Load the Playwright tools via ToolSearch before starting:
ToolSearch: "playwright browser"
Key tools: browser_navigate, browser_snapshot, browser_click, browser_fill_form, browser_type, browser_press_key, browser_take_screenshot, browser_wait_for, browser_console_messages, browser_evaluate.
See references/agent-guide.md for the full tool reference and auth handling patterns.
For each test case:
browser_wait_for or snapshot check)browser_snapshot (check accessibility tree for expected text/elements)browser_take_screenshot for evidencebrowser_console_messages for JS errorsWhen a test fails:
browser_console_messages)Save screenshots to the project root with descriptive names:
uat-tc001-invoice-card.png
uat-tc002-cashflow-dashboard.png
uat-tc003-fail-missing-button.png
Read references/results-template.md for the full report format.
Write uat-results.md alongside the test cases file.
Include: