Naser Mansour
1.4 KiB
Manual tests — 24-3 Signature Balance Component
QA 2026-10-31: every acceptance criterion for this task was verified by command or in-browser measurement and the task is Done. The items below are visual-impression checks for Naser, not outstanding criteria.
Automated (passed 2026-10-31, tests/Feature/Design/SiteBalanceTest.php, 5 tests): component renders <svg data-balance>
with viewBox, role/aria-label or aria-hidden, size and passthrough attributes; balance.js exports init/destroy, makes ids
unique per instance (++uid), uses the spec's spring constants and reduced-motion branch; wired into public.js; CSS scoped.
The module imports cleanly in Node 22 and the Vite build succeeds.
Not yet checkable in a browser: no page places the balance until 24-4 (hero) and 24-5 (finale). Run these once 24-4/24-5 are in:
- Home hero: balance appears tilted and settles level within ~4 seconds without touching the mouse.
- Move the mouse to the right edge of the hero frame: beam tips about 9°; leave the frame: returns to level.
- Booking-card finale: beam tipped (−12°) at the top of the page, level at the bottom.
- macOS "reduce motion" on: every balance level (
rotate(0 200 110)), nothing animates. - Click About, then back to Home three times (wire:navigate): hero balance still renders and settles; finale still levels.
- Two balances on one page: no duplicate ids (
document.querySelectorAll('[id]')).