- Two projects: iphone/WebKit (iPhone 14) + pixel/Chromium (Pixel 7)
- serviceWorkers: 'block' on both profiles per D-02/Pitfall 15
- env-driven baseURL via PLAYWRIGHT_BASE_URL (D-08/Rule 8)
- globalSetup ref to e2e/global-setup.ts (Plan 02 implements)
- webServer manages vite only with reuseExistingServer (D-10)
- no storageState, no toHaveScreenshot per D-01/UI-SPEC Rule 6
- add e2e/global-setup.ts placeholder (stub) so config path resolves
Adds 07-UI-SPEC.md for Phase 7 (Mobile Test Harness). Documents the
assertable mobile-UI quality bar the harness enforces: touch-target
thresholds (≥44px), no-horizontal-overflow rule, two-profile viewport
matrix (iPhone 14/WebKit + Pixel 7/Chromium), role-based accessible name
requirements, empty/error-state copy anchors, screenshot omission rationale,
and CI portability rules. Locks D-01 through D-10 from CONTEXT.md as the
assertion contract.
The per-family remap (shared, member-1..4) only fills all-day pills whose
Schedule-X colorName is registered. Member calendars absent from the current
/api/me members list fall back to Schedule-X's built-in primary family, which
was not remapped — so those all-day events degraded to the light tint. Remap
--sx-color-primary-container as well so all-day pills stay solid in the
fallback case too (production member-N calendars already covered).
- Add isPhone() helper using window.matchMedia('(max-width: 767px)') consistent with AppNav
- Return null when isPhone() is false (desktop ≥768px) — BottomTabBar is phone-only
- Prevents the position:fixed bottom bar from overlaying AppNav sidebar avatar/Settings on desktop
- RED test committed in prior commit (740e342)
- Lift AppNav from CalendarShell to App.tsx as a sibling of <Routes>
- App.tsx fetches /api/me (same query key as CalendarShell — deduplicated by TanStack Query)
- App.tsx provides the outer layout (phone: column, desktop: row) with AppNav always rendered
- CalendarShell simplified: no longer manages AppNav, outer flex layout stays in App.tsx
- AuthSplash gains overlay prop (position:fixed inset:0 z-index:999) so it covers AppNav when needed
- CalendarShell uses AuthSplash with overlay=true so auth splashes cover full viewport
- Remove onOpenSettings prop from CalendarShell (wired directly in App.tsx to SettingsSheet)
- Desktop sidebar nav (FamilySync brand, Calendar/Lists links) now persists on /lists route
- CalendarShell now captures maybeRedirectToLogin() return value in meQuery.isError effect
- When the one-shot guard is exhausted (returns false), arm loginRedirectExhausted state
- Render AuthSplash state=dead-end (tap-to-retry) when guard is exhausted, not indefinite redirecting spinner
- Reset loginRedirectExhausted on successful auth (meQuery.isSuccess) for session recovery
- Add sessionStorage.clear() to beforeEach so CalendarShell tests are isolated
- RED test committed in prior commit (36ef7a0)
Lucas Berger
luckberg