@jitsusama/agentic-harness.core 0.1.0

package/dist/web/audit/health.js

@@ -0,0 +1,57 @@
+/**
+ * One question that asks all the others.
+ *
+ * A person who has just changed something wants to know whether
+ * they broke anything, and does not want to run five checks to
+ * find out. This composes them into one answer: the worst
+ * standing across all of them, a line each, and the detail left
+ * behind a named kind.
+ *
+ * The digest deliberately reports what it could not run. A check
+ * that failed to execute is not a check that passed, and a
+ * digest that quietly drops one is worse than no digest, because
+ * it looks like coverage.
+ */
+import { renderVerdict } from "./verdict.js";
+const MARK = {
+    pass: "pass",
+    warn: "warn",
+    fail: "FAIL",
+};
+/** The worst standing among the parts. */
+export function overallOf(parts) {
+    if (parts.some((part) => part.standing === "fail"))
+        return "fail";
+    return parts.some((part) => part.standing === "warn") ? "warn" : "pass";
+}
+/** Say how the page is doing, across every check. */
+export function renderHealth(parts) {
+    if (parts.length === 0) {
+        return renderVerdict({ standing: "warn", headline: "No checks were run." }, "");
+    }
+    const width = Math.max(...parts.map((part) => part.kind.length));
+    const lines = parts.map((part) => `  ${part.kind.padEnd(width)}  ${MARK[part.standing].padEnd(4)}  ` +
+        part.headline);
+    const broken = parts.filter((part) => part.failedToRun);
+    const failing = parts.filter((part) => part.standing === "fail");
+    const warning = parts.filter((part) => part.standing === "warn");
+    return renderVerdict({
+        standing: overallOf(parts),
+        headline: headlineFor(failing, warning),
+        measured: broken.length === 0
+            ? `Ran ${parts.length} checks.`
+            : `Ran ${parts.length - broken.length} of ${parts.length} checks; ` +
+                `${broken.map((part) => part.kind).join(", ")} could not run.`,
+    }, [...lines, "", "Name a kind to run just that one in full."].join("\n"));
+}
+function headlineFor(failing, warning) {
+    if (failing.length > 0) {
+        return `${failing.map((part) => part.kind).join(", ")} ${failing.length === 1 ? "fails" : "fail"}.`;
+    }
+    if (warning.length > 0) {
+        return `Nothing fails, but ${warning
+            .map((part) => part.kind)
+            .join(", ")} raised something.`;
+    }
+    return "Everything checks out.";
+}

package/dist/web/audit/index.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Judging a page against accessibility criteria.
+ *
+ * The arithmetic here is pure and capture-agnostic: colours and
+ * rectangles in, verdicts out. Nothing in this subdomain talks
+ * to a browser, which is what lets the same functions judge a
+ * live page, a stored capture or a design token.
+ */
+export { type A11yFinding, type Authority, type AxeTally, authorityOf, type ConformanceBar, criteriaOf, ENHANCED_WCAG_RULES, EXPERIMENTAL_WCAG_RULES, enabledRules, type FindingKind, type FindingNode, hardestLevel, type Impact, levelsOf, MAX_NODE_HTML, mergeFindings, type RawAxeNode, type RawAxeResult, type RawAxeRun, readAxeRun, readResult, tallyFindings, withinBar, } from "./axe.js";
+export { type BehindReport, foldBehind, type Pixels, type Rgb, renderBehind, } from "./behind.js";
+export { type AxFacts, buildStructure, selectorFor, } from "./capture.js";
+export { composite, contrastRatio, deltaE, formatRgb, isOpaque, isTransparent, parseRgb, type Rgba, relativeLuminance, } from "./colour.js";
+export { BOLD_WEIGHT, type ContrastLevel, type ContrastVerdict, isLargeText, judgeNonText, judgeText, LARGE_BOLD_PX, LARGE_TEXT_PX, NON_TEXT_MINIMUM, renderContrast, type TextSizing, textThreshold, undecidable, } from "./contrast.js";
+export { overallOf, type Part, renderHealth } from "./health.js";
+export { foldPair, type PaintedSide, type PairReport, renderPair, } from "./pair.js";
+export { TARGET_CAPTURE, visualCaptureSource } from "./probe.js";
+export { MAX_LISTED_NODES, renderAudit, renderFinding, renderIndex, renderSummary, } from "./report.js";
+export { analyseStructure, autocompleteTokens, brokenReferences, formLabelling, headingOutline, hiddenButFocusable, IDREF_ATTRIBUTES, LANDMARK_ROLES, landmarkNaming, manualTabOrder, nestedInteractives, SINGLE_IDREF_ATTRIBUTES, type StructureNode, SUPERSEDED_BY, } from "./structure.js";
+export { type Condition, conditionFrom, DEFAULT_WIDTHS, headlineOf, renderSweep, type Sweepable, standingOf, widthsToSweep, worstOf, } from "./sweep.js";
+export { type CapturedTarget, ENHANCED_TARGET_PX, type HitTarget, judgeTarget, judgeTargets, MINIMUM_TARGET_PX, renderTargets, type TargetException, type TargetLevel, type TargetVerdict, targetFindings, } from "./target.js";
+export { renderVerdict, type Standing, standingFor, type Verdict, } from "./verdict.js";
+export { ASPECT_TOLERANCE, analyseVisual, brokenImages, clippedContent, distortedImages, escapedElements, HIDDEN_BOX_PX, horizontalOverflow, isVisuallyHidden, type PageBox, SMALL_TEXT_PX, tinyText, type VisualNode, } from "./visual.js";

package/dist/web/audit/index.js

@@ -0,0 +1,22 @@
+/**
+ * Judging a page against accessibility criteria.
+ *
+ * The arithmetic here is pure and capture-agnostic: colours and
+ * rectangles in, verdicts out. Nothing in this subdomain talks
+ * to a browser, which is what lets the same functions judge a
+ * live page, a stored capture or a design token.
+ */
+export { authorityOf, criteriaOf, ENHANCED_WCAG_RULES, EXPERIMENTAL_WCAG_RULES, enabledRules, hardestLevel, levelsOf, MAX_NODE_HTML, mergeFindings, readAxeRun, readResult, tallyFindings, withinBar, } from "./axe.js";
+export { foldBehind, renderBehind, } from "./behind.js";
+export { buildStructure, selectorFor, } from "./capture.js";
+export { composite, contrastRatio, deltaE, formatRgb, isOpaque, isTransparent, parseRgb, relativeLuminance, } from "./colour.js";
+export { BOLD_WEIGHT, isLargeText, judgeNonText, judgeText, LARGE_BOLD_PX, LARGE_TEXT_PX, NON_TEXT_MINIMUM, renderContrast, textThreshold, undecidable, } from "./contrast.js";
+export { overallOf, renderHealth } from "./health.js";
+export { foldPair, renderPair, } from "./pair.js";
+export { TARGET_CAPTURE, visualCaptureSource } from "./probe.js";
+export { MAX_LISTED_NODES, renderAudit, renderFinding, renderIndex, renderSummary, } from "./report.js";
+export { analyseStructure, autocompleteTokens, brokenReferences, formLabelling, headingOutline, hiddenButFocusable, IDREF_ATTRIBUTES, LANDMARK_ROLES, landmarkNaming, manualTabOrder, nestedInteractives, SINGLE_IDREF_ATTRIBUTES, SUPERSEDED_BY, } from "./structure.js";
+export { conditionFrom, DEFAULT_WIDTHS, headlineOf, renderSweep, standingOf, widthsToSweep, worstOf, } from "./sweep.js";
+export { ENHANCED_TARGET_PX, judgeTarget, judgeTargets, MINIMUM_TARGET_PX, renderTargets, targetFindings, } from "./target.js";
+export { renderVerdict, standingFor, } from "./verdict.js";
+export { ASPECT_TOLERANCE, analyseVisual, brokenImages, clippedContent, distortedImages, escapedElements, HIDDEN_BOX_PX, horizontalOverflow, isVisuallyHidden, SMALL_TEXT_PX, tinyText, } from "./visual.js";

package/dist/web/audit/pair.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Contrast between two elements the caller named.
+ *
+ * axe judges text against its background and reports the pairs it
+ * recognises. What it will not do is answer a question about two
+ * elements somebody chose: this icon against that card, this input's
+ * border against the page, this focused state against its resting
+ * one. Those are 1.4.11 territory, and the machinery for judging them
+ * has been here all along with nothing to reach it.
+ *
+ * Judging is the easy half. Choosing what to compare is where a tool
+ * like this earns or loses its trust, so the choice is made by one
+ * stated rule and reported alongside the ratio. A caller who
+ * disagrees can see exactly what was taken from each side.
+ */
+import { type ContrastLevel, type TextSizing } from "./contrast.js";
+/** What one side of the comparison paints. */
+export interface PaintedSide {
+    /** Whether it has text of its own, which decides the criterion. */
+    readonly hasText: boolean;
+    readonly color?: string;
+    readonly backgroundColor?: string;
+    readonly borderColor?: string;
+    /** Needed only when it has text, to know which bar applies. */
+    readonly sizing?: TextSizing;
+}
+/** What the comparison found, and what it was between. */
+export interface PairReport {
+    /** The property taken from each side, named so it can be argued with. */
+    readonly compared: {
+        readonly one: string;
+        readonly other: string;
+    };
+    readonly ratio: number;
+    readonly required: number;
+    /** The success criterion that applies to a pair of this kind. */
+    readonly criterion: "1.4.3" | "1.4.11";
+    readonly verdict: "pass" | "fail" | "undecidable";
+    /** Why it could not decide, when it could not. */
+    readonly undecided?: string;
+}
+/**
+ * Judge two elements against the criterion their pairing implies.
+ *
+ * Text on one side makes this 1.4.3, whose bar depends on the text
+ * size. Two painted surfaces make it 1.4.11, which asks three to one
+ * of any boundary a reader has to see.
+ */
+export declare function foldPair(input: {
+    readonly one: PaintedSide;
+    readonly other: PaintedSide;
+    readonly bar: ContrastLevel;
+}): PairReport;
+/** Render a pairing as a verdict a reader can act on. */
+export declare function renderPair(report: PairReport): string;

package/dist/web/audit/pair.js

@@ -0,0 +1,157 @@
+/**
+ * Contrast between two elements the caller named.
+ *
+ * axe judges text against its background and reports the pairs it
+ * recognises. What it will not do is answer a question about two
+ * elements somebody chose: this icon against that card, this input's
+ * border against the page, this focused state against its resting
+ * one. Those are 1.4.11 territory, and the machinery for judging them
+ * has been here all along with nothing to reach it.
+ *
+ * Judging is the easy half. Choosing what to compare is where a tool
+ * like this earns or loses its trust, so the choice is made by one
+ * stated rule and reported alongside the ratio. A caller who
+ * disagrees can see exactly what was taken from each side.
+ */
+import { isOpaque, parseRgb } from "./colour.js";
+import { isLargeText, NON_TEXT_MINIMUM, } from "./contrast.js";
+/** Relative luminance, per WCAG's definition. */
+function luminance(colour) {
+    const channel = (raw) => {
+        const s = raw / 255;
+        return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
+    };
+    return (0.2126 * channel(colour.r) +
+        0.7152 * channel(colour.g) +
+        0.0722 * channel(colour.b));
+}
+/** The contrast ratio between two colours, per WCAG. */
+function ratioOf(one, other) {
+    const [lighter, darker] = luminance(one) > luminance(other)
+        ? [luminance(one), luminance(other)]
+        : [luminance(other), luminance(one)];
+    return (lighter + 0.05) / (darker + 0.05);
+}
+/**
+ * Take the colour a reader actually sees on this side.
+ *
+ * The two sides are not interchangeable. The subject is the thing
+ * being judged, so its text comes first: an element with text is
+ * being read rather than looked at. The surface is what the subject
+ * sits against, and its own text is nothing to do with the question,
+ * so only what it paints counts. Reading text on both sides compared
+ * a heading's colour against a card's inherited colour and reported
+ * black on black at 1:1, which is how this rule was found.
+ *
+ * A see-through colour is not a colour: the thing behind it belongs
+ * to an ancestor this cannot name, so it is refused rather than
+ * guessed at.
+ */
+function take(side, part) {
+    const wanted = part === "subject" && side.hasText
+        ? [["color", side.color]]
+        : [
+            ["background-color", side.backgroundColor],
+            ["border-color", side.borderColor],
+        ];
+    for (const [property, stated] of wanted) {
+        if (stated === undefined)
+            continue;
+        const colour = parseRgb(stated);
+        if (!colour) {
+            return {
+                ok: false,
+                why: `its ${property} could not be read, being "${stated}"`,
+            };
+        }
+        // Transparent is worth stepping past rather than failing on,
+        // since the next candidate is usually the one doing the work.
+        if (!isOpaque(colour))
+            continue;
+        return { ok: true, property, colour };
+    }
+    return {
+        ok: false,
+        why: "it paints nothing of its own, so there is no colour to compare",
+    };
+}
+/**
+ * Judge two elements against the criterion their pairing implies.
+ *
+ * Text on one side makes this 1.4.3, whose bar depends on the text
+ * size. Two painted surfaces make it 1.4.11, which asks three to one
+ * of any boundary a reader has to see.
+ */
+export function foldPair(input) {
+    const { one, other, bar } = input;
+    // The subject decides the criterion. Whether the surface behind it
+    // happens to carry text of its own says nothing about what is being
+    // judged here.
+    const criterion = one.hasText ? "1.4.3" : "1.4.11";
+    const large = isLargeText(one.sizing ?? other.sizing ?? DEFAULT_SIZING);
+    const required = criterion === "1.4.11"
+        ? NON_TEXT_MINIMUM
+        : bar === "AAA"
+            ? large
+                ? 4.5
+                : 7
+            : large
+                ? 3
+                : 4.5;
+    const first = take(one, "subject");
+    const second = take(other, "surface");
+    // Each side is refused on its own, which is what lets the pair
+    // below be read as two colours without a cast.
+    const undecided = (which, why) => ({
+        compared: {
+            one: first.ok ? first.property : "nothing",
+            other: second.ok ? second.property : "nothing",
+        },
+        ratio: 0,
+        required,
+        criterion,
+        verdict: "undecidable",
+        undecided: `${which}: ${why}`,
+    });
+    if (!first.ok)
+        return undecided("the first element", first.why);
+    if (!second.ok)
+        return undecided("the second element", second.why);
+    const ratio = ratioOf(first.colour, second.colour);
+    return {
+        compared: { one: first.property, other: second.property },
+        ratio,
+        required,
+        criterion,
+        verdict: ratio >= required ? "pass" : "fail",
+    };
+}
+/** Sizing to assume when neither side stated any. */
+const DEFAULT_SIZING = { fontSizePx: 16, fontWeight: 400 };
+/** Render a pairing as a verdict a reader can act on. */
+export function renderPair(report) {
+    if (report.verdict === "undecidable") {
+        return [
+            "WARN the contrast between these two could not be judged",
+            "",
+            `Nothing was measured because ${report.undecided}.`,
+            "",
+            "A see-through colour belongs to whatever is behind it, which " +
+                "this cannot name. Point at the element that actually paints " +
+                "the surface, or use kind \"contrast\" with 'within' alone to " +
+                "measure text against the pixels behind its glyphs.",
+        ].join("\n");
+    }
+    const mark = report.verdict === "pass" ? "PASS" : "FAIL";
+    const criterion = report.criterion === "1.4.3"
+        ? "1.4.3 contrast of text"
+        : "1.4.11 contrast of things that are not text";
+    return [
+        `${mark} ${report.ratio.toFixed(2)}:1, against ${report.required}:1 ` +
+            `required by ${criterion}`,
+        "",
+        `Measured between the ${report.compared.one} of the first and the ` +
+            `${report.compared.other} of the second. Name different elements ` +
+            "if that is not the boundary you meant.",
+    ].join("\n");
+}

package/dist/web/audit/probe.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Asking the page what its layout did.
+ *
+ * Every number here is one the browser computed: bounding
+ * rectangles, scroll against client dimensions, the resolved
+ * overflow, an image's own size. None of it is derived from CSS
+ * text, because the CSS is not what happened, the layout is.
+ *
+ * It ships as a source string because it declares helpers, and
+ * the bundler rewrites named inner bindings through a wrapper
+ * the page does not have.
+ */
+/**
+ * Build the expression that collects the layout capture.
+ *
+ * Only elements the browser actually drew are collected, since
+ * a rule about how something looks has nothing to say about
+ * something that was never painted.
+ */
+export declare function visualCaptureSource(): string;
+/**
+ * Collect every pointer target on the page with the facts WCAG
+ * 2.5.8 needs to judge it.
+ *
+ * The two exceptions the criterion turns on are both facts about
+ * layout that only the browser can settle, so both are measured
+ * here rather than guessed from a tag name. A target is inline
+ * when the browser lays it out inline inside a run of text, and
+ * user-agent controlled when the page sets no size for it.
+ */
+export declare const TARGET_CAPTURE = "(() => {\n\t\n\tconst __shadowOf = (el) => {\n\t\ttry { return el.shadowRoot; } catch { return null; }\n\t};\n\tconst __docOf = (el) => {\n\t\t// Reaching into a cross-origin frame throws by design.\n\t\ttry { return el.contentDocument; } catch { return null; }\n\t};\n\tlet __unreachableFrames = 0;\n\tconst deepElements = (root) => {\n\t\tconst out = [];\n\t\tconst visit = (node) => {\n\t\t\tfor (const el of node.querySelectorAll(\"*\")) {\n\t\t\t\tout.push(el);\n\t\t\t\tconst shadow = __shadowOf(el);\n\t\t\t\tif (shadow) visit(shadow);\n\t\t\t\tif (el.tagName === \"IFRAME\" || el.tagName === \"FRAME\") {\n\t\t\t\t\tconst doc = __docOf(el);\n\t\t\t\t\tif (doc && doc.documentElement) visit(doc);\n\t\t\t\t\telse __unreachableFrames++;\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tvisit(root || document);\n\t\treturn out;\n\t};\n\tconst __oneSelector = (el) => {\n\t\tconst tag = el.tagName.toLowerCase();\n\t\tif (el.id) return \"#\" + el.id;\n\t\tconst hook = el.getAttribute(\"data-testid\");\n\t\tif (hook) return tag + '[data-testid=\"' + hook + '\"]';\n\t\tconst first = el.classList && el.classList[0];\n\t\tif (first) return tag + \".\" + first;\n\t\tconst parent = el.parentElement;\n\t\tif (!parent) return tag;\n\t\tconst kin = [...parent.children].filter((c) => c.tagName === el.tagName);\n\t\tif (kin.length === 1) return tag;\n\t\treturn tag + \":nth-of-type(\" + (kin.indexOf(el) + 1) + \")\";\n\t};\n\t// Cross a boundary by naming the host, so the path can be\n\t// followed by hand: \"my-card >> button\".\n\tconst deepSelectorFor = (el) => {\n\t\tconst parts = [__oneSelector(el)];\n\t\tlet node = el;\n\t\tfor (let hops = 0; hops < 10; hops++) {\n\t\t\tconst root = node.getRootNode ? node.getRootNode() : null;\n\t\t\tconst host = root && root.host;\n\t\t\tconst frame = root && root.defaultView && root.defaultView.frameElement;\n\t\t\tconst crossing = host || frame;\n\t\t\tif (!crossing) break;\n\t\t\tparts.unshift(__oneSelector(crossing));\n\t\t\tnode = crossing;\n\t\t}\n\t\treturn parts.join(\" >> \");\n\t};\n\n\t\n\t// The browser's own answer, but only when asked the whole\n\t// question. Bare checkVisibility() reports on display alone,\n\t// so it calls a visibility:hidden control visible, and real\n\t// apps hide closed menus and dialogs exactly that way.\n\t//\n\t// opacity is deliberately not asked about. An opacity:0\n\t// control is still in the focus order and still clickable, so\n\t// treating it as absent buries real defects rather than\n\t// avoiding false ones.\n\tconst visible = (el) =>\n\t\ttypeof el.checkVisibility === \"function\"\n\t\t\t? el.checkVisibility({\n\t\t\t\t\tvisibilityProperty: true,\n\t\t\t\t\tcontentVisibilityAuto: true,\n\t\t\t\t})\n\t\t\t: el.getClientRects().length > 0;\n\n\t// inert takes a subtree out of interaction without changing\n\t// anything about how it looks, so no style question finds it.\n\t// A closed dialog is the ordinary case.\n\tconst inertHere = (el) =>\n\t\ttypeof el.closest === \"function\" && el.closest(\"[inert]\") !== null;\n\n\t// The screen-reader-only family: clipped to nothing, or parked\n\t// off the left edge where no scrollable area is created. Such\n\t// an element is deliberately not shown to sighted users, so it\n\t// is not something they can look at or aim a pointer at.\n\tconst visuallyHidden = (el) => {\n\t\tconst rect = el.getBoundingClientRect();\n\t\tconst tiny =\n\t\t\trect.width <= 4 && rect.height <= 4;\n\t\tconst style = getComputedStyle(el);\n\t\tif (tiny && style.clipPath !== \"none\") return true;\n\t\tif (tiny && style.overflowX === \"hidden\") return true;\n\t\treturn rect.x + rect.width < 0;\n\t};\n\n\t// Offered to somebody: painted, not inert, and not hidden by\n\t// one of the idioms above.\n\tconst presented = (el) =>\n\t\tvisible(el) && !inertHere(el) && !visuallyHidden(el);\n\n\tconst selector = [\n\t\t\"a[href]\", \"button\", \"input\", \"select\", \"textarea\", \"summary\",\n\t\t\"[role=button]\", \"[role=link]\", \"[role=checkbox]\", \"[role=radio]\",\n\t\t\"[role=switch]\", \"[role=tab]\", \"[role=menuitem]\", \"[role=option]\",\n\t].join(\",\");\n\n\n\t// Inline in the specification's sense: laid out inline, and\n\t// sitting among text rather than alone in its own block. A\n\t// link in a sentence is excepted; a link that happens to be\n\t// display:inline but is the only thing in its parent is not.\n\tconst inTextFlow = (el, style) => {\n\t\tif (style.display !== \"inline\") return false;\n\t\tconst parent = el.parentElement;\n\t\tif (!parent) return false;\n\t\tlet text = \"\";\n\t\tfor (const node of parent.childNodes) {\n\t\t\tif (node.nodeType === 3) text += node.nodeValue || \"\";\n\t\t}\n\t\treturn text.trim().length > 0;\n\t};\n\n\t// The criterion's other exception, for a control whose size\n\t// the user agent decides and the author never touched, is not\n\t// claimed here. Nothing the page can ask distinguishes \"the\n\t// browser chose this size\" from \"a stylesheet chose it\": a\n\t// first attempt read the inline style attribute, which sees\n\t// nothing when the size comes from a class, and excepted every\n\t// undersized button on the fixture. Guessing it wrong excuses\n\t// real failures, and a well-spaced native control is already\n\t// excepted by the spacing rule below, so the honest move is to\n\t// measure what we can and leave this to a person.\n\n\tconst targets = [];\n\tlet index = 0;\n\tfor (const el of deepElements(document)) {\n\t\tif (!el.matches(selector)) continue;\n\t\tif (el.disabled) continue;\n\t\t// Only things a pointer is actually offered. A control inside\n\t\t// a closed dialog is not aimed at, and a screen-reader-only\n\t\t// input is operated through its visible label rather than its\n\t\t// own one-pixel box: reporting those as undersized targets\n\t\t// filed ten failures against a page that has none.\n\t\tif (!presented(el)) continue;\n\t\tconst rect = el.getBoundingClientRect();\n\t\tif (rect.width <= 0 || rect.height <= 0) continue;\n\t\tconst style = getComputedStyle(el);\n\t\tconst id = \"t\" + index++;\n\t\tconst target = {\n\t\t\tid,\n\t\t\tselector: deepSelectorFor(el),\n\t\t\trect: {\n\t\t\t\tx: rect.x + scrollX, y: rect.y + scrollY,\n\t\t\t\twidth: rect.width, height: rect.height,\n\t\t\t},\n\t\t};\n\t\tif (inTextFlow(el, style)) target.inline = true;\n\t\ttargets.push(target);\n\t}\n\treturn targets;\n})()";

package/dist/web/audit/probe.js

@@ -0,0 +1,189 @@
+/**
+ * Asking the page what its layout did.
+ *
+ * Every number here is one the browser computed: bounding
+ * rectangles, scroll against client dimensions, the resolved
+ * overflow, an image's own size. None of it is derived from CSS
+ * text, because the CSS is not what happened, the layout is.
+ *
+ * It ships as a source string because it declares helpers, and
+ * the bundler rewrites named inner bindings through a wrapper
+ * the page does not have.
+ */
+import { DEEP_DOM } from "../snapshot/deep.js";
+import { PRESENTED } from "../snapshot/presented.js";
+/** How much text to carry back per element. */
+const MAX_TEXT = 120;
+/**
+ * Build the expression that collects the layout capture.
+ *
+ * Only elements the browser actually drew are collected, since
+ * a rule about how something looks has nothing to say about
+ * something that was never painted.
+ */
+export function visualCaptureSource() {
+    return `(() => {
+	${DEEP_DOM}
+	${PRESENTED}
+	const MAX_TEXT = ${MAX_TEXT};
+
+	const ownText = (el) => {
+		let out = "";
+		for (const child of el.childNodes) {
+			if (child.nodeType === 3) out += child.nodeValue || "";
+		}
+		return out.trim().slice(0, MAX_TEXT);
+	};
+
+	const selectorFor = (el) => {
+		const tag = el.tagName.toLowerCase();
+		if (el.id) return "#" + el.id;
+		const hook = el.getAttribute("data-testid");
+		if (hook) return tag + '[data-testid="' + hook + '"]';
+		const first = el.classList[0];
+		if (first) return tag + "." + first;
+		const parent = el.parentElement;
+		if (!parent) return tag;
+		const kin = [...parent.children].filter((c) => c.tagName === el.tagName);
+		if (kin.length === 1) return tag;
+		return tag + ":nth-of-type(" + (kin.indexOf(el) + 1) + ")";
+	};
+
+	const nodes = [];
+	let index = 0;
+	for (const el of deepElements(document)) {
+		const tag = el.tagName.toLowerCase();
+		if (tag === "script" || tag === "style" || tag === "head") continue;
+		// Painted at all: the browser's own answer, and the only one
+		// that accounts for a display:none ancestor. Visually-hidden
+		// idioms are not excluded here, because the layout rules
+		// recognise those themselves and want to see them.
+		if (!visible(el)) continue;
+		const rect = el.getBoundingClientRect();
+		const style = getComputedStyle(el);
+		const node = {
+			id: "v" + index++,
+			selector: deepSelectorFor(el),
+			tag,
+			rect: {
+				x: rect.x + scrollX,
+				y: rect.y + scrollY,
+				width: rect.width,
+				height: rect.height,
+			},
+			scrollWidth: el.scrollWidth,
+			scrollHeight: el.scrollHeight,
+			clientWidth: el.clientWidth,
+			clientHeight: el.clientHeight,
+			overflowX: style.overflowX,
+			overflowY: style.overflowY,
+			fontSizePx: Number.parseFloat(style.fontSize) || 0,
+			clipPath: style.clipPath,
+			// The three properties that separate a deliberate idiom
+			// from a defect. Without them the clipping rule cannot
+			// tell an ellipsis from an amputation, and the image rule
+			// cannot tell a cover crop from a squash, so both fire on
+			// most of the real web.
+			textOverflow: style.textOverflow,
+			lineClamp: style.webkitLineClamp || style.lineClamp || "none",
+			objectFit: style.objectFit,
+		};
+		const text = ownText(el);
+		if (text) node.text = text;
+		if (tag === "img") {
+			node.naturalWidth = el.naturalWidth;
+			node.naturalHeight = el.naturalHeight;
+			node.complete = el.complete;
+			node.src = el.currentSrc || el.src;
+		}
+		nodes.push(node);
+	}
+
+	return {
+		viewport: {
+			width: innerWidth,
+			height: innerHeight,
+			documentWidth: document.documentElement.scrollWidth,
+			documentHeight: document.documentElement.scrollHeight,
+			// The offset the rects above were taken against, so a
+			// caller working in viewport coordinates can get back.
+			scrollX, scrollY,
+		},
+		nodes,
+	};
+})()`;
+}
+/**
+ * Collect every pointer target on the page with the facts WCAG
+ * 2.5.8 needs to judge it.
+ *
+ * The two exceptions the criterion turns on are both facts about
+ * layout that only the browser can settle, so both are measured
+ * here rather than guessed from a tag name. A target is inline
+ * when the browser lays it out inline inside a run of text, and
+ * user-agent controlled when the page sets no size for it.
+ */
+export const TARGET_CAPTURE = `(() => {
+	${DEEP_DOM}
+	${PRESENTED}
+	const selector = [
+		"a[href]", "button", "input", "select", "textarea", "summary",
+		"[role=button]", "[role=link]", "[role=checkbox]", "[role=radio]",
+		"[role=switch]", "[role=tab]", "[role=menuitem]", "[role=option]",
+	].join(",");
+
+
+	// Inline in the specification's sense: laid out inline, and
+	// sitting among text rather than alone in its own block. A
+	// link in a sentence is excepted; a link that happens to be
+	// display:inline but is the only thing in its parent is not.
+	const inTextFlow = (el, style) => {
+		if (style.display !== "inline") return false;
+		const parent = el.parentElement;
+		if (!parent) return false;
+		let text = "";
+		for (const node of parent.childNodes) {
+			if (node.nodeType === 3) text += node.nodeValue || "";
+		}
+		return text.trim().length > 0;
+	};
+
+	// The criterion's other exception, for a control whose size
+	// the user agent decides and the author never touched, is not
+	// claimed here. Nothing the page can ask distinguishes "the
+	// browser chose this size" from "a stylesheet chose it": a
+	// first attempt read the inline style attribute, which sees
+	// nothing when the size comes from a class, and excepted every
+	// undersized button on the fixture. Guessing it wrong excuses
+	// real failures, and a well-spaced native control is already
+	// excepted by the spacing rule below, so the honest move is to
+	// measure what we can and leave this to a person.
+
+	const targets = [];
+	let index = 0;
+	for (const el of deepElements(document)) {
+		if (!el.matches(selector)) continue;
+		if (el.disabled) continue;
+		// Only things a pointer is actually offered. A control inside
+		// a closed dialog is not aimed at, and a screen-reader-only
+		// input is operated through its visible label rather than its
+		// own one-pixel box: reporting those as undersized targets
+		// filed ten failures against a page that has none.
+		if (!presented(el)) continue;
+		const rect = el.getBoundingClientRect();
+		if (rect.width <= 0 || rect.height <= 0) continue;
+		const style = getComputedStyle(el);
+		const id = "t" + index++;
+		const target = {
+			id,
+			selector: deepSelectorFor(el),
+			rect: {
+				x: rect.x + scrollX, y: rect.y + scrollY,
+				width: rect.width, height: rect.height,
+			},
+		};
+		if (inTextFlow(el, style)) target.inline = true;
+		targets.push(target);
+	}
+	return targets;
+})()`;

package/dist/web/audit/report.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Reporting accessibility findings without drowning the reader.
+ *
+ * Summary first, then one line per rule, then detail only when
+ * asked for by rule name. A finding nobody can act on because it
+ * arrived inside forty kilobytes of markup is not a finding.
+ */
+import { type A11yFinding, type AxeTally, type ConformanceBar } from "./axe.js";
+/** How many elements to name under a rule before counting. */
+export declare const MAX_LISTED_NODES = 5;
+export declare function renderSummary(tally: AxeTally): string;
+/** One line per rule: enough to choose what to read. */
+export declare function renderIndex(findings: readonly A11yFinding[]): string;
+/** Everything known about one rule, for when it is asked about. */
+export declare function renderFinding(finding: A11yFinding): string;
+/** The whole report, summary first. */
+export declare function renderAudit(unordered: readonly A11yFinding[], tally: AxeTally, options?: {
+    readonly rule?: string;
+    readonly measured?: string;
+    /** The bar the audit was held to, when it was not the default. */
+    readonly bar?: ConformanceBar;
+}): string;