E2E: assert visible Photos zoom effects instead of storage and class names #890

Open
opened 2026-10-02 17:34:39 +00:00 by kayg · 1 comment
Owner

Evidence

apps/web/e2e/motion-spring-evidence.mjs:445-468 sends Ctrl-scroll and then checks only the calternal.photos.zoom local-storage value. The script captures frames, but its assertions do not prove that the photo tiles visibly grow and shrink. The main Photos E2E checks rendered tile height for the Large and Dense menu choices. Its Ctrl-scroll path checks only the submenu's aria-checked value (apps/web/e2e/photos.mjs:586-603).

apps/web/e2e/auth.mjs:138-147 finds a semantic level-two heading, then asserts that its parent has the as-heading CSS class. This checks a class name rather than the rendered heading treatment.

Rule

Issue #865 says that E2E tests must act as a User and assert what the User sees. The owner UX rule requires checks for the visible effect of an action.

Expected behaviour

The Photos zoom E2E checks that Ctrl-scroll changes the visible tile size in both directions. A test for Settings checks the visible heading and its semantic role. Keep a CSS class check only in a focused component or design-system guard if that class itself is a required contract.

Test idea

With real Photos data, record a visible tile measure or its rendered grid position before Ctrl-scroll. Check that zoom-in visibly increases tile size and zoom-out returns it. For Settings, keep the heading role and level check, then use the existing production screenshot review or a rendered-style assertion for its appearance. Do not use local storage or an internal class as the only proof of the User-visible result.

## Evidence `apps/web/e2e/motion-spring-evidence.mjs:445-468` sends Ctrl-scroll and then checks only the `calternal.photos.zoom` local-storage value. The script captures frames, but its assertions do not prove that the photo tiles visibly grow and shrink. The main Photos E2E checks rendered tile height for the Large and Dense menu choices. Its Ctrl-scroll path checks only the submenu's `aria-checked` value (`apps/web/e2e/photos.mjs:586-603`). `apps/web/e2e/auth.mjs:138-147` finds a semantic level-two heading, then asserts that its parent has the `as-heading` CSS class. This checks a class name rather than the rendered heading treatment. ## Rule Issue #865 says that E2E tests must act as a User and assert what the User sees. The owner UX rule requires checks for the visible effect of an action. ## Expected behaviour The Photos zoom E2E checks that Ctrl-scroll changes the visible tile size in both directions. A test for Settings checks the visible heading and its semantic role. Keep a CSS class check only in a focused component or design-system guard if that class itself is a required contract. ## Test idea With real Photos data, record a visible tile measure or its rendered grid position before Ctrl-scroll. Check that zoom-in visibly increases tile size and zoom-out returns it. For Settings, keep the heading role and level check, then use the existing production screenshot review or a rendered-style assertion for its appearance. Do not use local storage or an internal class as the only proof of the User-visible result.
Author
Owner

Audit finding for #890: the Photos zoom path in motion-spring-evidence.mjs judged Ctrl-scroll by reading localStorage; photos.mjs checked tile geometry for the menu options but checked only aria-checked after the wheel gesture. Those assertions did not prove that the rendered timeline changed.

Both E2E paths now measure actual tile height and count tiles intersecting the visible timeline viewport. The wheel gesture must enlarge tiles and reduce visible tiles, then restore the medium layout. Screenshot contexts in Photos and motion evidence emulate macOS; the gesture uses the Mac Command modifier.

Static checks passed: node --check apps/web/e2e/motion-spring-evidence.mjs, node --check apps/web/e2e/photos.mjs, and git diff --check (exited 0 with no output). Browser runs are deferred because the shared host was busy at the last load check. Merge-round commands: bun e2e/motion-spring-evidence.mjs and bun e2e/photos.mjs --screenshots artifacts/photos-890.

Audit finding for #890: the Photos zoom path in `motion-spring-evidence.mjs` judged Ctrl-scroll by reading `localStorage`; `photos.mjs` checked tile geometry for the menu options but checked only `aria-checked` after the wheel gesture. Those assertions did not prove that the rendered timeline changed. Both E2E paths now measure actual tile height and count tiles intersecting the visible timeline viewport. The wheel gesture must enlarge tiles and reduce visible tiles, then restore the medium layout. Screenshot contexts in Photos and motion evidence emulate macOS; the gesture uses the Mac Command modifier. Static checks passed: `node --check apps/web/e2e/motion-spring-evidence.mjs`, `node --check apps/web/e2e/photos.mjs`, and `git diff --check` (exited 0 with no output). Browser runs are deferred because the shared host was busy at the last load check. Merge-round commands: `bun e2e/motion-spring-evidence.mjs` and `bun e2e/photos.mjs --screenshots artifacts/photos-890`.
Sign in to join this conversation.
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
kayg/calternal#890
No description provided.