Marc-André Bombeck
8eb9408813
Measuring the seven `/settings/layout/<child>` routes was meant to pin the back-link spacing. It found there was no back-link to pin. `SettingsHubBackLink` and `settings.sections.layout.backToHub` have existed since the sub-pages were split out, and the only thing that mounted them was the shell's slug FALLBACK — the branch that runs when a page passes no `heading`. These pages pass an explicit one, so the fallback never ran and no child route has painted a back-link since. The component was written, the string was written, the reverse-coverage guard saw a call site and was satisfied, and the way back to the hub was not on the page. Two ends, no pipe. It now comes from the page, where the heading it belongs to comes from. The geometry spec grows the seven routes and a second family. A route with a back-link carries an extra row above the title, so it is taller by construction; comparing it against a plain route would report structure as drift. Each family is checked for its own constant heading top, and the step between the back-link and the title is asserted at 6 px — `PageHeader`'s documented `space-y-1.5`, which is what the shell's hand-rolled `space-y-6` would have drifted back to. Measured, both languages: plain routes 24.0 px, back-link routes 51.0 px, spread 0.0 px in both families, step 6.0 px on all seven. The back-link is also painted twice, once per breakpoint, so the measurement picks the copy with a box — `querySelector` returns document order, which on a desktop width is the hidden mobile one, and reading it reported no back-link at all.
e2e/
End-to-end browser tests. Playwright 1.60 drives a production build of the app against a real PostgreSQL, with @axe-core/playwright for accessibility assertions. This is the heaviest test tier; CI runs it on every PR, and locally it is worth running when a change touches a UI flow.
Running
pnpm e2e
The Playwright config (../playwright.config.ts) builds the app (next build) and brings up Postgres before the specs run; setup/global-setup.ts seeds the auth + fixture state. The suite is not part of the fast local gate (typecheck / lint / test) — it surfaces at PR CI, so expect responsive/wizard/nav reworks to flag here first.
Layout
setup/—test.ts(the suite'stest+expectentry point),global-setup.ts(auth + DB seeding),test-helpers.ts(shared login + navigation helpers).utils/— fixtures such asmock-dashboard-snapshot.ts.*.spec.ts— one spec per flow: auth/login/redirect, dashboard, charts, the medication-wizard cadences (medications-wizard-*), insights generation + scroll restoration, doctor report, settings, mobile-viewport consistency, locale switch, accessibility (a11y.spec.ts), and thev1427-*regression set.
Conventions
Import test and expect from ./setup/test, never from @playwright/test — types (Page, Route, …) still come from the package. The entry point extends Playwright's test with an automatic fixture that drops route handlers and page listeners after every test, so a handler left in flight cannot fail the test it belonged to once the context closes. src/__tests__/e2e-route-cleanup-guard.test.ts enforces the import boundary.
Assert against stable data-* attributes (data-slot, data-display-step, root display attrs), not viewport-dependent visible text. Responsive sm:hidden UI changes break getByText on desktop while the underlying element is still present — anchoring on data attributes keeps the specs stable across breakpoints. See ../CLAUDE.md.