diff --git a/.planning/phases/12-dark-mode-visibility-fixes/12-VALIDATION.md b/.planning/phases/12-dark-mode-visibility-fixes/12-VALIDATION.md new file mode 100644 index 0000000..1abe16f --- /dev/null +++ b/.planning/phases/12-dark-mode-visibility-fixes/12-VALIDATION.md @@ -0,0 +1,78 @@ +--- +phase: 12 +slug: dark-mode-visibility-fixes +status: draft +nyquist_compliant: false +wave_0_complete: false +created: 2026-04-01 +--- + +# Phase 12 — Validation Strategy + +> Per-phase validation contract for feedback sampling during execution. + +--- + +## Test Infrastructure + +| Property | Value | +|----------|-------| +| **Framework** | Vitest ^4.1.1 (node environment) + @testing-library/react | +| **Config file** | `vitest.config.ts` | +| **Quick run command** | `npm test -- --reporter=verbose` | +| **Full suite command** | `npm test` | +| **Estimated runtime** | ~10 seconds | + +--- + +## Sampling Rate + +- **After every task commit:** Run `npm test -- --reporter=verbose` +- **After every plan wave:** Run `npm test` +- **Before `/gsd:verify-work`:** Full suite must be green + visual browser verification in dark mode +- **Max feedback latency:** 10 seconds + +--- + +## Per-Task Verification Map + +| Task ID | Plan | Wave | Requirement | Test Type | Automated Command | File Exists | Status | +|---------|------|------|-------------|-----------|-------------------|-------------|--------| +| 12-01-01 | 01 | 1 | h2 headings visible in dark mode | unit | `npm test -- src/components/wizard/BackendSelectionStep` | ✅ | ⬜ pending | +| 12-01-02 | 01 | 1 | h2 headings visible in dark mode | unit | `npm test -- src/components/wizard/RemoteConfigStep` | ✅ | ⬜ pending | +| 12-01-03 | 01 | 1 | h2 headings visible in dark mode | unit | `npm test -- src/components/wizard/DeploymentStep` | ✅ | ⬜ pending | +| 12-01-04 | 01 | 1 | h2 headings visible in dark mode | unit | `npm test -- src/components/wizard/ReviewStep` | ✅ | ⬜ pending | +| 12-01-05 | 01 | 1 | DeploymentStep labels/controls visible | unit | `npm test -- src/components/wizard/DeploymentStep` | ✅ | ⬜ pending | +| 12-01-06 | 01 | 1 | Select element styled for dark mode | unit | `npm test -- src/components/ui/FieldRenderer` | ✅ | ⬜ pending | +| 12-01-07 | 01 | 1 | ReviewStep checkbox styled | unit | `npm test -- src/components/wizard/ReviewStep` | ✅ | ⬜ pending | + +*Status: ⬜ pending · ✅ green · ❌ red · ⚠️ flaky* + +--- + +## Wave 0 Requirements + +Existing infrastructure covers all phase requirements. No new test files or fixtures needed. + +--- + +## Manual-Only Verifications + +| Behavior | Requirement | Why Manual | Test Instructions | +|----------|-------------|------------|-------------------| +| Dark mode visual correctness | All elements visible on dark bg | jsdom does not resolve CSS custom properties | Toggle dark mode in browser, verify all headings/labels/controls are readable on dark background | +| Select dropdown appearance | Select bg/text correct in dark mode | Native `