tom/HealthLog
1
0 Fork 0
mirror of https://github.com/MBombeck/HealthLog.git synced 2026-11-08 12:32:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

test(e2e): update settings touch-target assertions to the v1.4.34.5 44 px floor

Browse Source 
The v1.4.34.5 iOS-textarea-zoom sweep lifted the mobile input
height floor from 40 px (`h-10`) to 44 px (`h-11`) on `Input`,
`Select` trigger, and the native `<select>` primitives — the
desktop tier still resolves to 40 px via `sm:h-10`. The
settings-mobile-consistency spec still pinned every form input,
the Compare-to trigger, and every `/settings/ai` native select to
40 px, so it went red on the v1.4.36 tag while the implementation
was correct.

Bump the three height assertions to 44 px and refresh the header
docblock so a future maintainer reads the contract as "44 on
mobile, 40 on >=sm" instead of stumbling on a stale baseline.
This commit is contained in:
Marc-André Bombeck committed 2026-05-17 14:52:48 +02:00
1 parent 1883e1e8c1
commit 64186bd8de
1 file changed
+13 -7
Download Patch File Download Diff File Expand all files Collapse all files
e2e/settings-mobile-consistency.spec.ts
+13 -7
View File
@@ -8,10 +8,16 @@ import { STORAGE_STATE_PATH } from "./setup/global-setup";
* (`h-10`) on `Input`, `Select` trigger, and the native `<select>`
* primitives per the WCAG 2.5.5 tap-target sweep (MB2). The
* Dashboard Compare-to trigger followed the same path.
* v1.4.34.5 — mobile input floor lifted again from 40 px (`h-10`) to
* 44 px (`h-11`) to clear the WCAG 2.5.5 touch-target minimum on
* iOS Safari (textarea-zoom sweep). The `sm:h-10` desktop tier is
* unchanged; this spec runs at the Pixel 5 viewport so the mobile
* 44 px floor is what we lock in.
*
* The fixes that still apply:
*
* - 40 px (`h-10`) is the canonical input height across Settings.
* - 44 px (`h-11` on mobile, `sm:h-10` on >=sm) is the canonical
* input height across Settings.
* - Title + action rows use `flex-col` on `<sm` and `flex-row` on
* `>=sm` so the action button stacks below on mobile.
* - Sprache pairs with date-of-birth in a single `sm:grid-cols-2`
@@ -28,7 +34,7 @@ test.describe("Settings mobile consistency (Pixel 5)", () => {
test.skip(testInfo.project.name !== "chromium-mobile", "mobile-only spec");
});
test("/settings/account: every form input renders at 40 px", async ({
test("/settings/account: every form input renders at 44 px", async ({
page,
}) => {
await page.goto("/settings/account", { waitUntil: "networkidle" });
@@ -50,7 +56,7 @@ test.describe("Settings mobile consistency (Pixel 5)", () => {
expect(formInputs.length).toBeGreaterThan(0);
for (const inp of formInputs) {
expect.soft(inp.height, `${inp.tag}#${inp.id} (${inp.type})`).toBe(40);
expect.soft(inp.height, `${inp.tag}#${inp.id} (${inp.type})`).toBe(44);
}
});
@@ -132,7 +138,7 @@ test.describe("Settings mobile consistency (Pixel 5)", () => {
);
});
test("/settings/dashboard: Compare-to trigger renders at 40 px", async ({
test("/settings/dashboard: Compare-to trigger renders at 44 px", async ({
page,
}) => {
await page.goto("/settings/dashboard", { waitUntil: "networkidle" });
@@ -141,10 +147,10 @@ test.describe("Settings mobile consistency (Pixel 5)", () => {
const trigger = page.locator("#comparison-baseline");
await expect(trigger).toBeVisible();
const h = await trigger.evaluate((el) => el.getBoundingClientRect().height);
expect(Math.round(h)).toBe(40);
expect(Math.round(h)).toBe(44);
});
test("/settings/ai: every native select renders at 40 px", async ({
test("/settings/ai: every native select renders at 44 px", async ({
page,
}) => {
await page.goto("/settings/ai", { waitUntil: "networkidle" });
@@ -158,7 +164,7 @@ test.describe("Settings mobile consistency (Pixel 5)", () => {
expect(heights.length).toBeGreaterThan(0);
for (const h of heights) {
expect.soft(h).toBe(40);
expect.soft(h).toBe(44);
}
});
});