@keboola/validate-ui 0.5.0 → 0.5.3

package/dist/index.js

@@ -1,1066 +1,12 @@
-import { chromium } from 'playwright';
-import { createReadStream } from 'fs';
-import { stat, writeFile, readFile } from 'fs/promises';
-import { createServer } from 'http';
-import { join, resolve, normalize, sep, extname } from 'path';
-import axe from 'axe-core';
-import { z } from 'zod';
-import Anthropic from '@anthropic-ai/sdk';
-import pixelmatch from 'pixelmatch';
-import { PNG } from 'pngjs';
-import { brands, checkInteractiveContrast } from '@keboola/brand-registry';
-
-// src/types.ts
-var SEVERITIES = ["critical", "serious", "moderate", "minor"];
-
-// src/prepare-screenshot.ts
-var disableAnimations = async (page) => {
-  await page.addStyleTag({
-    content: `*, *::before, *::after {
-      animation-duration: 0s !important;
-      animation-delay: 0s !important;
-      transition-duration: 0s !important;
-      transition-delay: 0s !important;
-      caret-color: transparent !important;
-    }`
-  });
-};
-var parkMouseOffElements = async (page) => {
-  await page.mouse.move(0, 0);
-};
-var waitForFonts = async (page) => {
-  await page.evaluate(() => document.fonts.ready.then(() => void 0));
-};
-var prepareForScreenshot = async (page) => {
-  await disableAnimations(page);
-  await parkMouseOffElements(page);
-  await waitForFonts(page);
-};
-
-// src/capture.ts
-var DESKTOP_VIEWPORT = { label: "desktop", width: 1280, height: 800 };
-var MOBILE_VIEWPORT = { label: "mobile", width: 390, height: 844 };
-var DEFAULT_VIEWPORTS = [DESKTOP_VIEWPORT, MOBILE_VIEWPORT];
-var DEFAULT_TIMEOUT_MS = 3e4;
-var attachRecorders = (page) => {
-  const consoleEntries = [];
-  const networkEntries = [];
-  page.on("console", (message) => {
-    consoleEntries.push({
-      type: message.type(),
-      text: message.text(),
-      location: message.location().url || void 0
-    });
-  });
-  page.on("pageerror", (error) => {
-    consoleEntries.push({ type: "pageerror", text: error.message });
-  });
-  page.on("requestfailed", (request) => {
-    networkEntries.push({
-      url: request.url(),
-      method: request.method(),
-      status: 0,
-      failure: request.failure()?.errorText
-    });
-  });
-  page.on("response", (response) => {
-    networkEntries.push({
-      url: response.url(),
-      method: response.request().method(),
-      status: response.status()
-    });
-  });
-  return { console: consoleEntries, network: networkEntries };
-};
-var capturePage = async (page, url, viewport, timeoutMs = DEFAULT_TIMEOUT_MS) => {
-  const recorders = attachRecorders(page);
-  await page.setViewportSize({ width: viewport.width, height: viewport.height });
-  await page.goto(url, { waitUntil: "networkidle", timeout: timeoutMs });
-  await prepareForScreenshot(page);
-  const screenshot = await page.screenshot({ fullPage: true });
-  const dom = await page.content();
-  const renderedText = (await page.evaluate(() => document.body.innerText)).trim();
-  return {
-    url,
-    viewport,
-    screenshot,
-    dom,
-    renderedText,
-    console: recorders.console,
-    network: recorders.network
-  };
-};
-var capture = async (url, options = {}) => {
-  const viewports = options.viewports ?? DEFAULT_VIEWPORTS;
-  const browser = options.browser ?? await chromium.launch();
-  const ownsBrowser = !options.browser;
-  try {
-    const artifacts = [];
-    for (const viewport of viewports) {
-      const context = await browser.newContext({
-        viewport: { width: viewport.width, height: viewport.height }
-      });
-      const page = await context.newPage();
-      try {
-        artifacts.push(await capturePage(page, url, viewport, options.timeoutMs));
-      } finally {
-        await context.close();
-      }
-    }
-    return artifacts;
-  } finally {
-    if (ownsBrowser) await browser.close();
-  }
-};
-var CONTENT_TYPES = {
-  ".html": "text/html; charset=utf-8",
-  ".js": "text/javascript; charset=utf-8",
-  ".css": "text/css; charset=utf-8",
-  ".json": "application/json; charset=utf-8",
-  ".svg": "image/svg+xml",
-  ".png": "image/png",
-  ".jpg": "image/jpeg",
-  ".woff2": "font/woff2",
-  ".woff": "font/woff"
-};
-var serveStatic = async (rootDir) => {
-  const indexPath = join(rootDir, "index.html");
-  const rootResolved = resolve(rootDir);
-  const server = createServer((request, response) => {
-    const send = (filePath, status = 200) => {
-      response.writeHead(status, {
-        "content-type": CONTENT_TYPES[extname(filePath)] ?? "application/octet-stream"
-      });
-      const stream = createReadStream(filePath);
-      stream.on("error", (error) => {
-        console.error(`serveStatic: failed to read ${filePath}:`, error);
-        if (!response.headersSent) response.writeHead(500);
-        response.end();
-      });
-      stream.pipe(response);
-    };
-    const notFound = () => {
-      response.writeHead(404);
-      response.end();
-    };
-    let rawPath;
-    try {
-      rawPath = decodeURIComponent((request.url ?? "/").split("?")[0] ?? "/");
-    } catch {
-      response.writeHead(400);
-      response.end();
-      return;
-    }
-    const relative = normalize(rawPath).replace(/^(\.\.[/\\])+/, "");
-    const candidate = join(rootDir, relative);
-    const candidateResolved = resolve(candidate);
-    if (candidateResolved !== rootResolved && !candidateResolved.startsWith(rootResolved + sep)) {
-      notFound();
-      return;
-    }
-    stat(candidate).then((info) => {
-      send(info.isDirectory() ? indexPath : candidate);
-    }).catch(() => {
-      if (extname(candidate) === "") {
-        send(indexPath);
-        return;
-      }
-      notFound();
-    });
-  });
-  await new Promise((resolve2) => server.listen(0, "127.0.0.1", resolve2));
-  const address = server.address();
-  if (address === null || typeof address === "string") {
-    throw new Error("serveStatic: failed to bind an ephemeral port");
-  }
-  return {
-    url: `http://127.0.0.1:${address.port}`,
-    close: () => new Promise((resolve2, reject) => {
-      server.close((error) => error ? reject(error) : resolve2());
-    })
-  };
-};
-
-// src/axes/clipped-text.ts
-var CLIP_TOLERANCE_PX = 2;
-var MAX_REPORTED = 10;
-var findClippedElements = ({
-  tolerance,
-  max
-}) => {
-  const describe = (el) => {
-    const tag = el.tagName.toLowerCase();
-    const label = el.getAttribute("aria-label");
-    if (label) return `${tag}[aria-label="${label}"]`;
-    if (el.id) return `${tag}#${el.id}`;
-    const name = el.getAttribute("name");
-    if (name) return `${tag}[name="${name}"]`;
-    const cls = typeof el.className === "string" && el.className.trim() ? `.${el.className.trim().split(/\s+/).slice(0, 2).join(".")}` : "";
-    return `${tag}${cls}`;
-  };
-  const results = [];
-  const reported = /* @__PURE__ */ new Set();
-  const hasReportedAncestor = (el) => {
-    let parent = el.parentElement;
-    while (parent) {
-      if (reported.has(parent)) return true;
-      parent = parent.parentElement;
-    }
-    return false;
-  };
-  for (const el of document.querySelectorAll("*")) {
-    if (results.length >= max) break;
-    if (hasReportedAncestor(el)) continue;
-    const style = window.getComputedStyle(el);
-    if (style.display === "none" || style.visibility === "hidden" || style.opacity === "0") {
-      continue;
-    }
-    if (el.clientWidth <= 1 || el.clientHeight <= 1) continue;
-    const overflowX = style.overflowX;
-    const isFormValue = el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement;
-    const isSingleLineInput = el instanceof HTMLInputElement;
-    if (!isSingleLineInput && overflowX !== "hidden" && overflowX !== "clip") continue;
-    if (!isSingleLineInput && style.textOverflow === "ellipsis") continue;
-    const overflowBy = el.scrollWidth - el.clientWidth;
-    if (overflowBy <= tolerance) continue;
-    const text = isFormValue ? el.value : (el.textContent ?? "").trim();
-    if (!text) continue;
-    reported.add(el);
-    results.push({
-      selector: describe(el),
-      text: text.length > 40 ? `${text.slice(0, 40)}\u2026` : text,
-      visibleWidth: Math.round(el.clientWidth),
-      contentWidth: Math.round(el.scrollWidth),
-      isInput: isFormValue
-    });
-  }
-  return results;
-};
-var toFinding = (clipped) => ({
-  message: `Content is cut off with no way to reveal it (${clipped.selector})`,
-  severity: "serious",
-  detail: `${clipped.isInput ? "Input value" : "Text"} "${clipped.text}" needs ${clipped.contentWidth}px but has ${clipped.visibleWidth}px. Widen the element, or make the truncation explicit with \`text-overflow: ellipsis\`.`
-});
-var clippedTextFindings = async (page) => {
-  try {
-    const clipped = await page.evaluate(findClippedElements, {
-      tolerance: CLIP_TOLERANCE_PX,
-      max: MAX_REPORTED
-    });
-    return clipped.map(toFinding);
-  } catch (error) {
-    console.error("clipped-text: could not inspect the page", error);
-    return [];
-  }
-};
-
-// src/axes/accessibility.ts
-var IMPACTS = ["critical", "serious", "moderate", "minor"];
-var toSeverity = (impact) => impact && IMPACTS.includes(impact) ? impact : "minor";
-var wcagTag = (tags) => tags.find((tag) => tag.startsWith("wcag")) ?? tags[0];
-var toFinding2 = (violation) => {
-  const targets = violation.nodes.map((node) => node.target.join(" ")).filter((target) => target.length > 0).join(", ");
-  const wcag = wcagTag(violation.tags);
-  return {
-    message: `${violation.help || violation.description}${targets ? ` (${targets})` : ""}`,
-    severity: toSeverity(violation.impact),
-    ref: [wcag, violation.id].filter(Boolean).join(" \xB7 ")
-  };
-};
-var notAssessed = (message) => ({
-  axis: "a11y",
-  pass: true,
-  findings: [{ message, severity: "minor" }]
-});
-var accessibilityAxis = {
-  name: "a11y",
-  run: async (context) => {
-    const { page } = context;
-    if (!page) return notAssessed("a11y skipped: no live page provided");
-    await page.addScriptTag({ content: axe.source });
-    const results = await page.evaluate(() => {
-      const injected = window.axe;
-      return injected ? injected.run(document) : null;
-    });
-    if (results === null) {
-      return notAssessed("a11y not assessed: axe-core failed to inject (page CSP?)");
-    }
-    const findings = [...results.violations.map(toFinding2), ...await clippedTextFindings(page)];
-    const pass = !findings.some(
-      (finding) => finding.severity === "critical" || finding.severity === "serious"
-    );
-    return { axis: "a11y", pass, findings };
-  }
-};
-var textFromMessage = (message) => message.content.filter((block) => block.type === "text").map((block) => block.text).join("");
-var makeProvider = (backend, clientOptions) => {
-  const client = new Anthropic(clientOptions);
-  return {
-    backend,
-    judge: async ({ screenshotBase64, prompt, model }) => {
-      const message = await client.messages.create({
-        model,
-        max_tokens: 1024,
-        messages: [
-          {
-            role: "user",
-            content: [
-              {
-                type: "image",
-                source: { type: "base64", media_type: "image/png", data: screenshotBase64 }
-              },
-              { type: "text", text: prompt }
-            ]
-          }
-        ]
-      });
-      return textFromMessage(message);
-    }
-  };
-};
-var nonEmpty = (value) => value !== void 0 && value !== "";
-var resolveVlmProvider = (env = process.env) => {
-  const baseUrl = env.VALIDATE_UI_LLM_BASE_URL ?? env.ANTHROPIC_BASE_URL;
-  const proxyToken = env.VALIDATE_UI_LLM_TOKEN ?? env.KBC_TOKEN ?? env.ANTHROPIC_API_KEY;
-  if (nonEmpty(baseUrl) && nonEmpty(proxyToken)) {
-    return makeProvider("keboola-llm", { baseURL: baseUrl, apiKey: proxyToken });
-  }
-  if (nonEmpty(env.ANTHROPIC_API_KEY)) {
-    return makeProvider("raw-anthropic", { apiKey: env.ANTHROPIC_API_KEY });
-  }
-  return void 0;
-};
-
-// src/axes/brief-conformance.ts
-var JudgeResult = z.object({
-  matchesBrief: z.boolean(),
-  missingStates: z.array(z.string()),
-  reasons: z.array(z.string())
-});
-var MODEL = process.env.VALIDATE_UI_MODEL ?? "claude-sonnet-4-6";
-var DOM_EXCERPT_LIMIT = 12e3;
-var interpretJudgeResult = (result) => {
-  const findings = [];
-  if (!result.matchesBrief) {
-    findings.push({
-      message: `UI does not match the brief: ${result.reasons.join("; ")}`,
-      severity: "serious"
-    });
-  }
-  for (const state of result.missingStates) {
-    findings.push({ message: `missing state: ${state}`, severity: "moderate" });
-  }
-  const pass = result.matchesBrief && result.missingStates.length === 0;
-  return { axis: "brief-conformance", pass, findings };
-};
-var skip = (message) => ({
-  axis: "brief-conformance",
-  pass: true,
-  findings: [{ message, severity: "minor" }]
-});
-var RUBRIC = [
-  "You are judging whether a rendered UI conforms to the brief it was generated from.",
-  "Assess two things:",
-  "1. matchesBrief \u2014 does the screenshot + DOM implement what the brief describes?",
-  "2. missingStates \u2014 which UI states the brief implies are NOT represented.",
-  '   Use short lowercase labels like "empty", "loading", "error".',
-  "Reply with ONLY a JSON object, no prose, matching exactly:",
-  '{ "matchesBrief": boolean, "missingStates": string[], "reasons": string[] }',
-  "reasons: brief explanations for any mismatch (empty array if it matches)."
-].join("\n");
-var briefConformanceAxis = {
-  name: "brief-conformance",
-  run: async (context) => {
-    const brief = context.brief?.trim();
-    if (brief === void 0 || brief === "") {
-      return skip("no brief provided; conformance not assessed");
-    }
-    const provider = resolveVlmProvider();
-    if (provider === void 0) {
-      return skip(
-        "brief-conformance skipped: no VLM backend configured (set VALIDATE_UI_LLM_BASE_URL + VALIDATE_UI_LLM_TOKEN for the Keboola LLM path, or ANTHROPIC_API_KEY for a raw key)"
-      );
-    }
-    const { artifact } = context;
-    const screenshotBase64 = Buffer.from(artifact.screenshot).toString("base64");
-    const domExcerpt = artifact.dom.slice(0, DOM_EXCERPT_LIMIT);
-    const reply = await provider.judge({
-      model: MODEL,
-      screenshotBase64,
-      prompt: `${RUBRIC}
-
-Brief:
-${brief}
-
-DOM excerpt:
-${domExcerpt}`
-    });
-    try {
-      const parsed = JudgeResult.parse(JSON.parse(reply));
-      return interpretJudgeResult(parsed);
-    } catch (error) {
-      console.error("brief-conformance: failed to parse judge response", error);
-      return {
-        axis: "brief-conformance",
-        pass: false,
-        findings: [{ message: "could not parse judge response", severity: "moderate" }]
-      };
-    }
-  }
-};
-
-// src/compare/diff.ts
-var matchesGlob = (pattern, value) => {
-  if (!pattern.includes("*")) return pattern === value;
-  const escaped = pattern.replace(/[.+?^${}()|[\]\\]/g, "\\$&").replace(/\*/g, ".*");
-  return new RegExp(`^${escaped}$`).test(value);
-};
-var multisetMissing = (from, to) => {
-  const remaining = /* @__PURE__ */ new Map();
-  for (const value of to) remaining.set(value, (remaining.get(value) ?? 0) + 1);
-  const missing = [];
-  for (const value of from) {
-    const count = remaining.get(value) ?? 0;
-    if (count > 0) remaining.set(value, count - 1);
-    else missing.push(value);
-  }
-  return missing;
-};
-var signature = (regionKey, tokens) => `${regionKey}::${[...tokens].sort().join("|")}`;
-var regionRemovalRule = (rules, key) => rules.find(
-  (rule) => rule.value === void 0 && rule.region !== void 0 && matchesGlob(rule.region, key)
-);
-var valueRuleMatches = (rule, key, value) => rule.value !== void 0 && matchesGlob(rule.value, value) && (rule.region === void 0 || matchesGlob(rule.region, key));
-var removedFinding = (region, rule) => ({
-  regionKey: region.key,
-  kind: "region-removed",
-  valueSignature: signature(region.key, region.values),
-  message: rule === void 0 ? `region "${region.label}" was removed` : `region "${region.label}" removed as expected`,
-  severity: rule === void 0 ? "serious" : "minor",
-  ...rule !== void 0 && { suppressed: { reason: rule.reason } }
-});
-var degradedFinding = (region) => ({
-  regionKey: region.key,
-  kind: "region-degraded",
-  valueSignature: signature(region.key, [region.state]),
-  message: `region "${region.label}" degraded to ${region.state} state \u2014 not compared as value loss`,
-  severity: "minor"
-});
-var addedFinding = (region) => ({
-  regionKey: region.key,
-  kind: "region-added",
-  valueSignature: signature(region.key, []),
-  message: `region "${region.label}" is new`,
-  severity: "minor"
-});
-var diffRegionValues = (oldRegion, newRegion, rules) => {
-  const missing = multisetMissing(oldRegion.values, newRegion.values);
-  if (missing.length === 0) return [];
-  const active = [];
-  const suppressed = [];
-  const reasons = /* @__PURE__ */ new Set();
-  for (const value of missing) {
-    const rule = rules.find((r) => valueRuleMatches(r, newRegion.key, value));
-    if (rule === void 0) active.push(value);
-    else {
-      suppressed.push(value);
-      reasons.add(rule.reason);
-    }
-  }
-  const findings = [];
-  if (active.length > 0) {
-    findings.push({
-      regionKey: newRegion.key,
-      kind: "value-missing",
-      valueSignature: signature(newRegion.key, active),
-      message: `region "${newRegion.label}" is missing ${active.length} value(s)`,
-      severity: "moderate",
-      detail: active.join(", ")
-    });
-  }
-  if (suppressed.length > 0) {
-    findings.push({
-      regionKey: newRegion.key,
-      kind: "value-missing",
-      valueSignature: signature(newRegion.key, suppressed),
-      message: `region "${newRegion.label}" is missing ${suppressed.length} expected value(s)`,
-      severity: "minor",
-      detail: suppressed.join(", "),
-      suppressed: { reason: [...reasons].join("; ") }
-    });
-  }
-  return findings;
-};
-var diffSnapshots = (oldSnap, newSnap, config = {}) => {
-  const rules = config.expectedAbsent ?? [];
-  const newByKey = new Map(newSnap.regions.map((region) => [region.key, region]));
-  const oldKeys = new Set(oldSnap.regions.map((region) => region.key));
-  const findings = [];
-  for (const oldRegion of oldSnap.regions) {
-    const newRegion = newByKey.get(oldRegion.key);
-    if (newRegion === void 0) {
-      findings.push(removedFinding(oldRegion, regionRemovalRule(rules, oldRegion.key)));
-      continue;
-    }
-    if (oldRegion.state === "ok" && newRegion.state !== "ok") {
-      findings.push(degradedFinding(newRegion));
-      continue;
-    }
-    findings.push(...diffRegionValues(oldRegion, newRegion, rules));
-  }
-  for (const newRegion of newSnap.regions) {
-    if (!oldKeys.has(newRegion.key)) findings.push(addedFinding(newRegion));
-  }
-  return findings;
-};
-var comparePass = (findings) => !findings.some(
-  (f) => f.suppressed === void 0 && (f.severity === "serious" || f.severity === "critical")
-);
-
-// src/compare/regions.ts
-var CANDIDATE_SELECTOR = [
-  "[data-region]",
-  "main",
-  "nav",
-  "header",
-  "aside",
-  "footer",
-  "section[aria-label]",
-  "[role=main]",
-  "[role=navigation]",
-  "[role=banner]",
-  "[role=complementary]",
-  "[role=contentinfo]",
-  "[role=region]"
-].join(",");
-var DEFAULT_EMPTY_MARKERS = [
-  "no data",
-  "no results",
-  "nothing to show",
-  "nothing here",
-  "get started"
-];
-var DEFAULT_ERROR_MARKERS = [
-  "something went wrong",
-  "failed to load",
-  "could not load",
-  "unavailable",
-  "try again"
-];
-var extractRegions = async (page, config = {}) => {
-  const emptyMarkers = [...DEFAULT_EMPTY_MARKERS, ...config.emptyStateMarkers ?? []];
-  const errorMarkers = [...DEFAULT_ERROR_MARKERS, ...config.errorStateMarkers ?? []];
-  return page.evaluate(
-    ({ selector, emptyMarkers: emptyMarkers2, errorMarkers: errorMarkers2 }) => {
-      const STATES = ["ok", "empty", "error", "loading"];
-      const isState = (value) => STATES.includes(value);
-      const slugify = (raw) => raw.toLowerCase().trim().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "").slice(0, 60) || "region";
-      const roleOf = (el) => {
-        const explicit = el.getAttribute("role");
-        if (explicit !== null && explicit !== "") return explicit;
-        const tag = el.tagName.toLowerCase();
-        if (tag === "main") return "main";
-        if (tag === "nav") return "navigation";
-        if (tag === "aside") return "complementary";
-        if (tag === "header" || tag === "footer") {
-          if (el.closest("main,nav,section,article,aside") !== null) return void 0;
-          return tag === "header" ? "banner" : "contentinfo";
-        }
-        return void 0;
-      };
-      const headingOf = (el) => {
-        const heading = el.querySelector("h1,h2,h3,h4,h5,h6");
-        const text = heading?.textContent?.trim();
-        return text !== void 0 && text !== "" ? text : void 0;
-      };
-      const keyOf = (el) => {
-        const region = el.getAttribute("data-region");
-        if (region !== null && region !== "") return slugify(region);
-        const testid = el.getAttribute("data-testid");
-        if (testid !== null && testid !== "") return slugify(testid);
-        const role = roleOf(el);
-        if (role !== void 0) return role;
-        const label = el.getAttribute("aria-label");
-        if (label !== null && label !== "") return slugify(label);
-        const heading = headingOf(el);
-        if (heading !== void 0) return slugify(heading);
-        return slugify(el.tagName);
-      };
-      const labelOf = (el, key) => {
-        const label = el.getAttribute("aria-label");
-        if (label !== null && label.trim() !== "") return label.trim();
-        const heading = headingOf(el);
-        if (heading !== void 0) return heading;
-        const testid = el.getAttribute("data-testid");
-        if (testid !== null && testid !== "") return testid;
-        return key;
-      };
-      const textOf = (el) => (el.innerText || el.textContent || "").trim();
-      const stateOf = (el, text) => {
-        const explicit = (el.getAttribute("data-state") ?? "").toLowerCase();
-        if (isState(explicit)) return explicit;
-        const lower = text.toLowerCase();
-        if (errorMarkers2.some((marker) => lower.includes(marker))) return "error";
-        if (lower.includes("loading")) return "loading";
-        if (emptyMarkers2.some((marker) => lower.includes(marker))) return "empty";
-        return "ok";
-      };
-      const valuesOf = (text) => (text.match(/-?\$?\s?\d[\d,]*(?:\.\d+)?%?/g) ?? []).map((token) => token.replace(/[$\s,]/g, "")).filter((token) => token !== "" && token !== "-");
-      const qualifies = (el) => {
-        const dataRegion = el.getAttribute("data-region");
-        if (dataRegion !== null && dataRegion !== "") {
-          const parent = el.parentElement;
-          return parent === null || parent.closest("[data-region]") === null;
-        }
-        return el.querySelector(selector) === null && el.closest("[data-region]") === null;
-      };
-      const candidates = Array.from(document.querySelectorAll(selector));
-      const regions = candidates.filter(qualifies);
-      const elements = regions.length > 0 ? regions : [document.body];
-      const used = {};
-      const uniqueKey = (key) => {
-        const count = (used[key] ?? 0) + 1;
-        used[key] = count;
-        return count === 1 ? key : `${key}-${count}`;
-      };
-      return elements.map((el) => {
-        const text = textOf(el);
-        const key = uniqueKey(keyOf(el));
-        return {
-          key,
-          label: labelOf(el, key),
-          state: stateOf(el, text),
-          values: valuesOf(text)
-        };
-      });
-    },
-    { selector: CANDIDATE_SELECTOR, emptyMarkers, errorMarkers }
-  );
-};
-var REGION_STATES = ["ok", "empty", "error", "loading"];
-var Region = z.object({
-  /** Stable id: data-region → data-testid → role → aria-label → heading slug. */
-  key: z.string(),
-  /** Human label for the report. */
-  label: z.string(),
-  state: z.enum(REGION_STATES),
-  /** Normalized numeric / currency / percent tokens found in the region. */
-  values: z.array(z.string())
-});
-var CompareSnapshot = z.object({
-  /** Route the snapshot was captured at, e.g. `/financials`. */
-  route: z.string(),
-  regions: z.array(Region)
-}).refine(
-  (snap) => new Set(snap.regions.map((region) => region.key)).size === snap.regions.length,
-  {
-    message: "region keys must be unique"
-  }
-);
-var ExpectedAbsentRule = z.object({
-  region: z.string().optional(),
-  value: z.string().optional(),
-  reason: z.string().min(1)
-}).refine((rule) => rule.region !== void 0 || rule.value !== void 0, {
-  message: "expectedAbsent rule needs at least one of `region` or `value`"
-});
-var CompareConfig = z.object({
-  expectedAbsent: z.array(ExpectedAbsentRule).optional(),
-  emptyStateMarkers: z.array(z.string()).optional(),
-  errorStateMarkers: z.array(z.string()).optional()
-});
-
-// src/compare/snapshot.ts
-var captureSnapshot = async (page, route, config) => ({
-  route,
-  regions: await extractRegions(page, config)
-});
-var saveSnapshot = async (snapshot, path) => {
-  await writeFile(path, JSON.stringify(snapshot, null, 2));
-};
-var loadSnapshot = async (path) => {
-  const raw = await readFile(path, "utf8");
-  return CompareSnapshot.parse(JSON.parse(raw));
-};
-
-// src/axes/compare.ts
-var skip2 = (message) => ({
-  axis: "compare",
-  pass: true,
-  findings: [{ message, severity: "minor" }]
-});
-var compareAxis = {
-  name: "compare",
-  run: async (context) => {
-    const { comparison, compareConfig, page } = context;
-    if (comparison === void 0) {
-      return skip2("no comparison snapshot provided; old-vs-new not assessed");
-    }
-    if (page === void 0) {
-      return skip2("compare needs a live page to extract the new snapshot");
-    }
-    const newSnapshot = await captureSnapshot(page, comparison.route, compareConfig);
-    const findings = diffSnapshots(comparison, newSnapshot, compareConfig);
-    return { axis: "compare", pass: comparePass(findings), findings };
-  }
-};
-
-// src/axes/runtime-health.ts
-var ERROR_MARKERS = [
-  "something went wrong",
-  "vite-error-overlay",
-  "vite-plugin-checker-error-overlay",
-  "react-error-overlay"
-];
-var pageErrorFindings = (console2) => console2.filter((entry) => entry.type === "pageerror").map((entry) => ({
-  message: `Uncaught page error: ${entry.text}`,
-  severity: "critical",
-  detail: entry.location
-}));
-var RESOURCE_LOAD_ECHO = "failed to load resource";
-var isResourceLoadEcho = (entry) => entry.text.toLowerCase().includes(RESOURCE_LOAD_ECHO);
-var consoleErrorFindings = (console2) => {
-  const seen = /* @__PURE__ */ new Set();
-  const findings = [];
-  for (const entry of console2) {
-    if (entry.type !== "error" || isResourceLoadEcho(entry) || seen.has(entry.text)) continue;
-    seen.add(entry.text);
-    findings.push({
-      message: `Console error: ${entry.text}`,
-      severity: "serious",
-      detail: entry.location
-    });
-  }
-  return findings;
-};
-var toNetworkFinding = (entry) => {
-  if (entry.status === 0) {
-    return {
-      message: `Request failed: ${entry.method} ${entry.url}`,
-      severity: "serious",
-      detail: entry.failure,
-      ref: entry.url
-    };
-  }
-  if (entry.status >= 500) {
-    return {
-      message: `Server error ${entry.status}: ${entry.method} ${entry.url}`,
-      severity: "serious",
-      ref: entry.url
-    };
-  }
-  if (entry.status >= 400) {
-    return {
-      message: `Client error ${entry.status}: ${entry.method} ${entry.url}`,
-      severity: "moderate",
-      ref: entry.url
-    };
-  }
-  return null;
-};
-var SEVERITY_RANK = { critical: 3, serious: 2, moderate: 1, minor: 0 };
-var networkFindings = (network) => {
-  const byUrl = /* @__PURE__ */ new Map();
-  for (const entry of network) {
-    const finding = toNetworkFinding(entry);
-    if (finding === null) continue;
-    const existing = byUrl.get(entry.url);
-    if (existing === void 0 || SEVERITY_RANK[finding.severity] > SEVERITY_RANK[existing.severity]) {
-      byUrl.set(entry.url, finding);
-    }
-  }
-  return [...byUrl.values()];
-};
-var errorMarkerFinding = (dom) => {
-  const lower = dom.toLowerCase();
-  const marker = ERROR_MARKERS.find((m) => lower.includes(m));
-  return marker === void 0 ? null : {
-    message: "Error boundary / error overlay rendered instead of the app",
-    severity: "critical",
-    detail: marker
-  };
-};
-var whiteScreenFinding = (renderedText) => renderedText !== void 0 && renderedText.length === 0 ? { message: "White screen: page rendered no visible text", severity: "critical" } : null;
-var runtimeHealthAxis = {
-  name: "runtime-health",
-  run: (context) => {
-    const { artifact } = context;
-    const findings = [
-      ...pageErrorFindings(artifact.console),
-      ...consoleErrorFindings(artifact.console),
-      ...networkFindings(artifact.network)
-    ];
-    const errorMarker = errorMarkerFinding(artifact.dom);
-    if (errorMarker !== null) findings.push(errorMarker);
-    const whiteScreen = whiteScreenFinding(artifact.renderedText);
-    if (whiteScreen !== null) findings.push(whiteScreen);
-    const fatal = ["critical", "serious"];
-    const pass = !findings.some((f) => fatal.includes(f.severity));
-    return Promise.resolve({ axis: "runtime-health", pass, findings });
-  }
-};
-var DRIFT_THRESHOLD = 0.01;
-var RESKIN_THRESHOLD = 5e-3;
-var DRIFT_PIXEL_THRESHOLD = 0.1;
-var RESKIN_PIXEL_THRESHOLD = 0.02;
-var DEFAULT_ALT_BRAND = "example-customer";
-var pngMismatchRatio = (a, b, pixelThreshold = DRIFT_PIXEL_THRESHOLD) => {
-  const imgA = PNG.sync.read(Buffer.from(a));
-  const imgB = PNG.sync.read(Buffer.from(b));
-  if (imgA.width !== imgB.width || imgA.height !== imgB.height) {
-    return { ratio: 1, sizeMismatch: true };
-  }
-  const total = imgA.width * imgA.height;
-  if (total === 0) return { ratio: 0, sizeMismatch: false };
-  const mismatched = pixelmatch(imgA.data, imgB.data, void 0, imgA.width, imgA.height, {
-    threshold: pixelThreshold
-  });
-  return { ratio: mismatched / total, sizeMismatch: false };
-};
-var baselineFinding = (screenshot, baseline) => {
-  const { ratio, sizeMismatch } = pngMismatchRatio(screenshot, baseline);
-  if (sizeMismatch) {
-    return {
-      message: "screenshot dimensions differ from baseline",
-      severity: "moderate"
-    };
-  }
-  if (ratio > DRIFT_THRESHOLD) {
-    return {
-      message: `visual drift ${(ratio * 100).toFixed(1)}% vs baseline`,
-      severity: "moderate",
-      detail: `${(ratio * 100).toFixed(2)}% of pixels changed`
-    };
-  }
-  return null;
-};
-var altBrandWasApplied = (altDom, brand) => altDom.includes(`data-brand="${brand}"`);
-var altBrandFinding = (screenshot, altScreenshot, brand, altDom) => {
-  if (!altBrandWasApplied(altDom, brand)) {
-    return {
-      message: `alt-brand re-skin not assessed: the app did not apply '${brand}' from ?brand=`,
-      severity: "minor",
-      detail: "Brand is usually build configuration rather than a runtime switch. To have this axis assess re-skinning, register the alternate brand and resolve the active id from the `brand` query parameter."
-    };
-  }
-  const { ratio } = pngMismatchRatio(screenshot, altScreenshot, RESKIN_PIXEL_THRESHOLD);
-  if (ratio < RESKIN_THRESHOLD) {
-    return {
-      message: `chrome did not re-skin under alternate brand '${brand}'`,
-      severity: "serious",
-      detail: `${(ratio * 100).toFixed(2)}% of pixels changed`
-    };
-  }
-  return null;
-};
-var interactiveContrastFindings = (brand) => checkInteractiveContrast(brand).map((warning) => ({
-  message: `brand '${brand.id}' ${warning.message}`,
-  severity: "moderate",
-  detail: `${warning.foreground} on ${warning.background} (${warning.palette})`
-}));
-var overflowFinding = async (page) => {
-  const overflows = await page.evaluate(
-    () => document.documentElement.scrollWidth > document.documentElement.clientWidth
-  );
-  if (overflows) {
-    return { message: "horizontal layout overflow", severity: "moderate" };
-  }
-  return null;
-};
-var visualBrandAxis = {
-  name: "visual-brand",
-  run: async (context) => {
-    const { artifact, baseline, captureUnderBrand, page } = context;
-    const findings = [];
-    if (baseline !== void 0) {
-      const finding = baselineFinding(artifact.screenshot, baseline);
-      if (finding !== null) findings.push(finding);
-    }
-    if (captureUnderBrand !== void 0) {
-      const altArtifact = await captureUnderBrand(DEFAULT_ALT_BRAND);
-      const finding = altBrandFinding(
-        artifact.screenshot,
-        altArtifact.screenshot,
-        DEFAULT_ALT_BRAND,
-        altArtifact.dom
-      );
-      if (finding !== null) findings.push(finding);
-      const altBrand = brands.find((brand) => brand.id === DEFAULT_ALT_BRAND);
-      if (altBrand !== void 0) findings.push(...interactiveContrastFindings(altBrand));
-    }
-    if (page !== void 0) {
-      const finding = await overflowFinding(page);
-      if (finding !== null) findings.push(finding);
-    }
-    const pass = !findings.some((f) => f.severity === "critical" || f.severity === "serious");
-    return { axis: "visual-brand", pass, findings };
-  }
-};
-
-// src/axes/index.ts
-var ALL_AXES = [
-  runtimeHealthAxis,
-  accessibilityAxis,
-  visualBrandAxis,
-  briefConformanceAxis,
-  compareAxis
-];
-
-// src/aggregate.ts
-var runAxes = async (axes, context) => {
-  const verdicts = [];
-  for (const axis of axes) {
-    try {
-      verdicts.push(await axis.run(context));
-    } catch (error) {
-      const message = error instanceof Error ? error.message : String(error);
-      console.error(`validate-ui: axis "${axis.name}" threw:`, error);
-      verdicts.push({
-        axis: axis.name,
-        pass: false,
-        findings: [{ message: `Axis crashed: ${message}`, severity: "critical" }]
-      });
-    }
-  }
-  return verdicts;
-};
-var aggregatePass = (verdicts) => verdicts.every((v) => v.pass);
-var withBrandParam = (url, brand) => {
-  const parsed = new URL(url);
-  parsed.searchParams.set("brand", brand);
-  return parsed.toString();
-};
-var validate = async (options) => {
-  const viewport = options.viewport ?? DESKTOP_VIEWPORT;
-  const axes = options.axes ?? ALL_AXES;
-  const browser = options.browser ?? await chromium.launch();
-  const ownsBrowser = !options.browser;
-  const context = await browser.newContext({
-    viewport: { width: viewport.width, height: viewport.height }
-  });
-  const page = await context.newPage();
-  try {
-    const artifact = await capturePage(page, options.url, viewport, options.timeoutMs);
-    const axisContext = {
-      artifact,
-      page,
-      browser,
-      brief: options.brief,
-      baseline: options.baseline,
-      comparison: options.comparison,
-      compareConfig: options.compareConfig,
-      captureUnderBrand: async (brand) => {
-        const brandContext = await browser.newContext({
-          viewport: { width: viewport.width, height: viewport.height }
-        });
-        const brandPage = await brandContext.newPage();
-        try {
-          return await capturePage(
-            brandPage,
-            withBrandParam(options.url, brand),
-            viewport,
-            options.timeoutMs
-          );
-        } finally {
-          await brandContext.close();
-        }
-      }
-    };
-    const verdicts = await runAxes(axes, axisContext);
-    return { url: options.url, pass: aggregatePass(verdicts), verdicts };
-  } finally {
-    await context.close();
-    if (ownsBrowser) await browser.close();
-  }
-};
-
-// src/compare/dedup.ts
-var groupKey = (finding) => `${finding.kind}::${finding.valueSignature}`;
-var dedupeSharedChrome = (perRoute) => {
-  const routesByGroup = /* @__PURE__ */ new Map();
-  for (const { route, findings } of perRoute) {
-    for (const finding of findings) {
-      const key = groupKey(finding);
-      const routes = routesByGroup.get(key) ?? /* @__PURE__ */ new Set();
-      routes.add(route);
-      routesByGroup.set(key, routes);
-    }
-  }
-  const sharedGroups = new Set(
-    [...routesByGroup].filter(([, routes]) => routes.size >= 2).map(([key]) => key)
-  );
-  const sharedChrome = [];
-  const seenShared = /* @__PURE__ */ new Set();
-  const trimmedPerRoute = perRoute.map(({ route, findings }) => ({
-    route,
-    findings: findings.filter((finding) => !sharedGroups.has(groupKey(finding)))
-  }));
-  for (const { findings } of perRoute) {
-    for (const finding of findings) {
-      const key = groupKey(finding);
-      if (!sharedGroups.has(key) || seenShared.has(key)) continue;
-      seenShared.add(key);
-      const routes = [...routesByGroup.get(key) ?? []].sort();
-      sharedChrome.push({
-        ...finding,
-        message: `${finding.message} (shared across ${routes.length} routes: ${routes.join(", ")})`
-      });
-    }
-  }
-  return { sharedChrome, perRoute: trimmedPerRoute };
-};
-var DEFAULT_TIMEOUT_MS2 = 3e4;
-var joinUrl = (base, route) => `${base.replace(/\/$/, "")}/${route.replace(/^\//, "")}`;
-var routeSnapshotFile = (route) => `${route.replace(/^\//, "").replace(/\/+$/, "").replace(/\//g, "_") || "index"}.json`;
-var compareRoutes = async (options) => {
-  if (options.oldBaseUrl === void 0 === (options.oldSnapshotDir === void 0)) {
-    throw new Error("compareRoutes: provide exactly one of oldBaseUrl or oldSnapshotDir");
-  }
-  const viewport = options.viewport ?? DESKTOP_VIEWPORT;
-  const timeoutMs = options.timeoutMs ?? DEFAULT_TIMEOUT_MS2;
-  const browser = options.browser ?? await chromium.launch();
-  const ownsBrowser = options.browser === void 0;
-  const { oldBaseUrl, oldSnapshotDir } = options;
-  const snapshotUrl = async (url, route) => {
-    const context = await browser.newContext({
-      viewport: { width: viewport.width, height: viewport.height }
-    });
-    const page = await context.newPage();
-    try {
-      await page.goto(url, { waitUntil: "networkidle", timeout: timeoutMs });
-      await prepareForScreenshot(page);
-      return await captureSnapshot(page, route, options.config);
-    } finally {
-      await context.close();
-    }
-  };
-  const oldSnapshotFor = (route) => {
-    if (oldBaseUrl !== void 0) return snapshotUrl(joinUrl(oldBaseUrl, route), route);
-    if (oldSnapshotDir !== void 0) {
-      return loadSnapshot(join(oldSnapshotDir, routeSnapshotFile(route)));
-    }
-    throw new Error("compareRoutes: provide exactly one of oldBaseUrl or oldSnapshotDir");
-  };
-  try {
-    const perRoute = [];
-    for (const route of options.routes) {
-      const oldSnapshot = await oldSnapshotFor(route);
-      const newSnapshot = await snapshotUrl(joinUrl(options.newBaseUrl, route), route);
-      perRoute.push({ route, findings: diffSnapshots(oldSnapshot, newSnapshot, options.config) });
-    }
-    const { sharedChrome, perRoute: trimmed } = dedupeSharedChrome(perRoute);
-    const routes = trimmed.map(({ route, findings }) => ({
-      route,
-      findings,
-      pass: comparePass(findings)
-    }));
-    const pass = comparePass(sharedChrome) && routes.every((route) => route.pass);
-    return { routes, sharedChrome, pass };
-  } finally {
-    if (ownsBrowser) await browser.close();
-  }
-};
-
+import { A as prepareForScreenshot, C as accessibilityAxis, D as MOBILE_VIEWPORT, E as DESKTOP_VIEWPORT, O as capture, S as briefConformanceAxis, T as DEFAULT_VIEWPORTS, _ as REGION_STATES, a as runAxes, b as comparePass, c as visualBrandAxis, d as captureSnapshot, f as loadSnapshot, g as ExpectedAbsentRule, h as CompareSnapshot, i as aggregatePass, k as capturePage, l as runtimeHealthAxis, m as CompareConfig, n as routeSnapshotFile, o as validate, p as saveSnapshot, r as dedupeSharedChrome, s as ALL_AXES, t as compareRoutes, u as compareAxis, v as Region, w as serveStatic, x as diffSnapshots, y as extractRegions } from "./runner-CLpaiCIG.js";
+//#region src/types.ts
+const SEVERITIES = [
+	"critical",
+	"serious",
+	"moderate",
+	"minor"
+];
+//#endregion
 export { ALL_AXES, CompareConfig, CompareSnapshot, DEFAULT_VIEWPORTS, DESKTOP_VIEWPORT, ExpectedAbsentRule, MOBILE_VIEWPORT, REGION_STATES, Region, SEVERITIES, accessibilityAxis, aggregatePass, briefConformanceAxis, capture, capturePage, captureSnapshot, compareAxis, comparePass, compareRoutes, dedupeSharedChrome, diffSnapshots, extractRegions, loadSnapshot, prepareForScreenshot, routeSnapshotFile, runAxes, runtimeHealthAxis, saveSnapshot, serveStatic, validate, visualBrandAxis };
-//# sourceMappingURL=index.js.map
+
 //# sourceMappingURL=index.js.map