@tryvitris/website-harness 0.0.0-stage → 0.1.0-beta.5

package/bin/vitris-verify-browser.js

@@ -0,0 +1,662 @@
+#!/usr/bin/env node
+import {
+  MOTION_SCENARIO_HASH,
+  TEMPLATE_MOTION_PATH,
+  captureMotionJourney,
+  explainBrowserLaunchFailure,
+  loadPlaywrightChromium,
+  motionCompositionPolicy,
+  observeMotion,
+  templateMotionHash,
+  validateTemplateMotionPlan
+} from "./chunks/chunk-T7DGRVTP.js";
+import "./chunks/chunk-AUO5I56E.js";
+import {
+  resolveDesignAuthoring
+} from "./chunks/chunk-6H3T46F5.js";
+import {
+  hasAnalyticsRuntime,
+  productionQuality
+} from "./chunks/chunk-M2ETYSVJ.js";
+import {
+  measurePerformance,
+  performancePolicy
+} from "./chunks/chunk-IKNMBGGD.js";
+import {
+  previewServer
+} from "./chunks/chunk-WEFDVXFX.js";
+import {
+  buildVerified
+} from "./chunks/chunk-E5Y46VBX.js";
+import "./chunks/chunk-4GZCAWWK.js";
+import "./chunks/chunk-ANMJRJQ5.js";
+import "./chunks/chunk-HNORQ74T.js";
+import "./chunks/chunk-YCVGD2CG.js";
+import "./chunks/chunk-LKN75JGA.js";
+import "./chunks/chunk-YYPYYOEV.js";
+import "./chunks/chunk-GZDLXYZV.js";
+import {
+  fingerprint,
+  json,
+  save,
+  sourceHash
+} from "./chunks/chunk-T6PE4KN4.js";
+import "./chunks/chunk-7FS67SRF.js";
+
+// src/agent/browser-focus.ts
+async function checkFocusOcclusion(page) {
+  return page.evaluate(`(async () => {
+    const targets=[...document.querySelectorAll('a[href],button,input,textarea,select,[tabindex]')].filter(e=>e.getClientRects().length && getComputedStyle(e).visibility!=="hidden" && !e.disabled && !e.matches("a.skip-link") && !e.closest("[inert]"));
+    const issues=[];
+    for(const e of targets.slice(0,80)) {
+      e.focus();e.scrollIntoView({block:"nearest",behavior:"instant"});
+      await new Promise(r=>requestAnimationFrame(()=>r()));
+      const r=e.getBoundingClientRect();if(r.width<2||r.height<2)continue;
+      const left=Math.max(0,r.left),top=Math.max(0,r.top),right=Math.min(innerWidth,r.right),bottom=Math.min(innerHeight,r.bottom);
+      const label=e.tagName.toLowerCase()+(e.id?"#"+e.id:"")+(e.getAttribute("href")?'[href="'+e.getAttribute("href")+'"]':"");
+      if(right<=left||bottom<=top){issues.push(label+" (no visible viewport intersection after focus)");continue;}
+      const hidden=[.2,.5,.8].every(f=>{
+        const hit=document.elementFromPoint(left+(right-left)*f,top+(bottom-top)*f);
+        if(!hit)return true;
+        if(hit===e||e.contains(hit))return false;
+        let p=hit;
+        while(p&&p!==e){const pos=getComputedStyle(p).position;if(pos==="fixed"||pos==="sticky")return true;p=p.parentElement;}
+        return false;
+      });
+      if(hidden)issues.push(label);
+    }
+    scrollTo({top:0,left:0,behavior:"instant"});return issues;
+  })()`);
+}
+
+// src/stock/browser-checks.ts
+async function checkSharedMedia(page, story, inventory, route, derivatives) {
+  if (story.version !== 3) return [];
+  const required = (story.globalMedia || []).filter((row) => row.routes.includes(route));
+  const rows = required.map((row) => {
+    const path = inventory.assets.find((asset) => asset.id === row.assetId)?.path || "";
+    return { assetId: row.assetId, placement: row.placement, route, path, paths: [path, ...derivatives?.images.filter((image) => image.source === path).flatMap((image) => image.variants.map((v) => v.url)) || []] };
+  });
+  return page.evaluate("(() => { const rows = " + JSON.stringify(rows) + `; const errors = []; for (const row of rows) { const region = document.querySelector(row.placement === 'header' ? 'header, [role="banner"]' : row.placement); const image = region && [...region.querySelectorAll('img')].find(img => { if (!row.path) return false; const source = img.currentSrc || img.src || ''; if (!row.paths.some(path => path && (source.includes(path) || (img.getAttribute('src') || '').includes(path)))) return false; if (!img.complete || img.naturalWidth <= 0) return false; let element = img; while (element) { const style = getComputedStyle(element); if (style.display === 'none' || style.visibility === 'hidden' || Number(style.opacity) === 0) return false; element = element.parentElement; } const rect = img.getBoundingClientRect(); return rect.width > 1 && rect.height > 1; }); if (!image) errors.push('Shared media ' + row.assetId + ' missing or hidden in ' + row.placement + ' on ' + row.route); } return errors; })()`);
+}
+async function checkResponsiveImages(page, derivatives) {
+  return page.evaluate((manifest) => {
+    const errors = [];
+    const doc = globalThis.document, win = globalThis;
+    for (const img of doc.images) {
+      const rect = img.getBoundingClientRect();
+      if (!rect.width || !rect.height || !img.currentSrc) continue;
+      const pathname = new URL(img.currentSrc).pathname;
+      const image = manifest.images.find((i) => i.variants.some((v) => v.url === pathname));
+      const variant = image?.variants.find((v) => v.url === pathname);
+      if (!variant) continue;
+      const style = win.getComputedStyle(img);
+      if (style.objectFit !== "cover") continue;
+      const needed = Math.min(Math.max(rect.width, rect.height * variant.width / variant.height) * win.devicePixelRatio, Math.max(...image.variants.map((v) => v.width)));
+      if (variant.width < needed * 0.8) errors.push(`Responsive cover image is undersized: ${image.source}; sizes must account for the crop (${variant.width}px supplied, ${Math.round(needed)}px needed)`);
+    }
+    return errors;
+  }, derivatives);
+}
+async function checkHeadingWordBreaks(page) {
+  return page.evaluate("(() => { const failures = []; for (const heading of document.querySelectorAll('h1')) { const walker = document.createTreeWalker(heading, NodeFilter.SHOW_TEXT); while (walker.nextNode()) { const node = walker.currentNode; const text = node.textContent || ''; for (const match of text.matchAll(/[A-Za-z]{8,}/g)) { const tops = new Set(); for (let i = match.index; i < match.index + match[0].length; i++) { const range = document.createRange(); range.setStart(node, i); range.setEnd(node, i + 1); const rect = range.getBoundingClientRect(); if (rect.width > 0) tops.add(Math.round(rect.top)); } if (tops.size > 1) failures.push('Mobile heading breaks inside word: ' + match[0]); } } } return failures; })()");
+}
+async function checkPageVideos(page) {
+  return await page.evaluate(`(async () => {
+    const errors=[];
+    for (const video of document.querySelectorAll('video')) {
+      if (!video.getClientRects().length) continue;
+      const label=video.getAttribute('src') || video.querySelector('source')?.getAttribute('src') || 'video';
+      if (!video.poster) errors.push('Video needs a poster: '+label);
+      else {
+        const poster=new Image(); poster.src=video.poster;
+        const ok=await Promise.race([poster.decode().then(()=>true,()=>false),new Promise(r=>setTimeout(()=>r(false),3000))]);
+        if (!ok) errors.push('Broken video poster: '+label);
+      }
+      if (video.readyState === 0 && (video.getAttribute('src') || video.querySelector('source[src]'))) {
+        await Promise.race([new Promise(r=>{video.addEventListener('loadedmetadata',r,{once:true});video.addEventListener('error',r,{once:true});video.load();}),new Promise(r=>setTimeout(r,3000))]);
+        if (video.readyState === 0 && !video.error) errors.push('Video metadata could not be verified: '+label);
+      }
+      if (video.autoplay && !video.muted) errors.push('Autoplay video must be muted: '+label);
+      if (matchMedia('(prefers-reduced-motion: reduce)').matches && !video.paused) errors.push('Video plays despite reduced motion: '+label);
+      if (!video.currentSrc && !video.getAttribute('src') && !video.querySelector('source[src]')) errors.push('Video has no source: '+label);
+      if (video.error) errors.push('Video media error: '+label);
+    }
+    return errors;
+  })()`);
+}
+
+// scripts/verify-browser.ts
+import AxeBuilder from "@axe-core/playwright";
+import { existsSync, mkdirSync as mkdirSync2, readFileSync, rmSync, copyFileSync } from "node:fs";
+import { createHash } from "node:crypto";
+import { join as join2, resolve } from "node:path";
+
+// src/agent/browser-consent.ts
+async function prepareConsentCheck(page, origin) {
+  await page.route("**/api/t*", (route) => route.fulfill({ status: 204, body: "" }));
+  await page.context().addCookies([
+    { name: "vitris_cc", value: "1", url: origin },
+    { name: "vitris_vid", value: "aaaaaaaa-aaaa-4aaa-8aaa-aaaaaaaaaaaa", url: origin }
+  ]);
+  await page.addInitScript(`(() => {
+    const ids = new Set();
+    const start = window.setInterval.bind(window), stop = window.clearInterval.bind(window);
+    window.setInterval = (...args) => { const id = start(...args); if (args[1] === 15000) ids.add(id); return id; };
+    window.clearInterval = id => { ids.delete(id); return stop(id); };
+    window.__vitrisConsentTimers = () => ids.size;
+  })()`);
+}
+async function verifyConsentControls(page) {
+  const failures = [];
+  try {
+    await page.getByRole("button", { name: "Reject analytics cookies", exact: true }).click({ timeout: 3e3 });
+    await page.waitForFunction("document.cookie.includes('vitris_cc=0')", void 0, { timeout: 3e3 });
+    if ((await page.context().cookies()).some((c) => c.name === "vitris_vid")) failures.push("Consent rejection did not clear visitor cookie");
+    if (await page.evaluate("window.__vitrisConsentTimers()") !== 0) failures.push("Consent rejection did not stop live ping timer");
+    await page.reload({ waitUntil: "load" });
+    if ((await page.context().cookies()).find((c) => c.name === "vitris_cc")?.value !== "0") failures.push("Consent rejection did not survive reload");
+    if (await page.evaluate("window.__vitrisConsentTimers()") !== 0) failures.push("Live ping timer restarted after rejected preference reload");
+    await page.getByRole("button", { name: "Accept analytics cookies", exact: true }).click({ timeout: 3e3 });
+    await page.waitForFunction("document.cookie.includes('vitris_cc=1')", void 0, { timeout: 3e3 });
+    if (!(await page.context().cookies()).find((c) => c.name === "vitris_vid")?.value) failures.push("Consent acceptance did not create visitor cookie");
+    await page.reload({ waitUntil: "load" });
+    if ((await page.context().cookies()).find((c) => c.name === "vitris_cc")?.value !== "1") failures.push("Consent acceptance did not survive reload");
+  } catch (error) {
+    failures.push(`Consent controls: ${error instanceof Error ? error.message : String(error)}`);
+  }
+  return { passed: failures.length === 0, failures };
+}
+
+// src/agent/browser-work-queue.ts
+async function runBrowserTasks(items, concurrency2, run) {
+  if (!Number.isInteger(concurrency2) || concurrency2 < 1 || concurrency2 > 4) throw new Error("Browser concurrency must be an integer from 1 to 4");
+  let next = 0;
+  const results = await Promise.allSettled(Array.from({ length: Math.min(concurrency2, items.length) }, async () => {
+    while (next < items.length) {
+      const index = next++;
+      await run(items[index], index);
+    }
+  }));
+  const failed = results.find((result) => result.status === "rejected");
+  if (failed?.status === "rejected") throw failed.reason;
+}
+
+// src/agent/template-motion-capture.ts
+import { mkdirSync } from "node:fs";
+import { join } from "node:path";
+async function captureMotionFrame(page, path, selector) {
+  for (let attempt2 = 0; ; attempt2++) {
+    try {
+      await page.screenshot({ path });
+      const state = await page.evaluate((selector2) => JSON.stringify([...document.querySelectorAll(selector2)].map((el) => {
+        const s = getComputedStyle(el), r = el.getBoundingClientRect();
+        return { transform: s.transform, opacity: s.opacity, visibility: s.visibility, x: Math.round(r.x), y: Math.round(r.y), width: Math.round(r.width), height: Math.round(r.height), text: (el.innerText || el.textContent)?.trim().slice(0, 160), open: el.hasAttribute("open"), animations: el.getAnimations().map((a) => ({ time: Math.round(Number(a.currentTime)), state: a.playState })) };
+      })), selector);
+      return { state, captureRetries: attempt2 };
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      if (attempt2 >= 2 || page.isClosed() || !/Execution context was destroyed|Cannot find context with specified id|Unable to capture screenshot/.test(message)) throw error;
+      await page.waitForLoadState("domcontentloaded");
+      await page.waitForTimeout(32);
+    }
+  }
+}
+async function captureTemplateMotion(browser2, root2, currentUrl, directory2, plan2) {
+  const invalid = validateTemplateMotionPlan(plan2);
+  if (invalid.length) throw Error(invalid.join("\n"));
+  mkdirSync(join(root2, directory2), { recursive: true });
+  const captures = [], files = [];
+  for (const moment of plan2.moments) for (const side of ["reference", "implementation"]) {
+    const context = await browser2.newContext({ viewport: { width: moment.width, height: 900 }, reducedMotion: "no-preference", recordVideo: { dir: join(root2, directory2), size: { width: moment.width, height: 900 } } });
+    const page = await context.newPage();
+    const target = moment[side], base = side === "reference" ? plan2.referenceUrl : currentUrl;
+    const frames = [], samples = [], failures = [];
+    let start = 0, loadReadyAt = 0, phaseStates = [];
+    if (target.requiredPhases?.length) {
+      await page.exposeFunction("__vitrisMotionPhase", ({ phase, path: path2, at }) => {
+        if (start) phaseStates.push({ at: at - start, phase, path: path2 });
+      });
+      await page.addInitScript(({ selector }) => {
+        let previous = "";
+        const timer = setInterval(() => {
+          const phases = [...document.querySelectorAll(selector)].map((el) => el.dataset.state).filter(Boolean);
+          const signature = phases.join("|");
+          if (signature && signature !== previous) {
+            previous = signature;
+            phases.forEach((phase) => window.__vitrisMotionPhase({ phase, path: window.location.pathname, at: Date.now() }));
+          }
+        }, 16);
+        setTimeout(() => clearInterval(timer), 6e3);
+      }, { selector: target.observe });
+    }
+    try {
+      if (moment.kind === "load") start = Date.now();
+      await page.goto(target.path === "/" ? base : new URL(target.path.replace(/^\//, ""), base.endsWith("/") ? base : base + "/").href, { waitUntil: moment.kind === "load" ? "domcontentloaded" : "networkidle" });
+      if (moment.kind === "load") loadReadyAt = Date.now();
+      if (moment.kind !== "load") {
+        await page.evaluate(() => document.fonts.ready);
+        await page.waitForFunction(() => !document.documentElement.dataset.experienceArrival && !document.querySelector(".curtain.covering"));
+        await page.waitForTimeout(250);
+      }
+      const locator = page.locator(target.target).first();
+      await locator.waitFor({ state: "visible" });
+      if (!["load", "scroll", "marquee"].includes(moment.kind)) await locator.scrollIntoViewIfNeeded();
+      if (moment.kind === "scroll") {
+        const box = await locator.boundingBox();
+        if (box && box.y > 900) await page.evaluate((selector) => {
+          const el = document.querySelector(selector);
+          window.scrollTo({ top: el.getBoundingClientRect().top + window.scrollY - window.innerHeight - 24, behavior: "instant" });
+        }, target.target);
+      }
+      const rect = await locator.boundingBox();
+      if (!rect) throw Error("Missing target geometry");
+      const snapshot = async (at) => {
+        if (start) {
+          const remaining = at - (Date.now() - (loadReadyAt || start));
+          if (remaining > 0) await page.waitForTimeout(remaining);
+        }
+        const path2 = directory2 + "/" + moment.id + "-" + side + "-" + at + ".png";
+        const { state, captureRetries } = await captureMotionFrame(page, join(root2, path2), target.observe);
+        frames.push(path2);
+        samples.push({ at: start ? Date.now() - start : -1, requestedAt: at, state, ...captureRetries ? { captureRetries } : {} });
+      };
+      await snapshot(-1);
+      if (moment.kind !== "load") {
+        start = Date.now();
+        phaseStates = [];
+      }
+      if (moment.kind === "pointer-follow") {
+        await page.mouse.move(rect.x + rect.width * 0.4, rect.y + rect.height / 2);
+        await page.waitForTimeout(140);
+        await page.mouse.move(rect.x + rect.width * 0.7, rect.y + rect.height / 2);
+        start = Date.now();
+      } else if (moment.kind === "magnetic") {
+        await page.mouse.move(rect.x + rect.width * 0.83, rect.y + rect.height * 0.35);
+      } else if (moment.kind === "route" || moment.kind === "drawer" || moment.kind === "sequence") await locator.click();
+      else if (moment.kind === "scroll") {
+        await page.mouse.wheel(0, 240);
+      }
+      for (const at of moment.kind === "route" ? [80, 350, 650, 1100, 1600, 2100] : moment.kind === "load" ? [80, 350, 650, 950, 1400, 1800] : [80, 180, 400, 800]) await snapshot(at);
+      if (moment.kind === "magnetic") {
+        await page.mouse.move(10, 10);
+        await snapshot(1600);
+      }
+    } catch (error) {
+      failures.push(error instanceof Error ? error.message : String(error));
+    }
+    const video = page.video();
+    await context.close();
+    const path = directory2 + "/" + moment.id + "-" + side + ".webm";
+    if (video) {
+      await video.saveAs(join(root2, path));
+      await video.delete();
+    } else failures.push("Missing actual recording");
+    for (const artifact of [...frames, path]) files.push({ path: artifact, hash: fingerprint(root2, [artifact]) });
+    for (const phase of target.requiredPhases || []) if (!phaseStates.some((s) => s.phase === phase)) failures.push("Missing actual transition phase: " + phase);
+    captures.push({ momentId: moment.id, side, width: moment.width, video: path, frames, samples, ...target.requiredPhases?.length ? { phaseStates } : {}, failures });
+    console.log("template motion: " + moment.id + " / " + side + " / " + (failures.length ? "failed" : "captured"));
+  }
+  return { version: 1, planHash: templateMotionHash(plan2), selectionHash: plan2.selectionHash, distHash: fingerprint(root2, ["dist"]), captures, files };
+}
+
+// scripts/verify-browser.ts
+var arg = (key) => {
+  const i = process.argv.indexOf(key);
+  return i < 0 ? void 0 : process.argv[i + 1];
+};
+var root = resolve(arg("--site") || ".");
+var representative = process.argv.includes("--representative");
+var concurrency = Number(arg("--concurrency") || process.env.VITRIS_BROWSER_CONCURRENCY || "1");
+if (!Number.isInteger(concurrency) || concurrency < 1 || concurrency > 4) throw new Error("--concurrency must be an integer from 1 to 4");
+var extraViewports = (arg("--extra-viewports") || "").split(",").filter(Boolean).map(Number);
+if (extraViewports.some((width) => !Number.isSafeInteger(width) || width < 320 || width > 2560)) throw new Error("--extra-viewports must be comma-separated integer widths from 320 to 2560");
+var viewports = [.../* @__PURE__ */ new Set([375, 1080, ...extraViewports])].sort((a, b) => a - b);
+var motionFlag = arg("--motion") || "both";
+if (!["reduce", "normal", "both"].includes(motionFlag)) throw new Error("--motion must be reduce, normal, or both");
+var motionModes = motionFlag === "both" ? ["reduce", "normal"] : [motionFlag];
+var name = representative ? "representative-browser" : "browser";
+var sanitizeRequestUrl = (raw) => {
+  const url = new URL(raw);
+  return url.origin + url.pathname.split("/").map((segment) => /@|^[0-9a-f]{16,}$/i.test(segment) ? "[redacted]" : segment).join("/");
+};
+await buildVerified(root);
+var analyticsRequired = !productionQuality(root) || hasAnalyticsRuntime(root);
+var plan = json(join2(root, "onboarding/storyboard.json"));
+var attempt = Date.now();
+var dist = join2(root, "dist");
+var directory = `agent/screenshots/${name}${plan.motionPlan?.version === 2 ? `/${attempt}` : ""}`;
+if (plan.motionPlan?.version !== 2) rmSync(join2(root, directory), { recursive: true, force: true });
+mkdirSync2(join2(root, directory), { recursive: true });
+if (plan.motionPlan?.version === 2 && existsSync(join2(root, `agent/reviews/${name}.json`))) copyFileSync(join2(root, `agent/reviews/${name}.json`), join2(root, directory, "previous-report.json"));
+var compositionMode = resolveDesignAuthoring(root).mode === "composition-v1";
+var mediaInventory = existsSync(join2(root, "onboarding/media-inventory.json")) ? json(join2(root, "onboarding/media-inventory.json")) : { version: 2, harvestHash: "", assets: [] };
+var server = previewServer(dist, { compress: true });
+await new Promise((r) => server.listen(0, "127.0.0.1", r));
+var address = server.address();
+var browser;
+var checks = [];
+var routeChecks = [];
+var compositionTargets = [];
+var pagesToCheck = plan.pages.filter((p) => !representative || p.path === "/" || p.representative);
+if (!representative && existsSync(join2(dist, "cookie-compliance/index.html")) && !pagesToCheck.some((p) => p.path === "/cookie-compliance")) pagesToCheck.push({ path: "/cookie-compliance" });
+var consentChecks = [];
+var temporalMotion = [];
+var routeJourneys = [];
+try {
+  try {
+    const chromium = await loadPlaywrightChromium();
+    browser = await chromium.launch({ headless: true });
+  } catch (error) {
+    throw new Error(explainBrowserLaunchFailure(error));
+  }
+  const tasks = pagesToCheck.flatMap((p) => viewports.flatMap((width) => motionModes.map((motion) => ({ p, width, motion }))));
+  await runBrowserTasks(tasks, concurrency, async ({ p, width, motion }, taskIndex) => {
+    if (plan.motionPlan?.version === 2 && plan.motionPlan.routes?.some((r) => r.route === p.path)) {
+      const journey = await captureMotionJourney(browser, root, `http://127.0.0.1:${address.port}${p.path}`, p.path, width, motion, `${directory}/journeys/${taskIndex}-${motion}`, plan.motionPlan, motionCompositionPolicy(root, plan.pages.map((p2) => p2.path)).operatorOff);
+      routeJourneys.push(journey);
+      if (motion === "reduce") routeJourneys.push(await captureMotionJourney(browser, root, `http://127.0.0.1:${address.port}${p.path}`, p.path, width, "static", `${directory}/journeys/${taskIndex}-static`, plan.motionPlan, true));
+    }
+    const context = await browser.newContext({ viewport: { width, height: 900 }, reducedMotion: motion === "normal" ? "no-preference" : "reduce" });
+    const page = await context.newPage();
+    const failures = [];
+    const warnings = [];
+    if (!representative && analyticsRequired && p.path === "/cookie-compliance") await prepareConsentCheck(page, `http://127.0.0.1:${address.port}`);
+    page.on("pageerror", (e) => failures.push(`Runtime: ${e.message}`));
+    await page.addInitScript(`(() => { try { new PerformanceObserver(list => { const e=list.getEntries().at(-1); if(e?.element) window.__vitrisLcpImage={tag:e.element.tagName,loading:e.element.getAttribute('loading'),source:e.element.getAttribute('src')}; }).observe({type:'largest-contentful-paint',buffered:true}); } catch {} })()`);
+    page.on("response", (r) => {
+      if (r.status() >= 400 && r.url().startsWith(`http://127.0.0.1:${address.port}`)) failures.push(`HTTP ${r.status()}: ${r.url()}`);
+    });
+    await page.goto(`http://127.0.0.1:${address.port}${p.path}`, { waitUntil: "domcontentloaded", timeout: 3e4 });
+    await page.waitForLoadState("load");
+    await page.waitForFunction(() => !document.documentElement.dataset.experienceArrival, {}, { timeout: 5e3 });
+    const initialTransferBytes = await page.evaluate(`(() => performance.getEntriesByType('resource').concat(performance.getEntriesByType('navigation')).reduce((sum,e)=>sum+(e.transferSize||e.encodedBodySize||e.decodedBodySize||0),0))()`);
+    const lcpImage = await page.evaluate("window.__vitrisLcpImage");
+    if (performancePolicy(root).enabled && lcpImage?.tag === "IMG" && lcpImage.loading === "lazy") failures.push(`LCP image is lazy-loaded: ${lcpImage.source}; mark the actual critical image data-media-priority="critical"`);
+    if (performancePolicy(root).enabled) {
+      const lazyOpeningImages = await page.evaluate(`(() => [...document.images].filter(img => {
+        if(img.loading!=='lazy')return false;
+        const r=img.getBoundingClientRect(),s=getComputedStyle(img);
+        const visibleWidth=Math.max(0,Math.min(r.right,innerWidth)-Math.max(r.left,0)),visibleHeight=Math.max(0,Math.min(r.bottom,innerHeight)-Math.max(r.top,0));
+        return s.visibility!=='hidden'&&s.display!=='none'&&visibleWidth*visibleHeight>innerWidth*innerHeight*.08;
+      }).map(img=>img.getAttribute('data-media-source')||img.getAttribute('src')))()`);
+      failures.push(...lazyOpeningImages.map((src) => `Large above-fold image is lazy-loaded: ${src}; use eager loading, and critical priority only for the actual LCP image`));
+    }
+    const temporal = await observeMotion(page, root, p.path, width, motion, directory);
+    temporalMotion.push(temporal);
+    failures.push(...temporal.failures);
+    failures.push(...await checkPageVideos(page));
+    await page.evaluate(`(async () => { for(let y=0;y<Math.min(document.documentElement.scrollHeight,50000);y+=700){ window.scrollTo(0,y); await new Promise(r=>setTimeout(r,80)); } window.scrollTo(0,0); await Promise.race([document.fonts.ready,new Promise(r=>setTimeout(r,5000))]); await Promise.race([Promise.all([...document.images].filter(i=>i.getClientRects().length).map(i=>{i.loading='eager';return i.decode().catch(()=>{});})),new Promise(r=>setTimeout(r,5000))]); })()`);
+    let firstVisit;
+    const cookieBanner = page.locator("#vitris-cookie-banner");
+    if (await cookieBanner.isVisible()) {
+      if (p.path === "/") {
+        const path = `${directory}/first-visit-${width}${motion === "reduce" ? "" : "-normal"}.png`;
+        await page.screenshot({ path: join2(root, path) });
+        firstVisit = { screenshot: path, screenshotHash: fingerprint(root, [path]) };
+        const firstAudit = await new AxeBuilder({ page }).withTags(["wcag2a", "wcag2aa", "wcag21a", "wcag21aa", "wcag22aa"]).analyze();
+        for (const violation of firstAudit.violations) if (["critical", "serious"].includes(violation.impact || "")) {
+          failures.push(`First-visit accessibility: ${violation.id}: ${violation.nodes.map((node) => node.target.join(" ")).join(", ")}`);
+        }
+      }
+      await cookieBanner.locator("[data-cookie-reject]").click();
+      await cookieBanner.waitFor({ state: "hidden", timeout: 3e3 });
+    }
+    await page.evaluate("document.body.tabIndex = -1; document.body.focus(); window.scrollTo(0,0)");
+    await page.keyboard.press("Tab");
+    const firstFocus = await page.evaluate(`document.activeElement?.matches('a.skip-link[href="#main"]') === true`);
+    if (!firstFocus) failures.push("Keyboard skip link is not the first focus target");
+    else {
+      await page.keyboard.press("Enter");
+      const skipOutcome = await page.evaluate("({ hash: location.hash, mainCount: document.querySelectorAll('main#main').length, focusable: document.querySelector('main#main')?.hasAttribute('tabindex') })");
+      if (skipOutcome.hash !== "#main" || skipOutcome.mainCount !== 1 || !skipOutcome.focusable) failures.push(`Keyboard skip link did not reach one focusable main landmark: ${JSON.stringify(skipOutcome)}`);
+    }
+    await page.evaluate("history.replaceState(null, '', location.pathname + location.search); document.body.removeAttribute('tabindex')");
+    const accessibility = await new AxeBuilder({ page }).withTags(["wcag2a", "wcag2aa", "wcag21a", "wcag21aa", "wcag22aa"]).analyze();
+    for (const violation of accessibility.violations) if (violation.id === "label-content-name-mismatch" || ["critical", "serious"].includes(violation.impact || "")) {
+      failures.push(`Accessibility: ${violation.id}: ${violation.nodes.map((node) => node.target.join(" ")).join(", ")}`);
+    }
+    const focusableCount = await page.locator("a[href]:visible,button:visible,input:visible,textarea:visible,select:visible,[tabindex]:visible").count();
+    if (focusableCount > 1) {
+      await page.evaluate("document.activeElement?.blur(); document.body.focus()");
+      const sequence = [];
+      for (let index = 0; index < Math.min(focusableCount, 4); index++) {
+        await page.keyboard.press("Tab");
+        sequence.push(await page.evaluate("(() => { const e=document.activeElement; return e?.tagName + '#' + (e?.id||'') + ':' + [...document.querySelectorAll('*')].indexOf(e); })()"));
+      }
+      if (new Set(sequence).size === 1) failures.push(`Keyboard trap: Tab did not advance focus among ${focusableCount} controls`);
+    }
+    const obscured = await checkFocusOcclusion(page);
+    failures.push(...obscured.map((target) => `Focus obscured by rendered overlay: ${target}`));
+    const observed = await page.evaluate(`(() => {
+      const errors=[];
+      if(document.documentElement.scrollWidth>innerWidth+2) errors.push('Horizontal overflow');
+      if(document.querySelectorAll('h1').length!==1) errors.push('Expected one h1');
+      for(const img of document.images) if(img.getClientRects().length&&(!img.complete||img.naturalWidth===0)) errors.push('Broken image: '+img.getAttribute('src'));
+      for(const f of document.querySelectorAll('input:not([type=hidden]):not([type=submit]):not([type=button]),textarea,select')) if(!f.labels?.length&&!f.getAttribute('aria-label')&&!f.getAttribute('aria-labelledby')) errors.push('Unlabelled field: '+f.name);
+      return {errors, links:[...document.querySelectorAll('a[href]')].map(a=>a.getAttribute('href'))};
+    })()`);
+    failures.push(...observed.errors);
+    if (width === 375) failures.push(...await checkHeadingWordBreaks(page));
+    failures.push(...await checkSharedMedia(page, plan, mediaInventory, p.path, existsSync(join2(dist, "media-manifest.json")) ? json(join2(dist, "media-manifest.json")) : void 0));
+    if (performancePolicy(root).enabled && existsSync(join2(dist, "media-manifest.json"))) failures.push(...await checkResponsiveImages(page, json(join2(dist, "media-manifest.json"))));
+    const tabs = page.locator('[role="tab"]:visible');
+    for (let i = 0; i < await tabs.count(); i++) {
+      const tab = tabs.nth(i);
+      await tab.click();
+      if (await tab.getAttribute("aria-selected") !== "true") failures.push(`Tab ${i + 1} did not select`);
+      const panelId = await tab.getAttribute("aria-controls");
+      if (!panelId || !await page.evaluate(`(() => { const p=document.getElementById(${JSON.stringify(panelId)});return !!p&&!p.hidden; })()`)) failures.push(`Tab ${i + 1} has no visible panel`);
+      await page.evaluate(`(async () => { await Promise.race([Promise.all([...document.images].filter(i=>i.getClientRects().length).map(i=>{i.loading='eager';return i.decode().catch(()=>{});})),new Promise(r=>setTimeout(r,5000))]); })()`);
+      const broken = await page.evaluate(`Array.from(document.images).filter(i=>i.getClientRects().length&&(!i.complete||!i.naturalWidth)).map(i=>i.getAttribute('src'))`);
+      failures.push(...broken.map((src) => `Broken tab image: ${src}`));
+    }
+    if (await tabs.count()) await tabs.first().click();
+    for (const carousel of await page.locator('[data-island="carousel"]').all()) {
+      const track = carousel.locator(".carousel__track");
+      if (!await track.count()) continue;
+      const scrollable = await track.evaluate((el) => el.scrollWidth > el.clientWidth + 2);
+      if (!scrollable) continue;
+      await track.evaluate((el) => {
+        el.scrollLeft = 0;
+      });
+      const next = carousel.locator("[data-carousel-next]");
+      if (!await next.count()) {
+        failures.push("Scrollable carousel lacks next control");
+        continue;
+      }
+      await next.click();
+      let advanced = false;
+      for (let i = 0; i < 20 && !advanced; i++) {
+        await new Promise((r) => setTimeout(r, 100));
+        advanced = await track.evaluate((el) => el.scrollLeft > 0);
+      }
+      if (!advanced) failures.push("Carousel next control did not advance");
+      await track.evaluate((el) => {
+        el.scrollLeft = 0;
+      });
+    }
+    const toggle = page.locator("[data-nav-toggle]:visible").first();
+    if (await toggle.count()) {
+      await toggle.click();
+      if (await toggle.getAttribute("aria-expanded") !== "true") failures.push("Navigation did not open");
+      await page.keyboard.press("Escape");
+      if (await toggle.getAttribute("aria-expanded") !== "false") failures.push("Navigation did not close on Escape");
+    }
+    for (const href of new Set(observed.links.filter((h) => h.startsWith("#") && h.length > 1))) {
+      const id = decodeURIComponent(href.slice(1));
+      if (!await page.evaluate(`!!document.getElementById(${JSON.stringify(id)})`)) failures.push(`Missing anchor target: ${href}`);
+    }
+    if (!representative) for (const href of new Set(observed.links)) {
+      const url = new URL(href, page.url());
+      if (url.origin !== new URL(page.url()).origin || href.startsWith("#")) continue;
+      const response = await page.request.get(url.href);
+      if (!response.ok()) failures.push(`Broken internal link: ${href}`);
+    }
+    if (!representative && p.path === "/") for (const route of plan.routes || []) {
+      const oldPath = new URL(route.source).pathname.replace(/\/$/, "") || "/";
+      const origin = `http://127.0.0.1:${address.port}`;
+      const raw = await page.request.get(origin + oldPath, { maxRedirects: 0 });
+      const status = raw.status(), location = raw.headers()["location"];
+      const routeFailures = [];
+      let destination;
+      let mechanism = "unverified";
+      if (route.disposition === "redirect" || route.disposition === "consolidate") {
+        mechanism = "http-redirect";
+        if (![301, 302, 307, 308].includes(status) || !location) routeFailures.push(`Expected HTTP redirect for ${oldPath}; received ${status}`);
+        else {
+          const locationPath = new URL(location, origin + oldPath).pathname.replace(/\/$/, "") || "/";
+          if (locationPath !== (route.target?.replace(/\/$/, "") || "/")) routeFailures.push(`Redirect Location mismatch for ${oldPath}: ${location}`);
+          try {
+            const followed = await page.request.get(origin + oldPath, { maxRedirects: 4 });
+            destination = new URL(followed.url()).pathname.replace(/\/$/, "") || "/";
+            if (!followed.ok() || destination !== (route.target?.replace(/\/$/, "") || "/")) routeFailures.push(`Redirect destination or loop failure for ${oldPath}`);
+          } catch {
+            routeFailures.push(`Redirect loop or failed handoff for ${oldPath}`);
+          }
+        }
+      } else if (route.disposition === "preserve") {
+        mechanism = "preserved";
+        if (status !== 200) routeFailures.push(`Preserved source route ${oldPath} returned ${status}`);
+      } else {
+        mechanism = "retired";
+        if (status !== 404 && status !== 410) routeFailures.push(`Retired source route ${oldPath} returned ${status}`);
+      }
+      failures.push(...routeFailures);
+      routeChecks.push({ source: oldPath, width, disposition: route.disposition, ...route.target ? { target: route.target } : {}, status, ...location ? { location } : {}, ...destination ? { destination } : {}, mechanism, failures: routeFailures });
+    }
+    if (!representative && analyticsRequired && p.path === "/cookie-compliance") {
+      const consent = await verifyConsentControls(page);
+      consentChecks.push({ width, ...consent });
+      failures.push(...consent.failures);
+    }
+    const slug = p.path === "/" ? "home" : p.path.replace(/^\//, "").replace(/[^a-zA-Z0-9]+/g, "-").replace(/-+$/, "") || "home";
+    const screenshot = `${directory}/${slug}-${width}${motion === "reduce" ? "" : "-normal"}.png`;
+    await page.evaluate("window.VitrisMotion?.dispose(); window.VitrisCounters?.dispose()");
+    const unreadableMotion = await page.locator("[data-motion],[data-reveal],[data-motion-child],[data-reveal-child]").evaluateAll((es) => es.filter((e) => Number(getComputedStyle(e).opacity) < 0.99).map((e) => e.id || e.tagName));
+    if (unreadableMotion.length) failures.push(`Motion teardown left final static content hidden: ${unreadableMotion.join(", ")}`);
+    await page.evaluate("window.scrollTo(0,0)");
+    const visibleText = await page.locator("body").innerText();
+    await page.screenshot({ path: join2(root, screenshot), fullPage: true });
+    if (compositionMode) for (const section of p.sections || []) for (const element of section.elementPlan || []) {
+      const locator = page.locator(`[data-composition-element="${element.id}"]`);
+      const count = await locator.count();
+      const visible = count === 1 ? await locator.first().isVisible() : false;
+      compositionTargets.push({ path: p.path, width, motion, sectionId: section.id, elementId: element.id, count, visible, screenshot, screenshotHash: fingerprint(root, [screenshot]), captureSha256: createHash("sha256").update(readFileSync(join2(root, screenshot))).digest("hex") });
+      if (count !== 1) failures.push(`Composition element ${p.path}#${section.id}/${element.id} has ${count} render targets; expected one`);
+    }
+    let mockedLeadPosts = 0;
+    let blockedMutations = 0;
+    const blockedFormRequests = [];
+    let expectedLeadAction;
+    const previewOrigin = `http://127.0.0.1:${address.port}`;
+    await page.route("**/*", async (route) => {
+      const request = route.request();
+      const url = new URL(request.url());
+      if (request.method() === "POST" && url.href === expectedLeadAction && url.pathname === "/api/leads") {
+        mockedLeadPosts++;
+        const before = page.url();
+        if ((await request.headerValue("accept"))?.includes("application/json")) {
+          await route.fulfill({ status: 201, contentType: "application/json", headers: { "access-control-allow-origin": previewOrigin }, body: JSON.stringify({ ok: true, leadId: "local-mock", mode: "test" }) });
+        } else {
+          await route.fulfill({ status: 302, headers: { location: `${before}${before.includes("?") ? "&" : "?"}sent=1` } });
+        }
+      } else if (expectedLeadAction && request.method() === "GET" && url.origin === "https://challenges.cloudflare.com" && url.pathname === "/turnstile/v0/api.js") {
+        await route.fulfill({ contentType: "application/javascript", body: 'window.turnstile={render:(el,opts)=>{setTimeout(()=>opts.callback("browser-verifier-fixture"),0);return "fixture"},reset:()=>{}}' });
+      } else if (request.method() !== "GET" || url.origin !== previewOrigin) {
+        const disposition = request.method() !== "GET" && url.pathname === "/api/t" ? "expected-blocked-telemetry" : request.method() === "GET" ? "blocked-external-read" : "unexpected-mutation";
+        if (disposition === "unexpected-mutation") blockedMutations++;
+        let initiator = "unknown";
+        try {
+          initiator = sanitizeRequestUrl(request.frame().url());
+        } catch {
+        }
+        blockedFormRequests.push({ url: sanitizeRequestUrl(request.url()), method: request.method(), resourceType: request.resourceType(), initiator, disposition });
+        await route.abort();
+      } else {
+        await route.continue();
+      }
+    });
+    for (const form of await page.locator("form:has(button[type=submit],input[type=submit],button:not([type]))").all()) {
+      if (!await form.isVisible()) continue;
+      const before = page.url();
+      if (await form.getAttribute("data-lead-form") === null) {
+        warnings.push("Unsupported form was not submitted; no mock adapter is configured");
+        continue;
+      }
+      const action = new URL(await form.getAttribute("action") || before, before);
+      const method = (await form.getAttribute("method") || "get").toUpperCase();
+      if (action.pathname !== "/api/leads" || method !== "POST") {
+        warnings.push(`Lead form was not submitted: expected POST /api/leads, found ${method} ${action.pathname}`);
+        continue;
+      }
+      const statusBefore = await page.locator('[role="status"]:visible').allTextContents();
+      const postsBefore = mockedLeadPosts;
+      let supported = true;
+      for (const field of await form.locator("input:not([type=hidden]):not([type=submit]),textarea,select").all()) {
+        const type = (await field.getAttribute("type") || "text").toLowerCase();
+        if (!await field.isVisible() || !await field.isEnabled()) continue;
+        if (type === "file") {
+          if (await field.getAttribute("required") !== null) supported = false;
+          continue;
+        }
+        if (type === "checkbox" || type === "radio") {
+          if (await field.getAttribute("required") !== null) await field.check();
+          continue;
+        }
+        const tag = await field.evaluate((el) => el.tagName.toLowerCase());
+        if (tag === "select") {
+          const option = await field.locator("option:not([disabled]):not([value=''])").first().getAttribute("value");
+          if (option !== null) await field.selectOption(option);
+          else if (await field.getAttribute("required") !== null) supported = false;
+          continue;
+        }
+        const value = type === "email" ? "pilot@example.invalid" : type === "tel" ? "5550101234" : type === "number" || type === "range" ? "1" : type === "date" ? "2026-01-15" : type === "datetime-local" ? "2026-01-15T12:00" : type === "time" ? "12:00" : type === "url" ? "https://example.invalid/" : "Pilot inquiry";
+        await field.fill(value);
+      }
+      if (!supported) {
+        warnings.push("Lead form was not submitted: required input has no safe test value");
+        continue;
+      }
+      try {
+        expectedLeadAction = action.href;
+        await form.locator("button[type=submit],input[type=submit],button:not([type])").first().click({ timeout: 3e3 });
+        await page.waitForTimeout(500);
+        const next = page.url();
+        const statusAfter = await page.locator('[role="status"]:visible').allTextContents();
+        const newStatus = statusAfter.some((text) => text.trim() && !statusBefore.includes(text));
+        if (mockedLeadPosts === postsBefore) failures.push("Lead form did not reach the mocked POST /api/leads adapter");
+        else if (!newStatus && !(new URL(next).searchParams.get("sent") && next !== before)) failures.push("Lead form has no new success state or destination");
+      } catch (error) {
+        failures.push(`Contact form could not complete: ${error instanceof Error ? error.message.slice(0, 120) : String(error)}`);
+      } finally {
+        expectedLeadAction = void 0;
+      }
+    }
+    if (blockedMutations) failures.push(`${blockedMutations} unexpected mutating request(s) were blocked during form verification`);
+    const harmlessBlocked = blockedFormRequests.filter((request) => request.disposition === "blocked-external-read").length;
+    if (blockedFormRequests.length) warnings.push("Form-time network requests blocked; inspect blockedFormRequests for individual dispositions");
+    if (harmlessBlocked) warnings.push(`${harmlessBlocked} external read request(s) blocked during form verification; inspect blockedFormRequests`);
+    checks.push({ visibleText, path: p.path, width, motion, screenshot, screenshotHash: fingerprint(root, [screenshot]), initialTransferBytes, ...firstVisit ? { firstVisit } : {}, mockedLeadPosts, blockedFormRequests, failures, warnings });
+    console.log(`${name}: ${checks.length}/${pagesToCheck.length * viewports.length * motionModes.length} ${p.path} (${width}px, ${motion}), ${failures.length ? `${failures.length} failures` : "checked"}`);
+    for (const failure of failures) console.log(`  ${failure}`);
+    await context.close();
+  });
+  const compare = (a, b) => a.path.localeCompare(b.path) || a.width - b.width || String(a.motion || a.mode).localeCompare(String(b.motion || b.mode));
+  checks.sort(compare);
+  routeJourneys.sort(compare);
+  const templateMotion = existsSync(join2(root, TEMPLATE_MOTION_PATH)) ? await captureTemplateMotion(browser, root, `http://127.0.0.1:${address.port}/`, directory + "/template-motion", json(join2(root, TEMPLATE_MOTION_PATH))) : void 0;
+  save(join2(root, `agent/reviews/${name}.json`), { version: 4, sourceHash: sourceHash(root), distHash: fingerprint(root, ["dist"]), scope: name, concurrency, viewports, motionModes, staticMotionState: "complete-after-teardown", motionScenarioHash: MOTION_SCENARIO_HASH, temporalMotion, routeJourneys, checks, routeChecks, consentChecks, ...templateMotion ? { templateMotion } : {}, ...compositionMode ? { compositionTargets } : {} });
+  if (!representative && performancePolicy(root).enabled) {
+    const performance = await measurePerformance(root, `http://127.0.0.1:${address.port}`, { log: console.log });
+    if (performance.failures.length) {
+      console.error(performance.failures.join("\n"));
+      process.exitCode = 1;
+    }
+  }
+  console.log(`${name}: ${checks.length} route/viewport checks`);
+  if (checks.some((c) => c.failures.length) || routeJourneys.some((j) => j.failures.length) || templateMotion?.captures.some((c) => c.failures.length)) process.exitCode = 1;
+} finally {
+  await browser?.close();
+  await new Promise((r) => server.close(() => r()));
+}