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

).

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

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

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

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

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

• Scope clearly defined (in/out)
• Entry/exit criteria specified
• Risks identified with mitigations
• Timeline realistic

• Each step has expected result
• Preconditions documented
• Test data available
• Priority assigned

• Reproducible steps
• Environment documented
• Screenshots/evidence attached
• Severity/priority set

• Test Case Templates - Standard formats for all test types
• Bug Report Templates - Documentation templates
• Regression Testing Guide - Suite building and execution
• Figma Validation Guide - Design-implementation validation

• [Setup requirement 1]
• [Setup requirement 2]
• [Test data needed]

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

• Input: [Test data values]
• User: [Test account details]
• Configuration: [Environment settings]

• [System state after test]
• [Cleanup required]

• [Edge cases to consider]
• [Related test cases]
• [Known issues]

undefined

• Feature/product being tested
• Testing objectives
• Key risks
• Timeline overview

• Features to be tested
• Test types (functional, UI, performance)
• Platforms and environments
• User flows and scenarios

• Features not being tested
• Known limitations
• Third-party integrations (if applicable)

• Manual testing
• Exploratory testing
• Regression testing
• Integration testing
• User acceptance testing

• Black box testing
• Positive and negative testing
• Boundary value analysis
• Equivalence partitioning

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

• Requirements documented
• Designs finalized
• Test environment ready
• Test data prepared
• Build deployed

• All high-priority test cases executed
• 90%+ test case pass rate
• All critical bugs fixed
• No open high-severity bugs
• Regression suite passed

• Test plan document
• Test cases
• Test execution reports
• Bug reports
• Test summary report

</details>

<details>
<summary><strong>Deep Dive: Bug Reporting</strong></summary>

• 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]

1. [Specific step]
2. [Specific step]
3. [Specific step]

• Screenshot: [attached]
• Video: [link if applicable]
• Console errors: [paste errors]

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

• Related to: [Feature/ticket]
• Regression: [Yes/No]
• Figma design: [Link if UI bug]

undefined

• Figma MCP server configured
• Access to Figma design files
• Figma URLs for components/pages

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)

1. 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

1. 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 can users NOT live without?
• What generates revenue?
• What handles sensitive data?
• What's used most frequently?

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

• All P0 tests pass
• 90%+ P1 tests pass
• No critical bugs open

• Any P0 test fails
• Critical bug discovered
• Security vulnerability
• Data loss scenario

• P1 failures with workarounds
• Known issues documented
• Fix plan in place

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

• TC-045: Payment processing fails
  • Bug: BUG-234
  • Status: Open

• TC-112: Dashboard widget (API endpoint down)

• 2 critical bugs blocking release
• Payment integration needs attention

• Retest after BUG-234 fix
• Complete remaining 5 test cases
• Run full regression before sign-off

undefined

• Review requirements and designs
• Create test plan
• Identify test scenarios
• Estimate effort and timeline
• Set up test environment

• Write test cases
• Review test cases with team
• Prepare test data
• Build regression suite
• Get Figma design access

• Execute test cases
• Log bugs with clear steps
• Validate against Figma (UI tests)
• Track test progress
• Communicate blockers

• Compile test results
• Analyze coverage
• Document risks
• Provide go/no-go recommendation
• Archive test artifacts

• Be specific and unambiguous
• Include expected results for each step
• Test one thing per test case
• Use consistent naming conventions
• Keep test cases maintainable

• Assume knowledge
• Make test cases too long
• Skip preconditions
• Forget edge cases
• Leave expected results vague

• Provide clear reproduction steps
• Include screenshots/videos
• Specify exact environment details
• Describe impact on users
• Link to Figma for UI bugs

• Report without reproduction steps
• Use vague descriptions
• Skip environment details
• Forget to assign priority
• Duplicate existing bugs

• Automate repetitive tests when possible
• Maintain regression suite regularly
• Prioritize critical paths
• Run smoke tests frequently
• Update suite after each release

• Skip regression before releases
• Let suite become outdated
• Test everything every time
• Ignore failed regression tests

• User account exists (test@example.com / Test123!)
• User is not already logged in
• Browser cookies cleared

1. Navigate to https://app.example.com/login Expected: Login page displays with email and password fields
2. Enter email: test@example.com 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

• User session created
• Auth token stored
• Analytics event logged

• TC-LOGIN-002: Invalid password
• TC-LOGIN-003: Non-existent email
• TC-LOGIN-004: SQL injection attempt
• TC-LOGIN-005: Very long password

</details>

<details>
<summary><strong>Example: Responsive Design Test Case</strong></summary>

```markdown

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

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

• 375px (iPhone SE)
• 390px (iPhone 14)
• 428px (iPhone 14 Pro Max)
• 360px (Galaxy S21)

</details>

---

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

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