opencode-goopspec 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +650 -0
- package/agents/goop-debugger.md +265 -0
- package/agents/goop-designer.md +244 -0
- package/agents/goop-executor.md +217 -0
- package/agents/goop-explorer.md +252 -0
- package/agents/goop-librarian.md +197 -0
- package/agents/goop-orchestrator.md +224 -0
- package/agents/goop-planner.md +231 -0
- package/agents/goop-researcher.md +246 -0
- package/agents/goop-tester.md +245 -0
- package/agents/goop-verifier.md +266 -0
- package/agents/goop-writer.md +293 -0
- package/agents/memory-distiller.md +226 -0
- package/commands/goop-accept.md +183 -0
- package/commands/goop-amend.md +175 -0
- package/commands/goop-complete.md +206 -0
- package/commands/goop-debug.md +318 -0
- package/commands/goop-discuss.md +138 -0
- package/commands/goop-execute.md +137 -0
- package/commands/goop-help.md +82 -0
- package/commands/goop-map-codebase.md +501 -0
- package/commands/goop-memory.md +66 -0
- package/commands/goop-milestone.md +213 -0
- package/commands/goop-pause.md +61 -0
- package/commands/goop-plan.md +78 -0
- package/commands/goop-quick.md +165 -0
- package/commands/goop-recall.md +48 -0
- package/commands/goop-remember.md +71 -0
- package/commands/goop-research.md +98 -0
- package/commands/goop-resume.md +57 -0
- package/commands/goop-setup.md +208 -0
- package/commands/goop-specify.md +145 -0
- package/commands/goop-status.md +153 -0
- package/dist/index.js +31017 -0
- package/dist/memory/index.js +48752 -0
- package/package.json +73 -0
- package/references/agent-patterns.md +334 -0
- package/references/boundary-system.md +141 -0
- package/references/deviation-rules.md +80 -0
- package/references/dispatch-patterns.md +176 -0
- package/references/model-profiles.md +109 -0
- package/references/orchestrator-philosophy.md +280 -0
- package/references/security-checklist.md +163 -0
- package/references/subagent-protocol.md +393 -0
- package/references/tdd.md +231 -0
- package/references/ui-brand.md +261 -0
- package/references/workflow-accept.md +325 -0
- package/references/workflow-execute.md +315 -0
- package/references/workflow-plan.md +179 -0
- package/references/workflow-research.md +234 -0
- package/references/workflow-specify.md +278 -0
- package/skills/README.md +362 -0
- package/skills/accessibility/skill.md +41 -0
- package/skills/accessibility-testing/skill.md +47 -0
- package/skills/api-docs/skill.md +50 -0
- package/skills/architecture-design/skill.md +168 -0
- package/skills/atomic-commits/skill.md +53 -0
- package/skills/code-review/skill.md +59 -0
- package/skills/codebase-mapping/skill.md +54 -0
- package/skills/convention-detection/skill.md +68 -0
- package/skills/debugging/skill.md +59 -0
- package/skills/deviation-handling/skill.md +187 -0
- package/skills/documentation/skill.md +213 -0
- package/skills/goop-core/skill.md +383 -0
- package/skills/memory-usage/skill.md +208 -0
- package/skills/parallel-planning/skill.md +170 -0
- package/skills/pattern-extraction/skill.md +73 -0
- package/skills/performance-optimization/skill.md +188 -0
- package/skills/playwright/skill.md +69 -0
- package/skills/playwright-testing/skill.md +93 -0
- package/skills/progress-tracking/skill.md +155 -0
- package/skills/readme-generation/skill.md +87 -0
- package/skills/research/skill.md +161 -0
- package/skills/responsive-design/skill.md +76 -0
- package/skills/scientific-method/skill.md +67 -0
- package/skills/security-audit/skill.md +152 -0
- package/skills/task-decomposition/skill.md +153 -0
- package/skills/task-delegation/skill.md +127 -0
- package/skills/technical-writing/skill.md +69 -0
- package/skills/testing/skill.md +202 -0
- package/skills/ui-design/skill.md +73 -0
- package/skills/ux-patterns/skill.md +82 -0
- package/skills/verification/skill.md +178 -0
- package/skills/visual-regression/skill.md +86 -0
- package/templates/blueprint.md +141 -0
- package/templates/chronicle.md +156 -0
- package/templates/milestone.md +131 -0
- package/templates/research.md +117 -0
- package/templates/retrospective.md +188 -0
- package/templates/spec.md +103 -0
- package/templates/summary.md +202 -0
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: task-decomposition
|
|
3
|
+
description: Break down complex tasks into manageable units
|
|
4
|
+
category: core
|
|
5
|
+
triggers:
|
|
6
|
+
- decompose
|
|
7
|
+
- breakdown
|
|
8
|
+
- split
|
|
9
|
+
- tasks
|
|
10
|
+
version: 0.1.0
|
|
11
|
+
requires:
|
|
12
|
+
- goop-core
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
# Task Decomposition Skill
|
|
16
|
+
|
|
17
|
+
## Decomposition Principles
|
|
18
|
+
|
|
19
|
+
### 1. Single Responsibility
|
|
20
|
+
Each task does one thing well.
|
|
21
|
+
|
|
22
|
+
### 2. Independently Testable
|
|
23
|
+
Each task can be verified in isolation.
|
|
24
|
+
|
|
25
|
+
### 3. Clear Boundaries
|
|
26
|
+
No ambiguity about where one task ends and another begins.
|
|
27
|
+
|
|
28
|
+
### 4. Reasonable Size
|
|
29
|
+
Tasks should take 15-60 minutes, not hours or days.
|
|
30
|
+
|
|
31
|
+
### 5. Dependency Awareness
|
|
32
|
+
Identify genuine dependencies, avoid false chains.
|
|
33
|
+
|
|
34
|
+
## Decomposition Process
|
|
35
|
+
|
|
36
|
+
### Step 1: Identify the Goal
|
|
37
|
+
What is the end state? What problem are we solving?
|
|
38
|
+
|
|
39
|
+
### Step 2: List Major Components
|
|
40
|
+
What are the big pieces that make up the solution?
|
|
41
|
+
|
|
42
|
+
### Step 3: Break Into Tasks
|
|
43
|
+
For each component, what specific work items exist?
|
|
44
|
+
|
|
45
|
+
### Step 4: Identify Dependencies
|
|
46
|
+
Which tasks must complete before others can start?
|
|
47
|
+
|
|
48
|
+
### Step 5: Estimate Complexity
|
|
49
|
+
Rate each task: Small (15m), Medium (30m), Large (60m)
|
|
50
|
+
|
|
51
|
+
### Step 6: Group Into Waves
|
|
52
|
+
Parallel tasks in same wave, sequential across waves.
|
|
53
|
+
|
|
54
|
+
## Task Granularity Guide
|
|
55
|
+
|
|
56
|
+
### Too Large
|
|
57
|
+
❌ "Implement authentication system"
|
|
58
|
+
|
|
59
|
+
### Just Right
|
|
60
|
+
✓ "Create user model with password hashing"
|
|
61
|
+
✓ "Implement login endpoint"
|
|
62
|
+
✓ "Add session management"
|
|
63
|
+
✓ "Write authentication tests"
|
|
64
|
+
|
|
65
|
+
### Too Small
|
|
66
|
+
❌ "Add email field to user model"
|
|
67
|
+
❌ "Import bcrypt library"
|
|
68
|
+
|
|
69
|
+
## Task Format
|
|
70
|
+
|
|
71
|
+
```xml
|
|
72
|
+
<task type="auto">
|
|
73
|
+
### Task 1: {Verb + Object}
|
|
74
|
+
|
|
75
|
+
**Description:**
|
|
76
|
+
{2-3 sentences explaining what and why}
|
|
77
|
+
|
|
78
|
+
**Files:**
|
|
79
|
+
- `path/to/file.ts`
|
|
80
|
+
|
|
81
|
+
**Verify:**
|
|
82
|
+
```bash
|
|
83
|
+
npm test -- --testPathPattern=feature
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
**Done:**
|
|
87
|
+
- [ ] Criterion 1
|
|
88
|
+
- [ ] Criterion 2
|
|
89
|
+
</task>
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## Dependency Types
|
|
93
|
+
|
|
94
|
+
### Hard Dependency
|
|
95
|
+
Task B literally cannot start until Task A completes.
|
|
96
|
+
```
|
|
97
|
+
Task A: Create database schema
|
|
98
|
+
Task B: Implement repository (needs schema)
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
### Soft Dependency
|
|
102
|
+
Task B is easier if Task A completes first, but not required.
|
|
103
|
+
```
|
|
104
|
+
Task A: Set up linting
|
|
105
|
+
Task B: Implement feature (can work without linting)
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
### No Dependency
|
|
109
|
+
Tasks are completely independent.
|
|
110
|
+
```
|
|
111
|
+
Task A: Implement auth
|
|
112
|
+
Task B: Implement logging
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
## Wave Planning
|
|
116
|
+
|
|
117
|
+
```
|
|
118
|
+
Wave 1: Foundation (no dependencies)
|
|
119
|
+
├── Setup project structure
|
|
120
|
+
├── Configure database
|
|
121
|
+
└── Set up testing framework
|
|
122
|
+
|
|
123
|
+
Wave 2: Core Features (depends on Wave 1)
|
|
124
|
+
├── Implement user model
|
|
125
|
+
├── Implement auth endpoints
|
|
126
|
+
└── Implement session management
|
|
127
|
+
|
|
128
|
+
Wave 3: Integration (depends on Wave 2)
|
|
129
|
+
├── Connect frontend to auth
|
|
130
|
+
└── Write E2E tests
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
## Anti-Patterns
|
|
134
|
+
|
|
135
|
+
### Kitchen Sink Task
|
|
136
|
+
❌ Task includes too many unrelated items.
|
|
137
|
+
|
|
138
|
+
### Vague Task
|
|
139
|
+
❌ "Make it work" or "Fix the thing"
|
|
140
|
+
|
|
141
|
+
### Circular Dependencies
|
|
142
|
+
❌ Task A needs B, Task B needs A.
|
|
143
|
+
|
|
144
|
+
### Premature Optimization
|
|
145
|
+
❌ "Optimize database queries" before queries exist.
|
|
146
|
+
|
|
147
|
+
## Best Practices
|
|
148
|
+
|
|
149
|
+
1. **Start with verifiable tasks** - If you can't verify it, it's too vague
|
|
150
|
+
2. **Vertical slices** - Complete user-visible features
|
|
151
|
+
3. **Front-load risks** - Tackle uncertain tasks early
|
|
152
|
+
4. **Include verification** - Every task has a "done" check
|
|
153
|
+
5. **Buffer time** - Plan 80% capacity, leave room for surprises
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: task-delegation
|
|
3
|
+
description: Patterns for delegating tasks to specialized agents
|
|
4
|
+
category: core
|
|
5
|
+
triggers:
|
|
6
|
+
- delegate
|
|
7
|
+
- spawn
|
|
8
|
+
- subagent
|
|
9
|
+
- task
|
|
10
|
+
version: 0.1.0
|
|
11
|
+
requires:
|
|
12
|
+
- goop-core
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
# Task Delegation Skill
|
|
16
|
+
|
|
17
|
+
## When to Delegate
|
|
18
|
+
|
|
19
|
+
Delegate when:
|
|
20
|
+
- Task requires specialized expertise (testing, security, documentation)
|
|
21
|
+
- Context is getting bloated (>70% usage)
|
|
22
|
+
- Task can run in parallel with other work
|
|
23
|
+
- Fresh perspective needed
|
|
24
|
+
|
|
25
|
+
Don't delegate when:
|
|
26
|
+
- Task is trivial (<5 minutes)
|
|
27
|
+
- Heavy context sharing required
|
|
28
|
+
- Sequential dependency on current work
|
|
29
|
+
|
|
30
|
+
## Delegation Patterns
|
|
31
|
+
|
|
32
|
+
### Sequential Delegation
|
|
33
|
+
|
|
34
|
+
```json
|
|
35
|
+
{
|
|
36
|
+
"mode": "sequential",
|
|
37
|
+
"tasks": [
|
|
38
|
+
{ "agent": "planner", "task": "Create plan" },
|
|
39
|
+
{ "agent": "executor", "task": "Implement plan" },
|
|
40
|
+
{ "agent": "verifier", "task": "Verify implementation" }
|
|
41
|
+
]
|
|
42
|
+
}
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### Parallel Delegation
|
|
46
|
+
|
|
47
|
+
```json
|
|
48
|
+
{
|
|
49
|
+
"mode": "parallel",
|
|
50
|
+
"max_concurrent": 3,
|
|
51
|
+
"tasks": [
|
|
52
|
+
{ "agent": "executor", "task": "Implement feature A" },
|
|
53
|
+
{ "agent": "executor", "task": "Implement feature B" },
|
|
54
|
+
{ "agent": "tester", "task": "Write tests" }
|
|
55
|
+
]
|
|
56
|
+
}
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
### Background Delegation
|
|
60
|
+
|
|
61
|
+
```json
|
|
62
|
+
{
|
|
63
|
+
"mode": "background",
|
|
64
|
+
"agent": "researcher",
|
|
65
|
+
"task": "Research best practices",
|
|
66
|
+
"notify_on_complete": true
|
|
67
|
+
}
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
## Agent Selection
|
|
71
|
+
|
|
72
|
+
| Task Type | Agent | Model Tier |
|
|
73
|
+
|-----------|-------|------------|
|
|
74
|
+
| Planning | goop-planner | quality |
|
|
75
|
+
| Implementation | goop-executor | balanced |
|
|
76
|
+
| Verification | goop-verifier | quality |
|
|
77
|
+
| Research | goop-researcher | balanced |
|
|
78
|
+
| Documentation | goop-writer | budget |
|
|
79
|
+
| Testing | goop-tester | balanced |
|
|
80
|
+
| Debugging | goop-debugger | quality |
|
|
81
|
+
| Security | goop-verifier | quality |
|
|
82
|
+
|
|
83
|
+
## Context Handoff
|
|
84
|
+
|
|
85
|
+
When delegating, pass:
|
|
86
|
+
1. **Essential state:** Current phase, spec, todos
|
|
87
|
+
2. **Relevant files:** Only files the agent needs
|
|
88
|
+
3. **Recent decisions:** Last 3-5 ADL entries
|
|
89
|
+
4. **Constraints:** Boundaries, deadlines, blockers
|
|
90
|
+
|
|
91
|
+
Don't pass:
|
|
92
|
+
- Full conversation history
|
|
93
|
+
- Verbose logs
|
|
94
|
+
- Unrelated file contents
|
|
95
|
+
- Completed task details
|
|
96
|
+
|
|
97
|
+
## Using task Tool
|
|
98
|
+
|
|
99
|
+
```typescript
|
|
100
|
+
task({
|
|
101
|
+
subagent_type: "general",
|
|
102
|
+
description: "Implement authentication",
|
|
103
|
+
prompt: `
|
|
104
|
+
## TASK
|
|
105
|
+
Implement user authentication
|
|
106
|
+
|
|
107
|
+
## CONTEXT
|
|
108
|
+
- SPEC: .goopspec/phases/phase-1/SPEC.md
|
|
109
|
+
`
|
|
110
|
+
})
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
## Error Handling
|
|
114
|
+
|
|
115
|
+
If delegated task fails:
|
|
116
|
+
1. Check error type (timeout, crash, assertion)
|
|
117
|
+
2. Save partial progress as checkpoint
|
|
118
|
+
3. Decide: retry, reassign, or escalate
|
|
119
|
+
4. Log failure to ADL if significant
|
|
120
|
+
|
|
121
|
+
## Best Practices
|
|
122
|
+
|
|
123
|
+
1. **Clear instructions:** Specific, unambiguous task descriptions
|
|
124
|
+
2. **Scoped context:** Only relevant information
|
|
125
|
+
3. **Defined success:** Clear verification criteria
|
|
126
|
+
4. **Timeout limits:** Set reasonable time bounds
|
|
127
|
+
5. **Progress tracking:** Monitor via todos/checkpoints
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: technical-writing
|
|
3
|
+
description: Create clear, accurate, and useful technical documentation.
|
|
4
|
+
category: docs
|
|
5
|
+
triggers:
|
|
6
|
+
- writing
|
|
7
|
+
- documentation
|
|
8
|
+
- docs
|
|
9
|
+
- guide
|
|
10
|
+
version: 0.1.0
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# Technical Writing Skill
|
|
14
|
+
|
|
15
|
+
## Purpose
|
|
16
|
+
Create clear, accurate, and useful technical documentation.
|
|
17
|
+
|
|
18
|
+
## Core Principles
|
|
19
|
+
|
|
20
|
+
### 1. Know Your Audience
|
|
21
|
+
- Who will read this?
|
|
22
|
+
- What do they already know?
|
|
23
|
+
- What do they need to accomplish?
|
|
24
|
+
|
|
25
|
+
### 2. Be Clear and Concise
|
|
26
|
+
- Use simple, direct language
|
|
27
|
+
- One idea per sentence
|
|
28
|
+
- Avoid jargon unless necessary
|
|
29
|
+
|
|
30
|
+
### 3. Structure for Scanning
|
|
31
|
+
- Use headings and subheadings
|
|
32
|
+
- Include bullet points and lists
|
|
33
|
+
- Add code examples
|
|
34
|
+
- Use tables for comparisons
|
|
35
|
+
|
|
36
|
+
### 4. Show, Don't Just Tell
|
|
37
|
+
- Include working examples
|
|
38
|
+
- Add screenshots where helpful
|
|
39
|
+
- Provide step-by-step instructions
|
|
40
|
+
|
|
41
|
+
## Document Types
|
|
42
|
+
|
|
43
|
+
### Tutorials
|
|
44
|
+
Step-by-step learning guides for beginners.
|
|
45
|
+
|
|
46
|
+
### How-To Guides
|
|
47
|
+
Task-oriented guides for specific goals.
|
|
48
|
+
|
|
49
|
+
### Reference
|
|
50
|
+
Comprehensive technical details and API docs.
|
|
51
|
+
|
|
52
|
+
### Explanations
|
|
53
|
+
Background and conceptual information.
|
|
54
|
+
|
|
55
|
+
## Best Practices
|
|
56
|
+
|
|
57
|
+
1. **Test Your Instructions** - Follow your own docs
|
|
58
|
+
2. **Use Active Voice** - "Click the button" not "The button should be clicked"
|
|
59
|
+
3. **Be Consistent** - Same terms, formatting, style throughout
|
|
60
|
+
4. **Update Regularly** - Outdated docs are worse than none
|
|
61
|
+
5. **Get Feedback** - Have users test your documentation
|
|
62
|
+
|
|
63
|
+
## Checklist
|
|
64
|
+
|
|
65
|
+
- [ ] Accurate and up-to-date?
|
|
66
|
+
- [ ] Clear purpose stated upfront?
|
|
67
|
+
- [ ] Prerequisites listed?
|
|
68
|
+
- [ ] Examples are complete and working?
|
|
69
|
+
- [ ] Proofread for errors?
|
|
@@ -0,0 +1,202 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: testing
|
|
3
|
+
description: Write and run tests for implementations
|
|
4
|
+
category: review
|
|
5
|
+
triggers:
|
|
6
|
+
- test
|
|
7
|
+
- spec
|
|
8
|
+
- assert
|
|
9
|
+
- coverage
|
|
10
|
+
version: 0.1.0
|
|
11
|
+
requires:
|
|
12
|
+
- goop-core
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
# Testing Skill
|
|
16
|
+
|
|
17
|
+
## Testing Pyramid
|
|
18
|
+
|
|
19
|
+
```
|
|
20
|
+
/\
|
|
21
|
+
/ \ E2E Tests (Few)
|
|
22
|
+
/----\
|
|
23
|
+
/ \ Integration Tests (Some)
|
|
24
|
+
/--------\
|
|
25
|
+
/ \ Unit Tests (Many)
|
|
26
|
+
/------------\
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Test Types
|
|
30
|
+
|
|
31
|
+
### Unit Tests
|
|
32
|
+
Test individual functions in isolation.
|
|
33
|
+
|
|
34
|
+
```typescript
|
|
35
|
+
describe('validateEmail', () => {
|
|
36
|
+
it('accepts valid email', () => {
|
|
37
|
+
expect(validateEmail('user@example.com')).toBe(true);
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
it('rejects invalid email', () => {
|
|
41
|
+
expect(validateEmail('invalid')).toBe(false);
|
|
42
|
+
});
|
|
43
|
+
});
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
### Integration Tests
|
|
47
|
+
Test module interactions.
|
|
48
|
+
|
|
49
|
+
```typescript
|
|
50
|
+
describe('user registration', () => {
|
|
51
|
+
it('creates user and sends welcome email', async () => {
|
|
52
|
+
const user = await registerUser({ email: 'test@example.com' });
|
|
53
|
+
expect(user.id).toBeDefined();
|
|
54
|
+
expect(emailService.send).toHaveBeenCalled();
|
|
55
|
+
});
|
|
56
|
+
});
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
### E2E Tests
|
|
60
|
+
Test complete user flows.
|
|
61
|
+
|
|
62
|
+
```typescript
|
|
63
|
+
test('user can complete checkout', async ({ page }) => {
|
|
64
|
+
await page.goto('/products');
|
|
65
|
+
await page.click('[data-testid="add-to-cart"]');
|
|
66
|
+
await page.click('[data-testid="checkout"]');
|
|
67
|
+
await page.fill('#email', 'test@example.com');
|
|
68
|
+
await page.click('[data-testid="pay"]');
|
|
69
|
+
await expect(page).toHaveURL('/confirmation');
|
|
70
|
+
});
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
## Test Structure (AAA)
|
|
74
|
+
|
|
75
|
+
```typescript
|
|
76
|
+
it('should do something', () => {
|
|
77
|
+
// Arrange
|
|
78
|
+
const input = { name: 'test' };
|
|
79
|
+
|
|
80
|
+
// Act
|
|
81
|
+
const result = processInput(input);
|
|
82
|
+
|
|
83
|
+
// Assert
|
|
84
|
+
expect(result.processed).toBe(true);
|
|
85
|
+
});
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
## Mocking
|
|
89
|
+
|
|
90
|
+
### Function Mocks
|
|
91
|
+
```typescript
|
|
92
|
+
const mockFetch = jest.fn().mockResolvedValue({ data: [] });
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
### Module Mocks
|
|
96
|
+
```typescript
|
|
97
|
+
jest.mock('./database', () => ({
|
|
98
|
+
query: jest.fn().mockResolvedValue([]),
|
|
99
|
+
}));
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
### Time Mocks
|
|
103
|
+
```typescript
|
|
104
|
+
jest.useFakeTimers();
|
|
105
|
+
jest.advanceTimersByTime(1000);
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
## Coverage Targets
|
|
109
|
+
|
|
110
|
+
| Type | Target | Critical Path |
|
|
111
|
+
|------|--------|---------------|
|
|
112
|
+
| Statements | 80% | 95% |
|
|
113
|
+
| Branches | 75% | 90% |
|
|
114
|
+
| Functions | 80% | 95% |
|
|
115
|
+
| Lines | 80% | 95% |
|
|
116
|
+
|
|
117
|
+
## Test Commands
|
|
118
|
+
|
|
119
|
+
```bash
|
|
120
|
+
# Run all tests
|
|
121
|
+
npm test
|
|
122
|
+
|
|
123
|
+
# Run specific test file
|
|
124
|
+
npm test -- --testPathPattern=auth
|
|
125
|
+
|
|
126
|
+
# Run with coverage
|
|
127
|
+
npm test -- --coverage
|
|
128
|
+
|
|
129
|
+
# Watch mode
|
|
130
|
+
npm test -- --watch
|
|
131
|
+
|
|
132
|
+
# E2E tests
|
|
133
|
+
npm run test:e2e
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
## Testing Best Practices
|
|
137
|
+
|
|
138
|
+
### Do
|
|
139
|
+
- One assertion per test (when possible)
|
|
140
|
+
- Descriptive test names
|
|
141
|
+
- Test behavior, not implementation
|
|
142
|
+
- Use factories for test data
|
|
143
|
+
- Clean up after tests
|
|
144
|
+
|
|
145
|
+
### Don't
|
|
146
|
+
- Test implementation details
|
|
147
|
+
- Make tests depend on each other
|
|
148
|
+
- Use magic numbers
|
|
149
|
+
- Test third-party code
|
|
150
|
+
- Ignore flaky tests
|
|
151
|
+
|
|
152
|
+
## Test File Organization
|
|
153
|
+
|
|
154
|
+
```
|
|
155
|
+
src/
|
|
156
|
+
├── auth/
|
|
157
|
+
│ ├── login.ts
|
|
158
|
+
│ └── __tests__/
|
|
159
|
+
│ ├── login.test.ts
|
|
160
|
+
│ └── login.integration.test.ts
|
|
161
|
+
└── __tests__/
|
|
162
|
+
└── e2e/
|
|
163
|
+
└── auth.e2e.test.ts
|
|
164
|
+
```
|
|
165
|
+
|
|
166
|
+
## Fixtures
|
|
167
|
+
|
|
168
|
+
```typescript
|
|
169
|
+
// fixtures/users.ts
|
|
170
|
+
export const validUser = {
|
|
171
|
+
id: '1',
|
|
172
|
+
email: 'test@example.com',
|
|
173
|
+
name: 'Test User',
|
|
174
|
+
};
|
|
175
|
+
|
|
176
|
+
export const invalidUser = {
|
|
177
|
+
id: '',
|
|
178
|
+
email: 'invalid',
|
|
179
|
+
};
|
|
180
|
+
```
|
|
181
|
+
|
|
182
|
+
## Snapshot Testing
|
|
183
|
+
|
|
184
|
+
```typescript
|
|
185
|
+
it('renders correctly', () => {
|
|
186
|
+
const tree = render(<Button>Click me</Button>);
|
|
187
|
+
expect(tree).toMatchSnapshot();
|
|
188
|
+
});
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
Update snapshots: `npm test -- -u`
|
|
192
|
+
|
|
193
|
+
## Performance Testing
|
|
194
|
+
|
|
195
|
+
```typescript
|
|
196
|
+
it('completes within 100ms', async () => {
|
|
197
|
+
const start = performance.now();
|
|
198
|
+
await heavyOperation();
|
|
199
|
+
const duration = performance.now() - start;
|
|
200
|
+
expect(duration).toBeLessThan(100);
|
|
201
|
+
});
|
|
202
|
+
```
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: ui-design
|
|
3
|
+
description: Create user interfaces that are visually appealing, intuitive, and functional.
|
|
4
|
+
category: design
|
|
5
|
+
triggers:
|
|
6
|
+
- ui
|
|
7
|
+
- visual
|
|
8
|
+
- layout
|
|
9
|
+
- interface
|
|
10
|
+
version: 0.1.0
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# UI Design Skill
|
|
14
|
+
|
|
15
|
+
## Purpose
|
|
16
|
+
Create user interfaces that are visually appealing, intuitive, and functional.
|
|
17
|
+
|
|
18
|
+
## Design Principles
|
|
19
|
+
|
|
20
|
+
### 1. Hierarchy
|
|
21
|
+
Guide users through content with visual importance.
|
|
22
|
+
- Size: Larger = more important
|
|
23
|
+
- Color: Bold/saturated = more important
|
|
24
|
+
- Space: More whitespace = more important
|
|
25
|
+
|
|
26
|
+
### 2. Consistency
|
|
27
|
+
Use consistent patterns throughout.
|
|
28
|
+
- Same colors mean same things
|
|
29
|
+
- Same components behave the same
|
|
30
|
+
- Predictable layouts
|
|
31
|
+
|
|
32
|
+
### 3. Feedback
|
|
33
|
+
Respond to user actions.
|
|
34
|
+
- Hover states on interactive elements
|
|
35
|
+
- Loading indicators for async operations
|
|
36
|
+
- Success/error messages for actions
|
|
37
|
+
|
|
38
|
+
### 4. Simplicity
|
|
39
|
+
Remove unnecessary elements.
|
|
40
|
+
- Every element should serve a purpose
|
|
41
|
+
- Reduce cognitive load
|
|
42
|
+
- Progressive disclosure for complexity
|
|
43
|
+
|
|
44
|
+
## Color Usage
|
|
45
|
+
|
|
46
|
+
| Color | Typical Use |
|
|
47
|
+
|-------|-------------|
|
|
48
|
+
| Primary | Main actions, branding |
|
|
49
|
+
| Secondary | Supporting actions |
|
|
50
|
+
| Success | Positive feedback (green) |
|
|
51
|
+
| Warning | Caution (yellow/orange) |
|
|
52
|
+
| Error | Problems (red) |
|
|
53
|
+
| Neutral | Text, backgrounds, borders |
|
|
54
|
+
|
|
55
|
+
## Typography
|
|
56
|
+
|
|
57
|
+
- **Headlines** - Large, bold, limited use
|
|
58
|
+
- **Body** - Readable, 16px minimum
|
|
59
|
+
- **Captions** - Small, secondary information
|
|
60
|
+
- **Line Height** - 1.5 for body text
|
|
61
|
+
|
|
62
|
+
## Spacing System
|
|
63
|
+
|
|
64
|
+
Use consistent spacing scale:
|
|
65
|
+
`4px, 8px, 12px, 16px, 24px, 32px, 48px, 64px`
|
|
66
|
+
|
|
67
|
+
## Component Checklist
|
|
68
|
+
|
|
69
|
+
- [ ] Has visible focus state
|
|
70
|
+
- [ ] Has hover state (if interactive)
|
|
71
|
+
- [ ] Has disabled state
|
|
72
|
+
- [ ] Works with keyboard
|
|
73
|
+
- [ ] Has appropriate contrast
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: ux-patterns
|
|
3
|
+
description: Apply proven user experience patterns to create intuitive interfaces.
|
|
4
|
+
category: design
|
|
5
|
+
triggers:
|
|
6
|
+
- ux
|
|
7
|
+
- patterns
|
|
8
|
+
- usability
|
|
9
|
+
- interaction
|
|
10
|
+
version: 0.1.0
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# UX Patterns Skill
|
|
14
|
+
|
|
15
|
+
## Purpose
|
|
16
|
+
Apply proven user experience patterns to create intuitive interfaces.
|
|
17
|
+
|
|
18
|
+
## Navigation Patterns
|
|
19
|
+
|
|
20
|
+
### Global Navigation
|
|
21
|
+
Top or side navigation for main sections.
|
|
22
|
+
- Limit to 5-7 primary items
|
|
23
|
+
- Highlight current section
|
|
24
|
+
- Keep consistent across pages
|
|
25
|
+
|
|
26
|
+
### Breadcrumbs
|
|
27
|
+
Show location in hierarchy.
|
|
28
|
+
- Use for deep hierarchies
|
|
29
|
+
- Each item is clickable
|
|
30
|
+
- Current page is not a link
|
|
31
|
+
|
|
32
|
+
### Search
|
|
33
|
+
Quick access to content.
|
|
34
|
+
- Prominent placement
|
|
35
|
+
- Autocomplete suggestions
|
|
36
|
+
- Clear search button
|
|
37
|
+
|
|
38
|
+
## Form Patterns
|
|
39
|
+
|
|
40
|
+
### Inline Validation
|
|
41
|
+
Validate as user types.
|
|
42
|
+
- Show success for valid fields
|
|
43
|
+
- Show errors after field blur
|
|
44
|
+
- Don't validate empty required fields until submit
|
|
45
|
+
|
|
46
|
+
### Progressive Disclosure
|
|
47
|
+
Show fields progressively.
|
|
48
|
+
- Start with essential fields
|
|
49
|
+
- Reveal advanced options on demand
|
|
50
|
+
- Group related fields
|
|
51
|
+
|
|
52
|
+
### Smart Defaults
|
|
53
|
+
Pre-fill sensible values.
|
|
54
|
+
- Remember previous choices
|
|
55
|
+
- Use location for regional defaults
|
|
56
|
+
- Pre-select common options
|
|
57
|
+
|
|
58
|
+
## Feedback Patterns
|
|
59
|
+
|
|
60
|
+
### Loading States
|
|
61
|
+
- Skeleton screens for initial load
|
|
62
|
+
- Spinners for short waits (< 3s)
|
|
63
|
+
- Progress bars for long operations
|
|
64
|
+
- Optimistic updates when possible
|
|
65
|
+
|
|
66
|
+
### Empty States
|
|
67
|
+
- Explain what should be here
|
|
68
|
+
- Guide user to add content
|
|
69
|
+
- Don't just show "No items"
|
|
70
|
+
|
|
71
|
+
### Error States
|
|
72
|
+
- Explain what went wrong
|
|
73
|
+
- Suggest how to fix it
|
|
74
|
+
- Provide a path forward
|
|
75
|
+
|
|
76
|
+
## Confirmation Patterns
|
|
77
|
+
|
|
78
|
+
### Destructive Actions
|
|
79
|
+
- Require explicit confirmation
|
|
80
|
+
- Show what will be affected
|
|
81
|
+
- Use different color (red) for danger
|
|
82
|
+
- Allow undo when possible
|