test(redesign): accept Phase 4 foundations with migration gates

job-tracker-ui/e2e/semantic-foundations.spec.ts

@@ -58,6 +58,21 @@ async function capture(page: Page, info: TestInfo, name: string) {
 }
 
 async function loadedContrast(page: Page, info: TestInfo, state: string) {
+  // Scan the loaded state after finite entry/focus transitions finish. Sampling
+  // MUI's Fade/Grow mid-frame measures composited, partially transparent text.
+  // Keep normal motion enabled, retain every axe rule and record what we waited for.
+  const transitions = await page.evaluate(async () => {
+    await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve)));
+    const active = document.getAnimations().filter(animation =>
+      animation.playState === "running" && Number.isFinite(animation.effect?.getComputedTiming().endTime));
+    const evidence = active.map(animation => {
+      const target = (animation.effect as KeyframeEffect | null)?.target;
+      return { type: animation.constructor.name, opacity: target instanceof Element ? getComputedStyle(target).opacity : null };
+    });
+    await Promise.all(active.map(animation => animation.finished.catch(() => undefined)));
+    return evidence;
+  });
+  await info.attach(`${state}-transitions`, { body: JSON.stringify(transitions), contentType: "application/json" });
   const result = await new AxeBuilder({ page }).withTags(["wcag2a", "wcag2aa", "wcag21a", "wcag21aa"]).analyze();
   // This slice gates color contrast. Preserve the full scan (including naming and
   // preview-scroll findings) for P4-02/03; this is not a full accessibility pass.

job-tracker-ui/e2e/table-density.spec.ts

@@ -55,13 +55,15 @@ async function keyboardFocus(page: Page, target: Locator) {
   await page.keyboard.press("Tab");
   await page.keyboard.press("Shift+Tab");
   await expect(target).toBeFocused();
-  const ring = await target.evaluate(node => {
+  // The native input can be focused before MUI commits the wrapper's
+  // Mui-focusVisible class. Require the same ring within the normal UI timeout.
+  const readRing = () => target.evaluate(node => {
     const control = node.closest(".MuiInputBase-root, .MuiCheckbox-root") ?? node;
     const notch = control.querySelector(".MuiOutlinedInput-notchedOutline");
     const css = getComputedStyle(notch ?? control);
     return { width: notch ? css.borderTopWidth : css.outlineWidth, style: notch ? css.borderTopStyle : css.outlineStyle };
   });
-  expect(ring).toEqual({ width: "3px", style: "solid" });
+  await expect.poll(readRing).toEqual({ width: "3px", style: "solid" });
 }
 
 for (const mode of ["light", "dark"] as const) for (const language of ["en", "nb"] as const) {