test: automated responsive-layout harness (closes #13)
check / check (push) Failing after 1s

`make frontend-viewport-test` builds `dist/`, serves it from the same
digest-pinned nginx image and nginx.conf the shipping container uses, and
drives a digest-pinned headless Chrome over CDP. Viewport widths are derived
from the app's own @media breakpoints rather than a list of phone models: each
breakpoint is tested one pixel below, on, and above, plus four anchor
viewports. Assertions are on computed layout — horizontal overflow, off-screen
elements, clipped text, 44x44 tap targets, host-row reflow — not screenshots,
and each check declares the minimum elements it must find so a stale selector
fails instead of passing blind against a page it is not measuring. Kept out of
`make check`: it needs Docker and takes minutes. Proven able to fail before
being trusted.

Model: opus-4-8
This commit was merged in pull request #44.
This commit is contained in:
2026-09-21 18:29:20 +02:00
parent f3895789d2
commit 14eb376d79
14 changed files with 1315 additions and 2 deletions
+8 -1
View File
@@ -1,4 +1,5 @@
.PHONY: bootstrap setup dev test lint fmt fmt-check check docker hooks
.PHONY: bootstrap setup dev test lint fmt fmt-check check \
frontend-viewport-test docker hooks
# Standard targets are thin shims; the implementations live in script/
# per the scripts-to-rule-them-all pattern (see the Entrypoints section
@@ -28,6 +29,12 @@ fmt-check:
check:
@script/check
# Responsive-layout verification in a containerised browser. Kept out of
# check: it needs Docker and takes minutes, where make test has to stay
# under 20 seconds.
frontend-viewport-test:
@script/frontend-viewport-test
docker:
@script/docker