Create a new QA test procedure for a feature
Generates a structured QA test procedure file for a feature. Use this to create test documentation, optionally exploring the feature with Playwright to auto-generate test steps and screenshots.
/plugin marketplace add jpoutrin/product-forge/plugin install product-design@product-forge-marketplace<feature-name> [--url <url>] [--priority <priority>]Category: Quality Assurance
create-qa-test <feature-name> [--url <url>] [--priority <priority>] [--explore]
<feature-name>: Required - Name of the feature to test (kebab-case)--url: Optional - Test environment URL for the feature--priority: Optional - Test priority (critical, high, medium, low). Default: medium--explore: Optional - Launch qa-tester agent to explore the feature via PlaywrightWhen this command is run, Claude Code should:
Generate Test ID
QA-YYYYMMDD-###-feature-name.mdCreate Directory Structure (if not exists)
qa-tests/
├── draft/
├── active/
├── executed/
├── archived/
└── screenshots/
Prompt for Details (if not provided)
Create QA Test File
qa-tests/draft/ with status DRAFTOptional: Invoke qa-tester Agent
--explore flag is set, launch the qa-tester agent# QA Test Procedure: [Feature Name]
## Metadata
- **Test ID**: QA-YYYYMMDD-###
- **Feature**: [Feature name]
- **Application**: [App name]
- **URL**: [Test environment URL]
- **Created**: [YYYY-MM-DD]
- **Author**: [Name]
- **Status**: DRAFT
- **Priority**: [Critical|High|Medium|Low]
- **Estimated Time**: [X minutes]
- **PRD Reference**: [Link if applicable]
## Prerequisites
- [ ] [Required setup step 1]
- [ ] [Test account with appropriate permissions]
- [ ] [Test data prepared]
## Test Environment
- **URL**: [Test environment URL]
- **Browser**: Chrome (latest)
- **Credentials**: See password manager
---
## Test Cases
### TC-001: [Happy Path - Main Success Scenario]
**Objective**: Verify the main success flow for [feature]
**Preconditions**:
- User is logged in
- [Feature-specific preconditions]
#### Steps
| Step | Action | Expected Result | Pass/Fail | Notes |
|------|--------|-----------------|-----------|-------|
| 1 | Navigate to [URL] | [Page loads correctly] | ☐ | |
| 2 | [Action] | [Expected outcome] | ☐ | |
| 3 | [Action] | [Expected outcome] | ☐ | |
**Postconditions**: [Expected state after test]
---
### TC-002: [Validation Test]
**Objective**: Verify input validation for [feature]
| Step | Action | Expected Result | Pass/Fail | Notes |
|------|--------|-----------------|-----------|-------|
| 1 | [Submit with empty required field] | [Error message appears] | ☐ | |
| 2 | [Enter invalid format] | [Validation error shown] | ☐ | |
---
## Edge Cases & Error Scenarios
### EC-001: [Edge Case Description]
| Step | Action | Expected Result | Pass/Fail | Notes |
|------|--------|-----------------|-----------|-------|
| 1 | [Edge case action] | [Expected behavior] | ☐ | |
---
## Summary Checklist
### Critical Path
- [ ] TC-001: [Title]
### Validation
- [ ] TC-002: [Title]
### Edge Cases
- [ ] EC-001: [Title]
---
## Test Execution Log
| Date | Tester | Environment | Build | Result | Issues |
|------|--------|-------------|-------|--------|--------|
| | | | | | |
## Notes
- [Additional observations]
- [Known limitations]
# Create a basic QA test for login
create-qa-test user-login --url https://staging.example.com/login --priority critical
# Create a test and explore with Playwright
create-qa-test checkout-flow --url https://staging.example.com/checkout --explore
# Create a simple test, will prompt for URL
create-qa-test password-reset
Created: qa-tests/draft/QA-20250105-001-user-login.md
📋 QA Test Procedure: user-login
Status: DRAFT
Priority: Critical
Location: qa-tests/draft/
Next steps:
1. Review and complete test cases
2. Add specific test data
3. Move to qa-tests/active/ when ready
When --explore flag is used:
qa-tests/screenshots/{test-id}/qa-tests/screenshots/{test-id}/elements/Before marking the QA test as complete, the agent MUST verify all screenshots are properly referenced in the final markdown file.
Check screenshot directory exists
qa-tests/screenshots/{test-id}/
├── 01-initial-state.png
├── 02-form-filled.png
├── 03-success-state.png
└── elements/
├── login-button.png
├── email-field.png
└── password-field.png
Verify all screenshots are referenced in the markdown
Add missing references If screenshots exist but aren't in the document, add them:
### TC-001: User Login
#### Steps
| Step | Action | Expected Result | Pass/Fail | Notes |
|------|--------|-----------------|-----------|-------|
| 1 | Navigate to login page | Login form displays | ☐ | |
| 2 | Enter email in **Email field** | Email accepted | ☐ | |
| 3 | Click **Login button** | Dashboard loads | ☐ | |
#### Screenshots
| Step | Screenshot | Description |
|------|------------|-------------|
| 1 |  | Login page before input |
| 3 |  | Dashboard after login |
## Element Visual Reference
| Element | Screenshot | Selector | Test Case |
|---------|------------|----------|-----------|
| Email field |  | `input#email` | TC-001 |
| Login button |  | `button[type=submit]` | TC-001 |
The agent should run these checks before completing:
1. LIST all files in qa-tests/screenshots/{test-id}/
2. SCAN the QA test markdown for image references
3. COMPARE: Are all screenshots referenced?
4. IF missing references:
- Add Screenshots section to each test case
- Add Element Visual Reference section
- Use relative paths: ./screenshots/{test-id}/filename.png
5. VERIFY: All image paths are valid (files exist)
6. REPORT: "✅ All X screenshots properly referenced" or "⚠️ Added Y missing references"
If the agent finds screenshots that aren't referenced:
## Auto-Generated Screenshot References
The following screenshots were captured but not initially referenced.
They have been added to the document:
| Screenshot | Added To | Path |
|------------|----------|------|
| 02-form-filled.png | TC-001 Screenshots | ./screenshots/QA-20250105-001/02-form-filled.png |
| submit-button.png | Element Reference | ./screenshots/QA-20250105-001/elements/submit-button.png |
list-qa-tests - List and filter existing QA testsenrich-qa-test - Add element screenshots to existing test/prd-progress - Check linked PRD implementation statusqa-screenshot-management - Screenshot naming and organizationqa-element-extraction - Extract element screenshots from test stepsqa-screenshot-validation - Validate screenshots for layout issues