diff --git a/.planning/phases/17-ui-optimization-polish/17-UAT.md b/.planning/phases/17-ui-optimization-polish/17-UAT.md new file mode 100644 index 0000000..3a7d887 --- /dev/null +++ b/.planning/phases/17-ui-optimization-polish/17-UAT.md @@ -0,0 +1,82 @@ +--- +status: complete +phase: 17-ui-optimization-polish +source: + - 17-01-SUMMARY.md + - 17-02-SUMMARY.md + - 17-03-SUMMARY.md + - 17-04-SUMMARY.md + - 17-05-SUMMARY.md + - 17-06-SUMMARY.md +verification_method: playwright-cli (Chromium, host Vite @5173, Docker API/DB) +started: 2026-06-18T18:26:00Z +updated: 2026-06-18T18:31:00Z +--- + +## Current Test + +[testing complete] + +## Tests + +### 1. Cold Start Smoke Test +expected: App boots and `/calendar` loads with live data — calendar grid, color legend, and primary controls render without console errors. +result: pass +evidence: PWA opened at http://localhost:5173/ → redirected to /calendar (dev-bypass). June 2026 grid rendered, color legend ("Dev User" #4A90D9, "Family" #F25C7A), New Event button + Today/nav present. 0 console errors. Docker API/MariaDB/Redis up. + +### 2. Login Page Branding — FamilySync logo (Plan 17-04) +expected: Login page shows the approved family-house logo (BrandSlot), not the old "FS" text placeholder. +result: pass +evidence: /login renders `` at 48px. Old `aria-hidden` "FS" placeholder div is absent. `/logo.svg` serves 200 image/svg+xml. + +### 3. Favicon & Theme Color (Plan 17-04) +expected: Browser tab favicon set (SVG + ICO + apple-touch) wired; warm-amber theme color applied. +result: pass +evidence: `` for /favicon.svg (image/svg+xml) + /favicon.ico + apple-touch-icon present. All of favicon.svg/favicon.ico/apple-touch-icon.png/icon-maskable-512.png fetch 200 with correct content-types. `` = #e8915a. + +### 4. Phone Layout Overlap Fix (Plan 17-03 / D-01) +expected: At ≤767px, the New Event FAB sits above the fixed BottomTabBar (not occluded) and the color-legend chips remain fully visible. +result: pass +evidence: @390×844 — FAB bottom=764, BottomTabBar top=788 → FAB above bar with 24px gap (= --space-6). Color legend bottom=780 < nav top=788, visible:true, not occluded. Both chips ("Dev User", "Family") present. 0 console errors. + +### 5. Sign Out Control (Plan 17-05 / D-07) +expected: Settings sheet exposes a reachable "Sign out" control. +result: pass +evidence: Settings dialog (opened from "Dev User — open settings") contains Account section, "Change password", and a "Sign out" button — all reachable. + +### 6. Settings Sheet Centering (Plan 17-05 / D-09) +expected: On desktop, the settings sheet renders as a centered modal (not a bottom sheet). +result: pass +evidence: Settings dialog — position:fixed, width 480px, horizontal & vertical center offset = 0 on 1280×720, aria-modal="true". + +### 7. Modal Focus Trap (code-review CR-01 / WR-01 fix) +expected: With a sheet open, Tab/Shift+Tab cycle focus within the dialog and never escape to background controls. +result: pass +evidence: Settings dialog (5 focusables). Tab from last ("Sign out") → wraps to "Close settings" (still inside). Shift+Tab from first → wraps to "Sign out" (still inside). Focus stayed contained both directions. Confirms the jsdom-tolerant visibility filter works correctly in a real (laid-out) browser — resolves the code-review human-verification flag. + +### 8. Admin Two-Tab Navigation (Plan 17-06 / D-10 + WR-02) +expected: Admin page shows "Members & Accounts" / "Settings" tabs with full WAI-ARIA keyboard support (arrows wrap, Home/End). +result: pass +evidence: `role=tablist` with two `role=tab`s, "Members & Accounts" selected by default, tabpanels with regions. Keyboard: ArrowRight→Settings, ArrowRight wraps→Members, ArrowLeft→Settings, Home→Members, End→Settings. All transitions update aria-selected. + +### 9. Admin Success Toast (Plan 17-06 / D-08) +expected: Creating a member shows a transient success toast announced to assistive tech. +result: pass +evidence: Filled + submitted the Add-member form (throwaway "ZZ Verify Toast"); a `role=status` aria-live="polite" toast read "Member added." Throwaway member removed from the dev DB afterward (verified 0 remaining). + +### 10. iOS Standalone PWA — install + home-screen icon + push +expected: Installed-to-home-screen behavior and apple-touch/maskable icon appearance on a real iOS device. +result: skipped +reason: Genuinely device-only — cannot be driven by playwright-cli/Chromium (manifest is production-only and not injected in Vite dev). Icon assets and manifest config are verified at the asset/code level (Tests 2–3, code review). Real-device behavior remains a human checkpoint, already tracked in 17-VERIFICATION.md. + +## Summary + +total: 10 +passed: 9 +issues: 0 +skipped: 1 +pending: 0 + +## Gaps + +[none — all automated checks passed; 1 device-only item deferred to existing human checkpoints]