@ggui-ai/ui-gen 0.25.0 → 0.27.0

package/src/evaluation/visual-evaluator.ts

@@ -30,11 +30,21 @@ import { createRequire } from 'node:module';
 import { existsSync, writeFileSync, mkdtempSync, rmSync } from 'fs';
 import { createHash } from 'node:crypto';
 import { tmpdir } from 'os';
-import { createVisionAgent, type AgentConfig } from '../harness/llm-router';
+import { createVisionAgent, type AgentConfig, type VisionFinishReason } from '../harness/llm-router';
 import type { EvaluationResult, EvaluationIssue, DimensionScores } from './types';
-import type { CanvasHostPresentation, CanvasJudgeRecord, CanvasPresentationOutcome, CanvasVisualSummary, EvalIssue, HostInlineFrame, HostPresentationIgnoredReason, VisualCoverage, VisualEvalSummary, VisualFitStamp } from './types-public.js';
+
+/**
+ * An issue as the visual leg CREATES it (ggui#1545 follow-up): its `origin` is required here, so a new producer, an
+ * instrument check or a judge-side parse, that forgets to say whose finding it is fails to compile instead of
+ * quietly dropping out of `visualEvaluation.actOn`'s treatment. The public `EvaluationIssue` keeps `origin` optional
+ * for stored and external data.
+ */
+type VisualIssue = EvaluationIssue & { origin: 'judge' | 'instrument' };
+import type { CanvasHostPresentation, CanvasJudgeRecord, CriteriaAnswerCounts, CanvasPresentationOutcome, CanvasVisualSummary, EvalIssue, HostInlineFrame, HostPresentationIgnoredReason, JudgeSalvageCause, JudgeSalvageCounts, VisualCoverage, VisualEvalSummary, VisualFitStamp } from './types-public.js';
 import type { LaunchOptions } from 'puppeteer-core';
 import { CANVAS_VIEWPORTS, displayModeForCanvas, type CanvasClass, type CanvasViewport } from '../design-mode.js';
+import { judgeEdges, type EdgeVerdict } from './criteria/edge.js';
+import { EDGE_BLOCKS_EXPRESSION, parseEdgeProbe } from './criteria/edge-probe.js';
 
 // ---------------------------------------------------------------------------
 // Types
@@ -361,7 +371,7 @@ export function canvasOverflowIssue(
   viewport: CanvasViewport,
   contentHeight: number,
   verdict: 'fail' | 'warn',
-): EvaluationIssue {
+): VisualIssue {
   const hidden = contentHeight - viewport.height;
   // ggui#1195 — when the judge captured at a DECLARED box, the refusal names
   // both boxes: the ceiling the content was measured against and the class
@@ -372,6 +382,7 @@ export function canvasOverflowIssue(
     : `${viewport.width}×${viewport.height}`;
   return {
     dimension: 'canvas-overflow',
+    origin: 'instrument',
     severity: verdict === 'fail' ? 'critical' : 'major',
     description:
       `Rendered content is ${contentHeight}px tall on the ${canvas} canvas (${box}) — ` +
@@ -388,9 +399,10 @@ export function canvasOverflowXIssue(
   viewport: CanvasViewport,
   hiddenPx: number,
   verdict: 'fail' | 'warn',
-): EvaluationIssue {
+): VisualIssue {
   return {
     dimension: 'canvas-overflow-x',
+    origin: 'instrument',
     severity: verdict === 'fail' ? 'critical' : 'major',
     description:
       `Content runs ${hiddenPx}px past the ${canvas} card's ${viewport.width}px width — the card's frame clips it, ` +
@@ -402,13 +414,14 @@ export function canvasOverflowXIssue(
 }
 
 /** ggui#1120 — the deterministic blank: the capture is one flat colour, so the component mounted and painted nothing. */
-export function canvasBlankIssue(canvas: CanvasClass, viewport: CanvasViewport): EvaluationIssue {
+export function canvasBlankIssue(canvas: CanvasClass, viewport: CanvasViewport): VisualIssue {
   const classBox = CANVAS_VIEWPORTS[canvas];
   const box = isDeclaredViewport(canvas, viewport)
     ? `declared ${viewport.width}×${viewport.height}; class box ${classBox.width}×${classBox.height}`
     : `${viewport.width}×${viewport.height}`;
   return {
     dimension: 'canvas-blank',
+    origin: 'instrument',
     severity: 'critical',
     description: `Nothing painted on the ${canvas} canvas (${box}): the capture is one flat colour — the component mounted and rendered no pixels.`,
     fix:
@@ -430,6 +443,11 @@ export interface VisualEvaluationResult extends EvaluationResult {
    * `outputTokens` stay the SCORING calls' alone, so a cost read off them never includes the report-only block.
    */
   criteriaTokens?: CriteriaCallTokens;
+  /**
+   * ggui#1127 — salvaged judge answers across the canvases, per leg, as N of M (scoring answers; criteria calls
+   * answered). Present on every canvas run, zeros included, so a reader can tell "none salvaged" from "not counted".
+   */
+  judgeSalvage?: JudgeSalvageCounts;
   /** The design tree the judge painted with (ggui#1042) — present on every per-canvas judgement. */
   design?: JudgeDesignIdentity;
   /** The mode `cssTokens` were composed in, when the caller said (ggui#1076). */
@@ -833,6 +851,11 @@ export interface ScreenshotAttempt {
   readonly contentHeight: number | null;
   /** ggui#1475 — a natural capture's horizontal overflow: how many px the card's content runs past its width; absent on every other capture. */
   readonly overflowX?: number | null;
+  /**
+   * ggui#1663 — the edge rule on this capture's DOM, read just before the screenshot (report-only); `null` when the
+   * probe failed. Absent on a failed capture.
+   */
+  readonly edge?: EdgeVerdict | null;
 }
 
 /** The expression the fit measurement evaluates in the page — the taller of the two scroll heights. */
@@ -890,6 +913,24 @@ async function measureContentHeight(page: ScreenshotPage, expression: string = C
   }
 }
 
+/**
+ * ggui#1663 — read the edge rule off the page the screenshot is about to take. The probe only reads layout (it never
+ * writes to the DOM), so the frame is unchanged; a failed read is reported and returns `null`, never a failed capture.
+ */
+async function measureEdges(page: ScreenshotPage): Promise<EdgeVerdict | null> {
+  try {
+    const probe = parseEdgeProbe(await page.evaluate(EDGE_BLOCKS_EXPRESSION));
+    if (probe === null) {
+      console.warn('[visual-eval] edge probe unavailable: the page returned no readable blocks');
+      return null;
+    }
+    return judgeEdges(probe.blocks, { placeholdersOnly: probe.placeholdersOnly });
+  } catch (e) {
+    console.warn(`[visual-eval] edge probe unavailable: ${e instanceof Error ? e.message : String(e)}`);
+    return null;
+  }
+}
+
 /** ggui#1492 — a natural capture's geometry: the page's pad per side, and the host's floor when it has one. */
 export interface NaturalCaptureOptions {
   readonly padPx: number;
@@ -928,12 +969,14 @@ export async function captureScreenshotDetailed(
         }
         const framed = cardHeightPx === null ? viewport.height - 2 * natural.padPx : floorPx !== undefined ? Math.max(cardHeightPx, floorPx) : cardHeightPx;
         const clip = naturalClip(viewport, framed, natural.padPx);
+        const edge = await measureEdges(page);
         const screenshot = await page.screenshot({ type: 'png', fullPage: false, clip });
-        return { png: Buffer.from(screenshot), contentHeight: cardHeightPx, overflowX };
+        return { png: Buffer.from(screenshot), contentHeight: cardHeightPx, overflowX, edge };
       }
       const contentHeight = await measureContentHeight(page);
+      const edge = await measureEdges(page);
       const screenshot = await page.screenshot({ type: 'png', fullPage: capture === 'full-page' });
-      return { png: Buffer.from(screenshot), contentHeight };
+      return { png: Buffer.from(screenshot), contentHeight, edge };
     } finally {
       await browser.close();
     }
@@ -1119,7 +1162,7 @@ function readInk(png: Buffer | null, chrome: CanvasChrome, canvas: CanvasClass,
   return ink;
 }
 /** The deterministic blank verdict (ggui#1120): an issue when the frame read no ink at all; `null` otherwise, an unreadable capture included. */
-function blankVerdict(canvas: CanvasClass, frame: CanvasFrame): EvaluationIssue | null {
+function blankVerdict(canvas: CanvasClass, frame: CanvasFrame): VisualIssue | null {
   // ggui#1475 — a naturally-captured card that measured no height painted nothing: its capture is only the host's frame,
   // which the ink reading skips by design, so the blank is read from the measurement, never mistaken for unreadable.
   if (frame.chrome === 'ground' && frame.attempt.contentHeight !== null && frame.attempt.contentHeight <= 0) {
@@ -1165,7 +1208,7 @@ async function frameCanvas(
  * canvas's policy gives an overflow, or `null` when the content fits, could
  * not be measured, or the canvas scrolls by design.
  */
-function fitVerdict(canvas: CanvasClass, frame: CanvasFrame): EvaluationIssue | null {
+function fitVerdict(canvas: CanvasClass, frame: CanvasFrame): VisualIssue | null {
   const contentHeight = frame.attempt.contentHeight;
   if (contentHeight === null || contentHeight <= frame.viewport.height || frame.policy.overflow === 'none') return null;
   return canvasOverflowIssue(canvas, frame.viewport, contentHeight, frame.policy.overflow);
@@ -1176,7 +1219,7 @@ function fitVerdict(canvas: CanvasClass, frame: CanvasFrame): EvaluationIssue |
  * is judged by the canvas's own fit policy (the inline card: a critical that fails the canvas), in its own dimension,
  * so the in-loop `[fit]` extension (vertical overflow) is unchanged.
  */
-function overflowXVerdict(canvas: CanvasClass, frame: CanvasFrame): EvaluationIssue | null {
+function overflowXVerdict(canvas: CanvasClass, frame: CanvasFrame): VisualIssue | null {
   const px = frame.attempt.overflowX;
   // `scrollWidth` / `clientWidth` are rounded integers: a fractional layout width reads as 1 px past the card with
   // nothing a visitor could see, so 1 px is rounding and an overflow starts at 2.
@@ -1186,9 +1229,95 @@ function overflowXVerdict(canvas: CanvasClass, frame: CanvasFrame): EvaluationIs
 
 /** One judge call parsed, retried ONCE on a malformed answer (#1017); the FIRST reason is kept verbatim. */
 type JudgedAnswer =
-  | { readonly kind: 'ok'; readonly result: EvaluationResult; readonly inputTokens: number; readonly outputTokens: number }
+  | {
+      readonly kind: 'ok';
+      readonly result: EvaluationResult;
+      readonly inputTokens: number;
+      readonly outputTokens: number;
+      /** ggui#1127 — present when the answer did not parse and its score was salvaged. */
+      readonly salvage?: JudgeSalvage;
+      /** ggui#1687 — the provider's stop reason and the model it says answered; each absent when unreported. */
+      readonly finishReason?: VisionFinishReason;
+      readonly servedModel?: string;
+    }
   | { readonly kind: 'unparsable'; readonly reason: string };
 
+/** ggui#1127 — what a salvaged answer leaves on the record: why, and where the parse broke. Never the answer's text. */
+interface JudgeSalvage {
+  readonly cause: JudgeSalvageCause;
+  /** The provider's normalized stop reason; absent when it reported none. */
+  readonly finishReason?: VisionFinishReason;
+  /** The parser's error, with every quoted span of the answer removed. */
+  readonly parseError: string;
+  /** Where the parse broke, as a character offset into the answer, when the parser said. */
+  readonly offset?: number;
+  /** The answer's length in characters: an offset at the end reads as a cut, one mid-answer as malformed. */
+  readonly chars: number;
+}
+
+/**
+ * ggui#1127 — why an unparsable answer was salvaged. The cause comes from the provider's stop reason, never from the
+ * answer's length: a short answer can still be cut (thinking spends the cap), and a long one can still be malformed.
+ */
+function judgeSalvageOf(error: unknown, text: string, finishReason: VisionFinishReason | undefined): JudgeSalvage {
+  const cause: JudgeSalvageCause =
+    finishReason === undefined ? 'unknown' : finishReason === 'length' ? 'output-cap' : finishReason === 'stop' ? 'malformed' : 'stopped';
+  const message = error instanceof Error ? error.message : String(error);
+  // The JSON is parsed from the first `{` (parseVisualResponse), so the parser's position is shifted by that start.
+  const position = /position (\d+)/.exec(message);
+  const start = text.indexOf('{');
+  const offset = position !== null ? (start > 0 ? start : 0) + Number(position[1]) : undefined;
+  const parseError = message.startsWith('Visual evaluator did not return valid JSON')
+    ? 'no complete JSON object in the answer'
+    : message.replace(/"(?:[^"\\]|\\.)*"/g, '"…"').slice(0, 160);
+  return { cause, ...(finishReason !== undefined ? { finishReason } : {}), parseError, ...(offset !== undefined ? { offset } : {}), chars: text.length };
+}
+
+/** ggui#1127 — a canvas's judge record: the K samples, and which of them (and the criteria call) were salvaged. */
+function judgeRecordOf(
+  k: number,
+  parsed: readonly Extract<JudgedAnswer, { kind: 'ok' }>[],
+  samples: number[],
+  criteria: JudgedAnswer | undefined,
+  requestedModel: string,
+): CanvasJudgeRecord {
+  const salvaged = parsed.flatMap((a) => (a.salvage !== undefined ? [a.salvage.cause] : []));
+  // ggui#1687 — every model the provider said answered, scoring and criteria, deduplicated in call order.
+  const answered = [...parsed, ...(criteria?.kind === 'ok' ? [criteria] : [])];
+  const served = [...new Set(answered.flatMap((a) => (a.servedModel !== undefined ? [a.servedModel] : [])))];
+  const criteriaSalvaged = criteria?.kind === 'ok' ? criteria.salvage?.cause : undefined;
+  return {
+    k,
+    rule: 'median',
+    samples,
+    sigma: populationSigma(samples),
+    notes: parsed.map((a) => a.result.critique ?? ''),
+    ...(salvaged.length > 0 ? { salvaged } : {}),
+    ...(criteriaSalvaged !== undefined ? { criteriaSalvaged } : {}),
+    models: { requested: requestedModel, served },
+  };
+}
+
+/** ggui#1687 — what one call's response says about itself: its stop reason and the model that answered. */
+function callFacts(response: { readonly finishReason?: VisionFinishReason; readonly servedModel?: string }): {
+  finishReason?: VisionFinishReason;
+  servedModel?: string;
+} {
+  return {
+    ...(response.finishReason !== undefined ? { finishReason: response.finishReason } : {}),
+    ...(response.servedModel !== undefined ? { servedModel: response.servedModel } : {}),
+  };
+}
+
+const NO_CRITERIA_ARRAY: CriteriaAnswerCounts = { array: false, received: 0, kept: 0, dropped: { notObject: 0, badId: 0, badVerdict: 0 } };
+
+/** ggui#1687 — the criteria call as it came back, for the block: its answer's counts and its stop reason. */
+function criteriaCallOf(criteria: JudgedAnswer | undefined): { call?: { answer: CriteriaAnswerCounts; finishReason?: VisionFinishReason } } {
+  if (criteria?.kind !== 'ok') return {};
+  const answer = criteria.result.criteriaCounts ?? NO_CRITERIA_ARRAY;
+  return { call: { answer, ...(criteria.finishReason !== undefined ? { finishReason: criteria.finishReason } : {}) } };
+}
+
 /**
  * ggui#1436 — the criteria are REPORT-ONLY, so they are never asked inside a call whose score binds. The K
  * scoring calls go out exactly as they did before the block existed (the same user turn, byte for byte); when a
@@ -1223,7 +1352,15 @@ function criteriaCallTokens(criteria: JudgedAnswer | undefined): CriteriaCallTok
 
 /** The criteria call's answers, as the one read the block resolves; none when it was not asked or did not parse. */
 function criteriaReads(criteria: JudgedAnswer | undefined): CriteriaAnswer[][] {
-  return criteria?.kind === 'ok' ? [criteria.result.criteriaAnswers ?? []] : [];
+  // ggui#1127 — a salvaged answer keeps no criteria: it is no read, and its rows say why (criteriaUnansweredReason).
+  return criteria?.kind === 'ok' && criteria.salvage === undefined ? [criteria.result.criteriaAnswers ?? []] : [];
+}
+
+/** ggui#1127 — the reason a salvaged criteria answer's judge rows give, so none reads as a clean `n/a`. */
+function criteriaUnansweredReason(criteria: JudgedAnswer | undefined): { unansweredReason?: string } {
+  return criteria?.kind === 'ok' && criteria.salvage !== undefined
+    ? { unansweredReason: `not answered: the criteria answer was salvaged (${criteria.salvage.cause})` }
+    : {};
 }
 
 /** How many vision calls this canvas gets (ggui#1072): `judgeK` when the canvas is sampled, else 1. */
@@ -1262,15 +1399,21 @@ async function judgeAndParse(
     const response = await judge(config, model, VISUAL_EVAL_PROMPT, screenshot, originalPrompt, profileBlock, criteriaBlock);
     try {
       const result = parseVisualResponse(response.text, config.passThreshold);
-      return { kind: 'ok', result, inputTokens: response.inputTokens, outputTokens: response.outputTokens };
+      return { kind: 'ok', result, inputTokens: response.inputTokens, outputTokens: response.outputTokens, ...callFacts(response) };
     } catch (e) {
-      // A TRUNCATED answer (cut inside `issues` at the output cap) is deterministic on
-      // the content — retrying the same prompt reproduces it. The four dimensions are
-      // emitted before `issues`, so the score is recoverable from the closed prefix.
+      // An answer that fails to parse but whose four dimensions closed is SALVAGED (ggui#1127): they are emitted
+      // before `issues`, so the score is recoverable from the closed prefix. Whether it was cut at the output cap or
+      // ended malformed is the provider's stop reason to say, not the answer's length; the record and the warn
+      // line carry the cause, the parse error and where it broke, never the answer's text. One token per leg.
       const salvaged = salvageTruncatedVisualAnswer(response.text, config.passThreshold);
       if (salvaged !== null) {
-        console.warn(`[visual-eval] visual_judge_truncated${canvas ? ` canvas=${canvas}` : ''}: answer cut after ${response.text.length} chars — score recovered from the closed prefix, issues list partial`);
-        return { kind: 'ok', result: salvaged, inputTokens: response.inputTokens, outputTokens: response.outputTokens };
+        const salvage = judgeSalvageOf(e, response.text, response.finishReason);
+        const token = criteriaBlock.length > 0 ? 'visual_criteria_salvaged' : 'visual_judge_salvaged';
+        console.warn(
+          `[visual-eval] ${token}${canvas ? ` canvas=${canvas}` : ''} cause=${salvage.cause} finish=${salvage.finishReason ?? 'unreported'} ` +
+            `at=${salvage.offset ?? '?'}/${salvage.chars} (${salvage.parseError}): score recovered from the closed prefix, issues list partial`,
+        );
+        return { kind: 'ok', result: salvaged, inputTokens: response.inputTokens, outputTokens: response.outputTokens, salvage, ...callFacts(response) };
       }
       const reason = `judge answer unparsable: ${e instanceof Error ? e.message : String(e)}`;
       if (attempt === 1) {
@@ -1369,13 +1512,7 @@ export async function runVisualEvaluationDetailed(
       result.outputTokens = parsed.reduce((sum, a) => sum + a.outputTokens, 0);
       const response = { inputTokens: result.inputTokens, outputTokens: result.outputTokens };
       const criteriaTokens = criteriaCallTokens(criteriaAnswer);
-      const judgeRecord: CanvasJudgeRecord = {
-        k,
-        rule: 'median',
-        samples,
-        sigma: populationSigma(samples),
-        notes: parsed.map((a) => a.result.critique ?? ''),
-      };
+      const judgeRecord = judgeRecordOf(k, parsed, samples, criteriaAnswer, model);
       // The fit verdict (ggui#1027): deterministic, in the judge's issue channel.
       const contentHeight = attempt.contentHeight;
       const overflow = contentHeight !== null && contentHeight > viewport.height;
@@ -1404,7 +1541,9 @@ export async function runVisualEvaluationDetailed(
               context: criteriaContext,
               selected: criteriaSelected,
               answers: criteriaReads(criteriaAnswer),
-              measurements: { overflow, contentHeight, viewportHeight: viewport.height, inkRatio },
+              measurements: { overflow, contentHeight, viewportHeight: viewport.height, inkRatio, edge: attempt.edge ?? null },
+              ...criteriaUnansweredReason(criteriaAnswer),
+              ...criteriaCallOf(criteriaAnswer),
             })
           : undefined;
       perCanvasResults.push(result);
@@ -1511,7 +1650,20 @@ function aggregateCanvasResults(
     outputTokens += r.outputTokens ?? 0;
   });
   const criteriaSpent = perCanvas.flatMap((c) => (c.criteriaTokens !== undefined ? [c.criteriaTokens] : []));
+  // ggui#1127 — N of M per leg. A criteria call that parsed or was salvaged reports its spend, so `criteriaTokens`
+  // marks an answered call.
+  const judgeSalvage: JudgeSalvageCounts = {
+    scoring: {
+      salvaged: perCanvas.reduce((sum, c) => sum + (c.judge.salvaged?.length ?? 0), 0),
+      answers: perCanvas.reduce((sum, c) => sum + c.judge.samples.length, 0),
+    },
+    criteria: {
+      salvaged: perCanvas.filter((c) => c.judge.criteriaSalvaged !== undefined).length,
+      answered: perCanvas.filter((c) => c.criteriaTokens !== undefined).length,
+    },
+  };
   return {
+    judgeSalvage,
     passed: perCanvas.every((c) => c.passed),
     finalScore: mean((r) => r.finalScore),
     dimensions,
@@ -1682,6 +1834,8 @@ export async function judgeStoredCapture(
           selected: criteriaSelected,
           answers: criteriaReads(criteriaAnswer),
           measurements: { overflow, contentHeight, viewportHeight: viewport.height, inkRatio },
+          ...criteriaUnansweredReason(criteriaAnswer),
+          ...criteriaCallOf(criteriaAnswer),
         })
       : undefined;
   const criteriaTokens = criteriaCallTokens(criteriaAnswer);
@@ -1693,7 +1847,7 @@ export async function judgeStoredCapture(
       score: median,
       passed,
       issues,
-      judge: { k, rule: 'median', samples, sigma: populationSigma(samples), notes: parsed.map((a) => a.result.critique ?? '') },
+      judge: judgeRecordOf(k, parsed, samples, criteriaAnswer, model),
       contentHeight,
       overflow,
       inkRatio,
@@ -1757,7 +1911,7 @@ export function salvageTruncatedVisualAnswer(text: string, passThreshold: number
     hierarchy,
     aesthetics,
     issues,
-    critique: `[truncated judge answer — score recovered from the closed prefix; ${issues.length} issue(s) kept, the rest and the critique were cut]`,
+    critique: `[salvaged judge answer — it did not parse; score recovered from the closed prefix; ${issues.length} issue(s) kept, the rest and the critique lost]`,
   });
   return parseVisualResponse(rebuilt, passThreshold);
 }
@@ -1793,8 +1947,9 @@ function parseVisualResponse(text: string, passThreshold: number): EvaluationRes
     codeQuality: 0,              // can't assess code from screenshot
   };
 
-  const issues: EvaluationIssue[] = (raw.issues || []).map((i: Record<string, string>) => ({
+  const issues: VisualIssue[] = (raw.issues || []).map((i: Record<string, string>) => ({
     dimension: i.dimension || 'visual',
+    origin: 'judge',
     severity: (i.severity as 'critical' | 'major' | 'minor') || 'minor',
     description: i.description || '',
     fix: i.fix || '',
@@ -1802,7 +1957,7 @@ function parseVisualResponse(text: string, passThreshold: number): EvaluationRes
 
   // ggui#1436 — the criteria answers, tolerant: absent block → no field (an old answer stays
   // valid); an entry without a string id or with a verdict outside the vocabulary is dropped.
-  const criteriaAnswers = parseCriteriaAnswers(raw.criteria);
+  const criteria = parseCriteriaAnswers(raw.criteria);
 
   return {
     passed: finalScore >= passThreshold,
@@ -1810,21 +1965,37 @@ function parseVisualResponse(text: string, passThreshold: number): EvaluationRes
     dimensions,
     issues,
     critique: raw.critique,
-    ...(criteriaAnswers !== undefined ? { criteriaAnswers } : {}),
+    ...(criteria.answers !== undefined ? { criteriaAnswers: criteria.answers } : {}),
+    criteriaCounts: criteria.counts,
   };
 }
 
-function parseCriteriaAnswers(raw: unknown): CriteriaAnswer[] | undefined {
-  if (!Array.isArray(raw)) return undefined;
-  const out: CriteriaAnswer[] = [];
+/**
+ * The criteria answers, tolerant (ggui#1436), and what the tolerance dropped (ggui#1687): an absent or non-array block
+ * reads no row, and each dropped entry is counted by why, so an empty or cut call is visible rather than a row of
+ * clean `n/a`s.
+ */
+function parseCriteriaAnswers(raw: unknown): { answers?: CriteriaAnswer[]; counts: CriteriaAnswerCounts } {
+  if (!Array.isArray(raw)) return { counts: NO_CRITERIA_ARRAY };
+  const answers: CriteriaAnswer[] = [];
+  const dropped = { notObject: 0, badId: 0, badVerdict: 0 };
   for (const entry of raw) {
-    if (typeof entry !== 'object' || entry === null) continue;
+    if (typeof entry !== 'object' || entry === null) {
+      dropped.notObject += 1;
+      continue;
+    }
     const o = entry as { id?: unknown; verdict?: unknown; evidence?: unknown };
-    if (typeof o.id !== 'string') continue;
-    if (o.verdict !== 'pass' && o.verdict !== 'fail' && o.verdict !== 'n/a') continue;
-    out.push({ id: o.id, verdict: o.verdict, evidence: typeof o.evidence === 'string' ? o.evidence : '' });
+    if (typeof o.id !== 'string') {
+      dropped.badId += 1;
+      continue;
+    }
+    if (o.verdict !== 'pass' && o.verdict !== 'fail' && o.verdict !== 'n/a') {
+      dropped.badVerdict += 1;
+      continue;
+    }
+    answers.push({ id: o.id, verdict: o.verdict, evidence: typeof o.evidence === 'string' ? o.evidence : '' });
   }
-  return out;
+  return { answers, counts: { array: true, received: raw.length, kept: answers.length, dropped } };
 }
 
 // ---------------------------------------------------------------------------
@@ -1842,6 +2013,16 @@ function getDefaultVisualModel(provider: 'claude' | 'google'): string {
 // Tier 2 adapter — returns EvalIssue[]
 // ---------------------------------------------------------------------------
 
+/**
+ * ggui#1522 — what a visual leg's judge calls spent: the scoring calls, and the report-only criteria calls apart
+ * (ggui#1436). Priced at the VISUAL agent's model, never folded into a text evaluator's or a coding turn's tokens.
+ */
+export interface VisualLegTokens {
+  readonly inputTokens: number;
+  readonly outputTokens: number;
+  readonly criteria?: CriteriaCallTokens;
+}
+
 /** What the harness's eval round consumes from the visual leg. */
 export interface VisualEvalOutcome {
   /** Tier-2 issues (empty when no browser is available). */
@@ -1858,6 +2039,11 @@ export interface VisualEvalOutcome {
    * summary used to be indistinguishable from a clean single-shot run.
    */
   coverage: VisualCoverage;
+  /**
+   * ggui#1522 — the leg's own spend, when its judge ran and reported tokens. The round records it in the cost
+   * tracker at the visual agent's model and carries it apart; absent on a skipped leg.
+   */
+  tokens?: VisualLegTokens;
 }
 
 /**
@@ -1881,7 +2067,16 @@ export async function runVisualEval(
   const issues: EvalIssue[] = (result.issues || []).map(toEvalIssue);
   const summary = summarizeVisualResult(result);
   const coverage: VisualCoverage = { status: 'ran' };
-  return summary === undefined ? { issues, coverage } : { issues, summary, coverage };
+  // ggui#1522 — the judge's spend rides the outcome; until now it was dropped here, before the harness saw it.
+  const tokens: VisualLegTokens | undefined =
+    result.inputTokens !== undefined && result.outputTokens !== undefined
+      ? {
+          inputTokens: result.inputTokens,
+          outputTokens: result.outputTokens,
+          ...(result.criteriaTokens !== undefined ? { criteria: result.criteriaTokens } : {}),
+        }
+      : undefined;
+  return { issues, ...(summary !== undefined ? { summary } : {}), coverage, ...(tokens !== undefined ? { tokens } : {}) };
 }
 
 /** A judge-shaped issue as the harness's tier-2 issue: critical ⇒ a blocking fail, anything else ⇒ a warn. */
@@ -1894,6 +2089,7 @@ function toEvalIssue(issue: EvaluationIssue): EvalIssue {
     severity: issue.severity === 'critical' ? 'critical' : 'major',
     description: issue.description,
     fix: issue.fix || '',
+    ...(issue.origin !== undefined ? { origin: issue.origin } : {}),
   };
 }
 

package/src/harness/check/runtime-render/adapter.ts

@@ -198,6 +198,8 @@ export function createRuntimeRenderCheck(
         ...queuedField(queuedMs),
         renderMs: result.stats.renderMs,
         ...load,
+        // ggui#1398: report-only — carried to the probe's meta for the bench, never an issue.
+        ...(result.stats.pendingAffordance !== undefined ? { pendingAffordance: result.stats.pendingAffordance } : {}),
       };
     },
   };
@@ -376,6 +378,22 @@ export function toEvalIssue(issue: RenderCheckIssue): EvalIssue | null {
         : `input priming failed: ${diag.inputPriming.error}`
     );
   }
+  if (diag?.walk) {
+    // ggui#1652: how far the walk over the card's screens got, so a
+    // multi-step card reads differently from a control that never rendered.
+    const w = diag.walk;
+    const stopped = {
+      explored: "every reachable control pressed",
+      "press-cap": "stopped at the press cap",
+      deadline: "stopped at the time budget",
+      "no-mount": "the card could not be mounted for the walk",
+    }[w.stoppedBy];
+    const named = w.namedControlSeen
+      ? "a control naming the action rendered, but pressing it did not dispatch the action"
+      : "no screen rendered a control naming the action";
+    const last = w.lastPressed.length ? `; last pressed: ${w.lastPressed.join(", ")}` : "";
+    diagParts.push(`walk: ${w.presses} press(es) across ${w.screens} screen(s), ${stopped}; ${named}${last}`);
+  }
   const diagSuffix = diagParts.length ? ` [observed: ${diagParts.join("; ")}]` : "";
 
   switch (issue.check) {

package/src/harness/check/runtime-render/probe-pending.ts

@@ -0,0 +1,111 @@
+/**
+ * ggui#1398 leg 3 — the render check's stand-in for the runtime's pending
+ * state, and the rule for "the control visibly changed".
+ *
+ * In a served card, the runtime marks an action pending when the card's
+ * dispatch of it commits, and clears it when the session's next frame lands;
+ * `useActionPending` reads that state through wire's `ActionPendingContext`.
+ * The probe has no transport and no next frame, so it marks an action pending
+ * right after its own synthetic click really fired the action, looks at the
+ * clicked control, then clears it: one dispatch, one answer.
+ */
+import type { ActionPendingSource } from "@ggui-ai/wire";
+
+/** An {@link ActionPendingSource} the probe drives by hand. */
+export interface ProbePendingSource extends ActionPendingSource {
+  /** Mark `actionName` pending and notify subscribers. */
+  mark(actionName: string): void;
+  /** Clear every pending action (the "answer landed"), notifying only if something was pending. */
+  clear(): void;
+}
+
+export function createProbePendingSource(): ProbePendingSource {
+  const pending = new Set<string>();
+  const listeners = new Set<() => void>();
+  const notify = (): void => {
+    for (const listener of [...listeners]) listener();
+  };
+  return {
+    isPending: (actionName) => pending.has(actionName),
+    subscribe: (listener) => {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+    mark: (actionName) => {
+      pending.add(actionName);
+      notify();
+    },
+    clear: () => {
+      if (pending.size === 0) return;
+      pending.clear();
+      notify();
+    },
+  };
+}
+
+/** What a control shows, for a before/after comparison around a dispatch. */
+export interface ControlLook {
+  /** Still in the document; `false` when the card replaced the control. */
+  readonly connected: boolean;
+  /** `disabled`, or `aria-disabled="true"`. */
+  readonly disabled: boolean;
+  /** `aria-busy="true"`. */
+  readonly ariaBusy: boolean;
+  /** The control's text. */
+  readonly text: string;
+}
+
+/**
+ * The DOM surface {@link lookOf} reads: the probe's `MinimalElement` plus
+ * the optional `isConnected` a live DOM node carries, and an input's live
+ * `value` (an `<input type="submit">` shows its label through it).
+ */
+export interface LookableElement {
+  readonly tagName?: string;
+  readonly textContent: string | null;
+  getAttribute(name: string): string | null;
+  readonly isConnected?: boolean;
+  readonly value?: unknown;
+}
+
+export function lookOf(el: LookableElement): ControlLook {
+  return {
+    connected: el.isConnected !== false,
+    // React renders `disabled={true}` as `disabled=""`, so presence is the test.
+    disabled: el.getAttribute("disabled") !== null || el.getAttribute("aria-disabled") === "true",
+    ariaBusy: el.getAttribute("aria-busy") === "true",
+    text:
+      el.tagName?.toLowerCase() === "input"
+        ? String(typeof el.value === "string" ? el.value : (el.getAttribute("value") ?? ""))
+        : (el.textContent ?? ""),
+  };
+}
+
+/**
+ * Whether `work` settles within `ms`. It never cancels `work`; it only stops
+ * waiting for it, so a phase can give up on a card that stalls.
+ */
+export async function settlesWithin(ms: number, work: Promise<unknown>): Promise<boolean> {
+  let timer: ReturnType<typeof setTimeout> | undefined;
+  const expired = new Promise<false>((resolve) => {
+    timer = setTimeout(() => resolve(false), Math.max(0, ms));
+  });
+  try {
+    return await Promise.race([work.then(() => true), expired]);
+  } finally {
+    if (timer !== undefined) clearTimeout(timer);
+  }
+}
+
+/**
+ * Whether the control visibly changed between two looks: it became disabled
+ * or busy, its text changed (whitespace aside), or the card replaced it.
+ */
+export function lookChanged(before: ControlLook, after: ControlLook): boolean {
+  if (before.connected && !after.connected) return true;
+  if (!before.disabled && after.disabled) return true;
+  if (!before.ariaBusy && after.ariaBusy) return true;
+  return before.text.trim() !== after.text.trim();
+}