93 lines
4.4 KiB
Markdown
93 lines
4.4 KiB
Markdown
---
|
|
phase: 3
|
|
slug: interaction-quality-and-completeness
|
|
status: draft
|
|
nyquist_compliant: false
|
|
wave_0_complete: false
|
|
created: 2026-03-11
|
|
---
|
|
|
|
# Phase 3 — Validation Strategy
|
|
|
|
> Per-phase validation contract for feedback sampling during execution.
|
|
|
|
---
|
|
|
|
## Test Infrastructure
|
|
|
|
| Property | Value |
|
|
|----------|-------|
|
|
| **Framework** | Vitest 4.0.18 + @testing-library/react + jsdom |
|
|
| **Config file** | `frontend/vite.config.ts` (test section) |
|
|
| **Quick run command** | `cd frontend && bun vitest run --reporter=verbose` |
|
|
| **Full suite command** | `cd frontend && bun vitest run` |
|
|
| **Estimated runtime** | ~20 seconds |
|
|
|
|
---
|
|
|
|
## Sampling Rate
|
|
|
|
- **After every task commit:** Run `cd frontend && bun vitest run --reporter=verbose`
|
|
- **After every plan wave:** Run `cd frontend && bun vitest run && bun run build`
|
|
- **Before `/gsd:verify-work`:** Full suite must be green
|
|
- **Max feedback latency:** 20 seconds
|
|
|
|
---
|
|
|
|
## Per-Task Verification Map
|
|
|
|
| Task ID | Plan | Wave | Requirement | Test Type | Automated Command | File Exists | Status |
|
|
|---------|------|------|-------------|-----------|-------------------|-------------|--------|
|
|
| 03-00-01 | 00 | 0 | IXTN-01 | unit stub | `bun vitest run src/components/BudgetSetup.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-00-02 | 00 | 0 | IXTN-05, STATE-02 | unit stub | `bun vitest run src/pages/CategoriesPage.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-00-03 | 00 | 0 | STATE-01 | unit stub | `bun vitest run src/pages/DashboardPage.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-00-04 | 00 | 0 | STATE-03 | unit stub | `bun vitest run src/components/BillsTracker.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-01-01 | 01 | 1 | IXTN-02, IXTN-03 | unit | `bun vitest run src/components/InlineEditCell.test.tsx` | ✅ extend | ⬜ pending |
|
|
| 03-01-02 | 01 | 1 | IXTN-01 | unit | `bun vitest run src/pages/LoginPage.test.tsx src/pages/RegisterPage.test.tsx` | ✅ extend | ⬜ pending |
|
|
| 03-01-03 | 01 | 1 | IXTN-01 | unit | `bun vitest run src/components/BudgetSetup.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-02-01 | 02 | 1 | IXTN-05 | unit | `bun vitest run src/pages/CategoriesPage.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-02-02 | 02 | 1 | STATE-01 | unit | `bun vitest run src/pages/DashboardPage.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-02-03 | 02 | 1 | STATE-02 | unit | `bun vitest run src/pages/CategoriesPage.test.tsx` | ❌ W0 | ⬜ pending |
|
|
| 03-02-04 | 02 | 1 | STATE-03 | unit | `bun vitest run src/components/BillsTracker.test.tsx` | ❌ W0 | ⬜ pending |
|
|
|
|
*Status: ⬜ pending · ✅ green · ❌ red · ⚠️ flaky*
|
|
|
|
---
|
|
|
|
## Wave 0 Requirements
|
|
|
|
- [ ] `frontend/src/components/BudgetSetup.test.tsx` — stubs for IXTN-01 (budget form spinner)
|
|
- [ ] `frontend/src/pages/CategoriesPage.test.tsx` — stubs for IXTN-05 (delete confirmation), STATE-02 (empty state)
|
|
- [ ] `frontend/src/pages/DashboardPage.test.tsx` — stubs for STATE-01 (dashboard empty state)
|
|
- [ ] `frontend/src/components/BillsTracker.test.tsx` — stubs for STATE-03 (tinted skeleton)
|
|
|
|
**Existing tests to extend (no Wave 0 needed):**
|
|
- `LoginPage.test.tsx` — add IXTN-01 spinner assertion
|
|
- `RegisterPage.test.tsx` — add IXTN-01 spinner assertion
|
|
- `InlineEditCell.test.tsx` — add IXTN-02 pencil icon + IXTN-03 flash callbacks
|
|
|
|
---
|
|
|
|
## Manual-Only Verifications
|
|
|
|
| Behavior | Requirement | Why Manual | Test Instructions |
|
|
|----------|-------------|------------|-------------------|
|
|
| Pencil icon hover animation feels smooth | IXTN-02 | CSS transition quality | Hover over editable cells; pencil should fade in smoothly ~150ms |
|
|
| Save flash color is visually pleasant | IXTN-03 | Color perception | Edit and save a value; row should flash soft green, not harsh |
|
|
| Error flash + revert feels natural | IXTN-03 | Interaction quality | Trigger a save error; row should flash red briefly, value reverts |
|
|
| Empty state looks balanced and inviting | STATE-01/02 | Visual composition | View dashboard with no budgets; icon + text + CTA should feel balanced |
|
|
| Skeleton tinting matches section colors | STATE-03 | Visual consistency | Observe loading state; skeleton pulse colors should match their section |
|
|
|
|
---
|
|
|
|
## Validation Sign-Off
|
|
|
|
- [ ] All tasks have `<automated>` verify or Wave 0 dependencies
|
|
- [ ] Sampling continuity: no 3 consecutive tasks without automated verify
|
|
- [ ] Wave 0 covers all MISSING references
|
|
- [ ] No watch-mode flags
|
|
- [ ] Feedback latency < 20s
|
|
- [ ] `nyquist_compliant: true` set in frontmatter
|
|
|
|
**Approval:** pending
|