로그인
softaworks

qa-test-planner

by @softaworks in AI & LLM
330
14
# Install this skill:
npx skills add softaworks/agent-toolkit --skill "qa-test-planner"

Install specific skill from multi-skill repository

# Description

Generate comprehensive test plans, manual test cases, regression test suites, and bug reports for QA engineers. Includes Figma MCP integration for design validation.

# SKILL.md

name: qa-test-planner
description: Generate comprehensive test plans, manual test cases, regression test suites, and bug reports for QA engineers. Includes Figma MCP integration for design validation.
trigger: explicit

QA Test Planner

A comprehensive skill for QA engineers to create test plans, generate manual test cases, build regression test suites, validate designs against Figma, and document bugs effectively.

Activation: This skill is triggered only when explicitly called by name (e.g., /qa-test-planner, qa-test-planner, or use the skill qa-test-planner).

Quick Start

Create a test plan:

"Create a test plan for the user authentication feature"

Generate test cases:

"Generate manual test cases for the checkout flow"

Build regression suite:

"Build a regression test suite for the payment module"

Validate against Figma:

"Compare the login page against the Figma design at [URL]"

Create bug report:

"Create a bug report for the form validation issue"

Quick Reference

Task What You Get Time
Test Plan Strategy, scope, schedule, risks 10-15 min
Test Cases Step-by-step instructions, expected results 5-10 min each
Regression Suite Smoke tests, critical paths, execution order 15-20 min
Figma Validation Design-implementation comparison, discrepancy list 10-15 min
Bug Report Reproducible steps, environment, evidence 5 min

How It Works

Your Request
    │
    ▼
┌─────────────────────────────────────────────────────┐
│ 1. ANALYZE                                          │
│    • Parse feature/requirement                      │
│    • Identify test types needed                     │
│    • Determine scope and priorities                 │
├─────────────────────────────────────────────────────┤
│ 2. GENERATE                                         │
│    • Create structured deliverables                 │
│    • Apply templates and best practices             │
│    • Include edge cases and variations              │
├─────────────────────────────────────────────────────┤
│ 3. VALIDATE                                         │
│    • Check completeness                             │
│    • Verify traceability                            │
│    • Ensure actionable steps                        │
└─────────────────────────────────────────────────────┘
    │
    ▼
QA Deliverable Ready

Commands

Interactive Scripts

Script Purpose Usage
./scripts/generate_test_cases.sh Create test cases interactively Step-by-step prompts
./scripts/create_bug_report.sh Generate bug reports Guided input collection

Natural Language

Request Output
"Create test plan for {feature}" Complete test plan document
"Generate {N} test cases for {feature}" Numbered test cases with steps
"Build smoke test suite" Critical path tests
"Compare with Figma at {URL}" Visual validation checklist
"Document bug: {description}" Structured bug report

Core Deliverables

1. Test Plans

  • Test scope and objectives
  • Testing approach and strategy
  • Environment requirements
  • Entry/exit criteria
  • Risk assessment
  • Timeline and milestones

2. Manual Test Cases

  • Step-by-step instructions
  • Expected vs actual results
  • Preconditions and setup
  • Test data requirements
  • Priority and severity

3. Regression Suites

  • Smoke tests (15-30 min)
  • Full regression (2-4 hours)
  • Targeted regression (30-60 min)
  • Execution order and dependencies

4. Figma Validation

  • Component-by-component comparison
  • Spacing and typography checks
  • Color and visual consistency
  • Interactive state validation

5. Bug Reports

  • Clear reproduction steps
  • Environment details
  • Evidence (screenshots, logs)
  • Severity and priority

Anti-Patterns

Avoid Why Instead
Vague test steps Can't reproduce Specific actions + expected results
Missing preconditions Tests fail unexpectedly Document all setup requirements
No test data Tester blocked Provide sample data or generation
Generic bug titles Hard to track Specific: "[Feature] issue when [action]"
Skip edge cases Miss critical bugs Include boundary values, nulls

Verification Checklist

Test Plan:
- [ ] Scope clearly defined (in/out)
- [ ] Entry/exit criteria specified
- [ ] Risks identified with mitigations
- [ ] Timeline realistic

Test Cases:
- [ ] Each step has expected result
- [ ] Preconditions documented
- [ ] Test data available
- [ ] Priority assigned

Bug Reports:
- [ ] Reproducible steps
- [ ] Environment documented
- [ ] Screenshots/evidence attached
- [ ] Severity/priority set

References

Deep Dive: Test Case Structure ### Standard Test Case Format 
## TC-001: [Test Case Title]

**Priority:** High | Medium | Low
**Type:** Functional | UI | Integration | Regression
**Status:** Not Run | Pass | Fail | Blocked

### Objective
[What are we testing and why]

### Preconditions
- [Setup requirement 1]
- [Setup requirement 2]
- [Test data needed]

### Test Steps
1. [Action to perform]
   **Expected:** [What should happen]

2. [Action to perform]
   **Expected:** [What should happen]

3. [Action to perform]
   **Expected:** [What should happen]

### Test Data
- Input: [Test data values]
- User: [Test account details]
- Configuration: [Environment settings]

### Post-conditions
- [System state after test]
- [Cleanup required]

### Notes
- [Edge cases to consider]
- [Related test cases]
- [Known issues]
### Test Types | Type | Focus | Example | |------|-------|---------| | Functional | Business logic | Login with valid credentials | | UI/Visual | Appearance, layout | Button matches Figma design | | Integration | Component interaction | API returns data to frontend | | Regression | Existing functionality | Previous features still work | | Performance | Speed, load handling | Page loads under 3 seconds | | Security | Vulnerabilities | SQL injection prevented |
Deep Dive: Test Plan Template ### Test Plan Structure 
# Test Plan: [Feature/Release Name]

## Executive Summary
- Feature/product being tested
- Testing objectives
- Key risks
- Timeline overview

## Test Scope

**In Scope:**
- Features to be tested
- Test types (functional, UI, performance)
- Platforms and environments
- User flows and scenarios

**Out of Scope:**
- Features not being tested
- Known limitations
- Third-party integrations (if applicable)

## Test Strategy

**Test Types:**
- Manual testing
- Exploratory testing
- Regression testing
- Integration testing
- User acceptance testing

**Test Approach:**
- Black box testing
- Positive and negative testing
- Boundary value analysis
- Equivalence partitioning

## Test Environment
- Operating systems
- Browsers and versions
- Devices (mobile, tablet, desktop)
- Test data requirements
- Backend/API environments

## Entry Criteria
- [ ] Requirements documented
- [ ] Designs finalized
- [ ] Test environment ready
- [ ] Test data prepared
- [ ] Build deployed

## Exit Criteria
- [ ] All high-priority test cases executed
- [ ] 90%+ test case pass rate
- [ ] All critical bugs fixed
- [ ] No open high-severity bugs
- [ ] Regression suite passed

## Risk Assessment

| Risk | Probability | Impact | Mitigation |
|------|-------------|--------|------------|
| [Risk 1] | H/M/L | H/M/L | [Mitigation] |

## Test Deliverables
- Test plan document
- Test cases
- Test execution reports
- Bug reports
- Test summary report
Deep Dive: Bug Reporting ### Bug Report Template 
# BUG-[ID]: [Clear, specific title]

**Severity:** Critical | High | Medium | Low
**Priority:** P0 | P1 | P2 | P3
**Type:** Functional | UI | Performance | Security
**Status:** Open | In Progress | Fixed | Closed

## Environment
- **OS:** [Windows 11, macOS 14, etc.]
- **Browser:** [Chrome 120, Firefox 121, etc.]
- **Device:** [Desktop, iPhone 15, etc.]
- **Build:** [Version/commit]
- **URL:** [Page where bug occurs]

## Description
[Clear, concise description of the issue]

## Steps to Reproduce
1. [Specific step]
2. [Specific step]
3. [Specific step]

## Expected Behavior
[What should happen]

## Actual Behavior
[What actually happens]

## Visual Evidence
- Screenshot: [attached]
- Video: [link if applicable]
- Console errors: [paste errors]

## Impact
- **User Impact:** [How many users affected]
- **Frequency:** [Always, Sometimes, Rarely]
- **Workaround:** [If one exists]

## Additional Context
- Related to: [Feature/ticket]
- Regression: [Yes/No]
- Figma design: [Link if UI bug]
### Severity Definitions | Level | Criteria | Examples | |-------|----------|----------| | **Critical (P0)** | System crash, data loss, security | Payment fails, login broken | | **High (P1)** | Major feature broken, no workaround | Search not working | | **Medium (P2)** | Feature partial, workaround exists | Filter missing one option | | **Low (P3)** | Cosmetic, rare edge cases | Typo, minor alignment |
Deep Dive: Figma MCP Integration ### Design Validation Workflow **Prerequisites:** - Figma MCP server configured - Access to Figma design files - Figma URLs for components/pages **Process:** 1. **Get Design Specs from Figma** 
"Get the button specifications from Figma file [URL]"

Response includes:
- Dimensions (width, height)
- Colors (background, text, border)
- Typography (font, size, weight)
- Spacing (padding, margin)
- Border radius
- States (default, hover, active, disabled)
2. **Compare Implementation** 
TC: Primary Button Visual Validation
1. Inspect primary button in browser dev tools
2. Compare against Figma specs:
   - Dimensions: 120x40px
   - Border-radius: 8px
   - Background color: #0066FF
   - Font: 16px Medium #FFFFFF
3. Document discrepancies
3. **Create Bug if Mismatch** 
BUG: Primary button color doesn't match design
Severity: Medium
Expected (Figma): #0066FF
Actual (Implementation): #0052CC
Screenshot: [attached]
Figma link: [specific component]
### What to Validate | Element | What to Check | Tool | |---------|---------------|------| | Colors | Hex values exact | Browser color picker | | Spacing | Padding/margin px | DevTools computed styles | | Typography | Font, size, weight | DevTools font panel | | Layout | Width, height, position | DevTools box model | | States | Hover, active, focus | Manual interaction | | Responsive | Breakpoint behavior | DevTools device mode | ### Example Queries 
"Get button specifications from Figma design [URL]"
"Compare navigation menu implementation against Figma design"
"Extract spacing values for dashboard layout from Figma"
"List all color tokens used in Figma design system"
Deep Dive: Regression Testing ### Suite Structure | Suite Type | Duration | Frequency | Coverage | |------------|----------|-----------|----------| | Smoke | 15-30 min | Daily | Critical paths only | | Targeted | 30-60 min | Per change | Affected areas | | Full | 2-4 hours | Weekly/Release | Comprehensive | | Sanity | 10-15 min | After hotfix | Quick validation | ### Building a Regression Suite **Step 1: Identify Critical Paths** - What can users NOT live without? - What generates revenue? - What handles sensitive data? - What's used most frequently? **Step 2: Prioritize Test Cases** | Priority | Description | Must Run | |----------|-------------|----------| | P0 | Business-critical, security | Always | | P1 | Major features, common flows | Weekly+ | | P2 | Minor features, edge cases | Releases | **Step 3: Execution Order** 1. Smoke first - if fails, stop and fix build 2. P0 tests next - must pass before proceeding 3. P1 then P2 - track all failures 4. Exploratory - find unexpected issues ### Pass/Fail Criteria **PASS:** - All P0 tests pass - 90%+ P1 tests pass - No critical bugs open **FAIL (Block Release):** - Any P0 test fails - Critical bug discovered - Security vulnerability - Data loss scenario **CONDITIONAL:** - P1 failures with workarounds - Known issues documented - Fix plan in place
Deep Dive: Test Execution Tracking ### Test Run Report Template 
# Test Run: [Release Version]

**Date:** 2024-01-15
**Build:** v2.5.0-rc1
**Tester:** [Name]
**Environment:** Staging

## Summary
- Total Test Cases: 150
- Executed: 145
- Passed: 130
- Failed: 10
- Blocked: 5
- Not Run: 5
- Pass Rate: 90%

## Test Cases by Priority

| Priority | Total | Pass | Fail | Blocked |
|----------|-------|------|------|---------|
| P0 (Critical) | 25 | 23 | 2 | 0 |
| P1 (High) | 50 | 45 | 3 | 2 |
| P2 (Medium) | 50 | 45 | 3 | 2 |
| P3 (Low) | 25 | 17 | 2 | 1 |

## Critical Failures
- TC-045: Payment processing fails
  - Bug: BUG-234
  - Status: Open

## Blocked Tests
- TC-112: Dashboard widget (API endpoint down)

## Risks
- 2 critical bugs blocking release
- Payment integration needs attention

## Next Steps
- Retest after BUG-234 fix
- Complete remaining 5 test cases
- Run full regression before sign-off
### Coverage Tracking 
## Coverage Matrix

| Feature | Requirements | Test Cases | Status | Gaps |
|---------|--------------|------------|--------|------|
| Login | 8 | 12 | Complete | None |
| Checkout | 15 | 10 | Partial | Payment errors |
| Dashboard | 12 | 15 | Complete | None |
QA Process Workflow ### Phase 1: Planning - [ ] Review requirements and designs - [ ] Create test plan - [ ] Identify test scenarios - [ ] Estimate effort and timeline - [ ] Set up test environment ### Phase 2: Test Design - [ ] Write test cases - [ ] Review test cases with team - [ ] Prepare test data - [ ] Build regression suite - [ ] Get Figma design access ### Phase 3: Execution - [ ] Execute test cases - [ ] Log bugs with clear steps - [ ] Validate against Figma (UI tests) - [ ] Track test progress - [ ] Communicate blockers ### Phase 4: Reporting - [ ] Compile test results - [ ] Analyze coverage - [ ] Document risks - [ ] Provide go/no-go recommendation - [ ] Archive test artifacts
Best Practices ### Test Case Writing **DO:** - Be specific and unambiguous - Include expected results for each step - Test one thing per test case - Use consistent naming conventions - Keep test cases maintainable **DON'T:** - Assume knowledge - Make test cases too long - Skip preconditions - Forget edge cases - Leave expected results vague ### Bug Reporting **DO:** - Provide clear reproduction steps - Include screenshots/videos - Specify exact environment details - Describe impact on users - Link to Figma for UI bugs **DON'T:** - Report without reproduction steps - Use vague descriptions - Skip environment details - Forget to assign priority - Duplicate existing bugs ### Regression Testing **DO:** - Automate repetitive tests when possible - Maintain regression suite regularly - Prioritize critical paths - Run smoke tests frequently - Update suite after each release **DON'T:** - Skip regression before releases - Let suite become outdated - Test everything every time - Ignore failed regression tests

Examples

Example: Login Flow Test Case 
## TC-LOGIN-001: Valid User Login

**Priority:** P0 (Critical)
**Type:** Functional
**Estimated Time:** 2 minutes

### Objective
Verify users can successfully login with valid credentials

### Preconditions
- User account exists ([email protected] / Test123!)
- User is not already logged in
- Browser cookies cleared

### Test Steps
1. Navigate to https://app.example.com/login
   **Expected:** Login page displays with email and password fields

2. Enter email: [email protected]
   **Expected:** Email field accepts input

3. Enter password: Test123!
   **Expected:** Password field shows masked characters

4. Click "Login" button
   **Expected:**
   - Loading indicator appears
   - User redirected to /dashboard
   - Welcome message shown: "Welcome back, Test User"
   - Avatar/profile image displayed in header

### Post-conditions
- User session created
- Auth token stored
- Analytics event logged

### Edge Cases to Consider
- TC-LOGIN-002: Invalid password
- TC-LOGIN-003: Non-existent email
- TC-LOGIN-004: SQL injection attempt
- TC-LOGIN-005: Very long password
Example: Responsive Design Test Case 
## TC-UI-045: Mobile Navigation Menu

**Priority:** P1 (High)
**Type:** UI/Responsive
**Devices:** Mobile (iPhone, Android)

### Objective
Verify navigation menu works correctly on mobile devices

### Preconditions
- Access from mobile device or responsive mode
- Viewport width: 375px (iPhone SE) to 428px (iPhone Pro Max)

### Test Steps
1. Open homepage on mobile device
   **Expected:** Hamburger menu icon visible (top-right)

2. Tap hamburger icon
   **Expected:**
   - Menu slides in from right
   - Overlay appears over content
   - Close (X) button visible

3. Tap menu item
   **Expected:** Navigate to section, menu closes

4. Compare against Figma mobile design [link]
   **Expected:**
   - Menu width: 280px
   - Slide animation: 300ms ease-out
   - Overlay opacity: 0.5, color #000000
   - Font size: 16px, line-height 24px

### Breakpoints to Test
- 375px (iPhone SE)
- 390px (iPhone 14)
- 428px (iPhone 14 Pro Max)
- 360px (Galaxy S21)

"Testing shows the presence, not the absence of bugs." - Edsger Dijkstra

"Quality is not an act, it is a habit." - Aristotle

# Related Skills

# Supported AI Coding Agents

This skill is compatible with the SKILL.md standard and works with all major AI coding agents:

⚡ Amp 🚀 Antigravity 🤖 Claude Code 🦀 Clawdbot 📝 Codex ▶️ Cursor 🤖 Droid 💎 Gemini CLI 🐙 GitHub Copilot 🪿 Goose 📊 Kilo Code 🔧 Kiro CLI 💻 OpenCode 🦘 Roo Code 🌲 Trae 🏄 Windsurf

Learn more about the SKILL.md standard and how to use these skills with your preferred AI coding agent.