@loadmill/droid-cua 2.16.0 → 2.18.0

package/build/src/core/report/render-html-report.js

@@ -0,0 +1,317 @@
+// Renders a RunReportModel (from parse-run-report.js) into a single, self-contained
+// HTML document that reproduces the Desktop App's run-details view. Pure: no I/O and
+// no external references — screenshots must already be inlined as data URLs in
+// `event.payload.screenshotDataUrl`. Use generate-html-report.js to inline them.
+import { assertionData, formatDuration, hasNearbyAssertionCard, isAssistantAssertionSummary, isDuplicateAssertionLine, isHiddenExecutionLogEvent, runSummaryData, } from "./run-log-model.js";
+// ---------- text / value formatting (mirrors the Desktop App) ----------
+function escapeHtml(value) {
+    return String(value ?? "")
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;")
+        .replace(/'/g, "&#39;");
+}
+function formatRunTimestamp(iso) {
+    if (!iso)
+        return "—";
+    const parsed = Date.parse(iso);
+    if (!Number.isFinite(parsed))
+        return "—";
+    return new Date(parsed).toLocaleString();
+}
+function formatRunDuration(durationSeconds) {
+    if (durationSeconds === null || durationSeconds === undefined || !Number.isFinite(durationSeconds)) {
+        return "—";
+    }
+    if (durationSeconds < 60)
+        return `${durationSeconds.toFixed(1)}s`;
+    const wholeSeconds = Math.floor(durationSeconds);
+    const minutes = Math.floor(wholeSeconds / 60);
+    const seconds = wholeSeconds % 60;
+    if (minutes < 60)
+        return `${minutes}m ${seconds.toString().padStart(2, "0")}s`;
+    const hours = Math.floor(minutes / 60);
+    const remainingMinutes = minutes % 60;
+    return `${hours}h ${remainingMinutes.toString().padStart(2, "0")}m`;
+}
+function runStatusLabel(status) {
+    switch (status) {
+        case "pass":
+            return "Pass";
+        case "fail":
+            return "Fail";
+        case "error":
+            return "Error";
+        case "stopped":
+            return "Stopped";
+        case "skipped":
+            return "Skipped";
+        case "running":
+            return "In progress";
+        case "pending":
+            return "Pending";
+        default:
+            return "Warning";
+    }
+}
+// ---------- event filtering (visible-events composition for the report) ----------
+// Reduces raw events to the ones the Desktop App actually shows: drops empty-text,
+// hidden-debug media, interactive input prompts, and assistant "ASSERTION RESULT"
+// summaries that sit next to an assertion card, then collapses consecutive duplicate
+// assertion lines (the same assertion is logged several times).
+function buildVisibleEvents(events) {
+    const base = (events ?? []).filter((event) => typeof event.text === "string" && event.text.trim().length > 0);
+    const filtered = base.filter((event, idx, items) => {
+        if (isHiddenExecutionLogEvent(event))
+            return false;
+        if (isAssistantAssertionSummary(event) && hasNearbyAssertionCard(items, idx))
+            return false;
+        if (event.eventType === "input_request")
+            return false;
+        return true;
+    });
+    const visible = [];
+    for (const event of filtered) {
+        if (isDuplicateAssertionLine(event, visible[visible.length - 1]))
+            continue;
+        visible.push(event);
+    }
+    return visible;
+}
+// Emits a clickable thumbnail and registers the screenshot in `shots` so a matching
+// full-size lightbox overlay can be rendered. The href links to the CSS `:target`
+// overlay, so click-to-enlarge works even with JavaScript disabled.
+function screenshotImg(event, shots) {
+    const url = event.payload?.screenshotDataUrl;
+    if (typeof url !== "string" || !url.startsWith("data:"))
+        return "";
+    const index = shots.length + 1;
+    shots.push({ index, url });
+    return `<a class="dc-shot-link" href="#dc-shot-${index}" aria-label="Open screenshot ${index}"><img class="dc-shot" src="${escapeHtml(url)}" alt="Screenshot ${index}" /></a>`;
+}
+// ---------- per-event timeline rendering (mirrors ExecutionLogItem.tsx) ----------
+function renderEvent(event, shots) {
+    if (isHiddenExecutionLogEvent(event))
+        return "";
+    const summary = runSummaryData(event);
+    if (summary) {
+        const cls = summary.status === "passed" ? "pass" : summary.status === "failed" ? "fail" : "amber";
+        const label = summary.status === "passed"
+            ? "Test Passed"
+            : summary.status === "stopped"
+                ? "Test Stopped"
+                : summary.status === "errored"
+                    ? "Error"
+                    : "Test Failed";
+        const badge = summary.status === "passed" ? "PASS" : summary.status === "stopped" ? "STOPPED" : summary.status === "errored" ? "ERROR" : "FAIL";
+        return `<div class="dc-card dc-${cls}">
+  <div class="dc-card-head"><span class="dc-card-title">${escapeHtml(label)}</span><span class="dc-pill dc-pill-${cls}">${escapeHtml(badge)}</span></div>
+  <div class="dc-card-body">
+    <div>Duration: ${escapeHtml(formatDuration(summary.durationMs))}</div>
+    <div>Steps: ${summary.instructionsCompleted ?? 0}/${summary.instructionsTotal ?? 0}</div>
+    <div>Assertions: ${summary.assertionsPassed ?? 0}/${(summary.assertionsPassed ?? 0) + (summary.assertionsFailed ?? 0)}</div>
+    <div>Retries: ${summary.retries ?? 0}</div>
+  </div>${summary.error ? `\n  <div class="dc-card-error">${escapeHtml(summary.error)}</div>` : ""}
+</div>`;
+    }
+    const isInstruction = event.eventType === "instruction_started" || event.kind === "user";
+    if (isInstruction) {
+        return `<div class="dc-row dc-row-right"><div class="dc-bubble">${escapeHtml(event.text)}</div></div>`;
+    }
+    const isAssistant = event.eventType === "assistant_message" || event.kind === "assistant";
+    if (isAssistant) {
+        return `<div class="dc-assistant">${escapeHtml(event.text)}</div>`;
+    }
+    const assertion = assertionData(event);
+    if (assertion) {
+        const cls = assertion.passed ? "pass" : "fail";
+        const img = screenshotImg(event, shots);
+        return `<div class="dc-card dc-${cls}">
+  <div class="dc-card-head"><span class="dc-card-title">${assertion.passed ? "Assertion Passed" : "Assertion Failed"}${img}</span><span class="dc-pill dc-pill-${cls}">${assertion.passed ? "PASS" : "FAIL"}</span></div>
+  <div class="dc-assertion">${escapeHtml(assertion.assertion)}</div>${assertion.details ? `\n  <div class="dc-assertion-details">${escapeHtml(assertion.details)}</div>` : ""}
+</div>`;
+    }
+    if (event.eventType === "retry") {
+        return `<div class="dc-line dc-retry">${escapeHtml(event.text)}</div>`;
+    }
+    if (event.kind === "action") {
+        return `<div class="dc-line">${escapeHtml(event.text)}${screenshotImg(event, shots)}</div>`;
+    }
+    if (event.eventType === "screenshot_captured") {
+        return `<div class="dc-line">${escapeHtml(event.text)}${screenshotImg(event, shots)}</div>`;
+    }
+    return `<div class="dc-line dc-${escapeHtml(event.kind)}">${escapeHtml(event.text)}</div>`;
+}
+function renderTimeline(events, shots) {
+    return buildVisibleEvents(events)
+        .map((event) => renderEvent(event, shots))
+        .filter(Boolean)
+        .join("\n");
+}
+// Full-size overlays, one per screenshot. Shown via the CSS `:target` rule, so
+// click-to-enlarge and prev/next/close work with JavaScript disabled.
+function renderLightboxes(shots) {
+    if (shots.length === 0)
+        return "";
+    const count = shots.length;
+    return shots
+        .map((shot) => {
+        const prev = shot.index > 1
+            ? `<a class="dc-lightbox-nav dc-lightbox-prev" href="#dc-shot-${shot.index - 1}" aria-label="Previous screenshot">&#8249;</a>`
+            : "";
+        const next = shot.index < count
+            ? `<a class="dc-lightbox-nav dc-lightbox-next" href="#dc-shot-${shot.index + 1}" aria-label="Next screenshot">&#8250;</a>`
+            : "";
+        return `<div class="dc-lightbox" id="dc-shot-${shot.index}">
+  <a class="dc-lightbox-backdrop" href="#dc-top" aria-label="Close"></a>
+  ${prev}
+  <img class="dc-lightbox-img" src="${escapeHtml(shot.url)}" alt="Screenshot ${shot.index}" />
+  ${next}
+  <a class="dc-lightbox-close" href="#dc-top" aria-label="Close">&times;</a>
+</div>`;
+    })
+        .join("\n");
+}
+// Progressive enhancement: map arrow keys / Escape to the same hash navigation the
+// CSS overlays already use. Inline only — keeps the report a single self-contained file.
+function renderLightboxScript(count) {
+    if (count === 0)
+        return "";
+    return `<script>
+(function () {
+  var count = ${count};
+  function current() {
+    var match = /^#dc-shot-(\\d+)$/.exec(location.hash);
+    return match ? parseInt(match[1], 10) : 0;
+  }
+  document.addEventListener('keydown', function (event) {
+    var n = current();
+    if (!n) return;
+    if (event.key === 'Escape') { event.preventDefault(); location.hash = 'dc-top'; }
+    else if ((event.key === 'ArrowRight' || event.key === 'ArrowDown') && n < count) { event.preventDefault(); location.hash = 'dc-shot-' + (n + 1); }
+    else if ((event.key === 'ArrowLeft' || event.key === 'ArrowUp') && n > 1) { event.preventDefault(); location.hash = 'dc-shot-' + (n - 1); }
+  });
+})();
+</script>`;
+}
+// ---------- summary card ----------
+function summaryRow(label, value) {
+    return `<div class="dc-sum-cell"><div class="dc-sum-label">${escapeHtml(label)}</div><div class="dc-sum-value">${value}</div></div>`;
+}
+function renderSummaryCard(model) {
+    const outcome = `<span class="dc-pill dc-pill-${escapeHtml(model.status)}">${escapeHtml(runStatusLabel(model.status))}</span>`;
+    return `<div class="dc-summary">
+  ${summaryRow("Suite", escapeHtml(model.suiteName ?? "—"))}
+  ${summaryRow("Launched On", escapeHtml(formatRunTimestamp(model.timestamp)))}
+  ${summaryRow("Duration", escapeHtml(formatRunDuration(model.durationSeconds)))}
+  ${summaryRow("Outcome", outcome)}
+  ${summaryRow("# Test Cases", String(model.testCases))}
+  ${summaryRow("% Success Rate", `${Math.round(model.successRate)}%`)}
+</div>`;
+}
+function renderTestsList(childTests) {
+    const rows = childTests
+        .map((child) => `<div class="dc-test-row"><span class="dc-test-name">${escapeHtml(child.testName.replace(/\.dcua$/i, ""))}</span><span class="dc-test-dur">${escapeHtml(formatRunDuration(child.durationSeconds))}</span><span class="dc-pill dc-pill-${escapeHtml(child.status)}">${escapeHtml(runStatusLabel(child.status))}</span></div>`)
+        .join("\n");
+    return `<div class="dc-tests"><div class="dc-tests-title">Tests</div>${rows}</div>`;
+}
+// ---------- styles ----------
+const STYLES = `
+:root { color-scheme: light; }
+* { box-sizing: border-box; }
+body { margin: 0; background: #f1f5f9; color: #0f172a; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.5; }
+.dc-wrap { max-width: 880px; margin: 0 auto; padding: 24px 20px 64px; }
+.dc-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
+.dc-title { font-size: 18px; font-weight: 700; }
+.dc-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; background: #fff; border: 1px solid #cbd5e1; border-radius: 12px; padding: 16px; margin-bottom: 16px; }
+.dc-sum-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #1e293b; }
+.dc-sum-value { font-size: 13px; font-weight: 500; color: #334155; margin-top: 2px; }
+.dc-tests { background: #fff; border: 1px solid #cbd5e1; border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; }
+.dc-tests-title { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #1e293b; margin-bottom: 8px; }
+.dc-test-row { display: grid; grid-template-columns: 1fr 90px 90px; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid #e2e8f0; border-radius: 8px; margin-bottom: 6px; }
+.dc-test-name { font-weight: 500; color: #334155; }
+.dc-test-dur { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: #64748b; font-size: 12px; }
+.dc-timeline { background: #fff; border: 1px solid #cbd5e1; border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
+.dc-child-block { margin-top: 12px; }
+.dc-child-head { font-size: 13px; font-weight: 600; color: #334155; margin: 8px 0; }
+.dc-row { display: flex; }
+.dc-row-right { justify-content: flex-end; }
+.dc-bubble { display: inline-block; max-width: 70%; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 16px; border-bottom-right-radius: 6px; padding: 8px 14px; color: #0f172a; }
+.dc-assistant { max-width: 82%; color: #334155; }
+.dc-line { display: flex; align-items: center; gap: 8px; color: #475569; font-size: 13px; }
+.dc-retry { color: #b45309; }
+.dc-error { color: #b91c1c; }
+.dc-warning { color: #b45309; }
+.dc-shot-link { display: inline-flex; margin-left: 8px; vertical-align: middle; }
+.dc-shot { height: 34px; width: auto; border: 1px solid #e2e8f0; border-radius: 4px; cursor: zoom-in; transition: border-color .12s; }
+.dc-shot-link:hover .dc-shot, .dc-shot-link:focus-visible .dc-shot { border-color: #94a3b8; }
+.dc-lightbox { display: none; position: fixed; inset: 0; z-index: 1000; align-items: center; justify-content: center; padding: 32px; background: rgba(15, 23, 42, .82); }
+.dc-lightbox:target { display: flex; }
+.dc-lightbox-backdrop { position: absolute; inset: 0; z-index: 1; cursor: zoom-out; }
+.dc-lightbox-img { position: relative; z-index: 2; max-width: 92vw; max-height: 88vh; object-fit: contain; border-radius: 6px; box-shadow: 0 10px 40px rgba(0, 0, 0, .5); }
+.dc-lightbox-close { position: absolute; top: 14px; right: 20px; z-index: 3; color: #fff; font-size: 30px; line-height: 1; text-decoration: none; opacity: .85; }
+.dc-lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; color: #fff; font-size: 44px; line-height: 1; text-decoration: none; padding: 8px 16px; opacity: .85; user-select: none; }
+.dc-lightbox-nav:hover, .dc-lightbox-close:hover { opacity: 1; }
+.dc-lightbox-prev { left: 10px; }
+.dc-lightbox-next { right: 10px; }
+.dc-card { border: 1px solid; border-radius: 12px; padding: 12px 14px; }
+.dc-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
+.dc-card-title { font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; }
+.dc-card-body > div { margin: 1px 0; }
+.dc-card-error, .dc-assertion-details { margin-top: 6px; font-size: 13px; }
+.dc-assertion { font-size: 14px; }
+.dc-pass { border-color: #a7f3d0; background: #ecfdf5; color: #064e3b; }
+.dc-fail { border-color: #fecdd3; background: #fff1f2; color: #881337; }
+.dc-amber, .dc-error.dc-card { border-color: #fde68a; background: #fffbeb; color: #78350f; }
+.dc-pill { display: inline-flex; width: fit-content; border: 1px solid; border-radius: 999px; padding: 1px 8px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
+.dc-pill-pass, .dc-pill-passed { border-color: #6ee7b7; background: #d1fae5; color: #047857; }
+.dc-pill-fail, .dc-pill-failed { border-color: #fda4af; background: #ffe4e6; color: #be123c; }
+.dc-pill-error, .dc-pill-errored, .dc-pill-amber { border-color: #fcd34d; background: #fef3c7; color: #b45309; }
+.dc-pill-stopped { border-color: #fdba74; background: #ffedd5; color: #c2410c; }
+.dc-pill-skipped { border-color: #cbd5e1; background: #f1f5f9; color: #334155; }
+`.trim();
+// ---------- entry point ----------
+export function renderHtmlReport(model, { title } = {}) {
+    const docTitle = title ?? `Run Report: ${model.testName ?? model.suiteName ?? "Test run"}`;
+    const heading = model.testName ?? model.suiteName ?? "Test run";
+    // Screenshots are collected across the whole document (top-level + child timelines)
+    // so the lightbox shares one continuous prev/next sequence.
+    const shots = [];
+    let body;
+    if (model.childTests && model.childTests.length > 0) {
+        const children = model.childTests
+            .map((child) => `<div class="dc-child-block"><div class="dc-child-head">${escapeHtml(child.testName.replace(/\.dcua$/i, ""))}</div>${renderTimeline(child.events, shots)}</div>`)
+            .join("\n");
+        body = `${renderSummaryCard(model)}
+${renderTestsList(model.childTests)}
+<div class="dc-timeline">
+${children}
+</div>`;
+    }
+    else {
+        body = `${renderSummaryCard(model)}
+<div class="dc-timeline">
+${renderTimeline(model.events, shots)}
+</div>`;
+    }
+    const lightboxes = renderLightboxes(shots);
+    const script = renderLightboxScript(shots.length);
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<title>${escapeHtml(docTitle)}</title>
+<style>
+${STYLES}
+</style>
+</head>
+<body>
+<div class="dc-wrap" id="dc-top">
+<div class="dc-header"><div class="dc-title">Run Details: ${escapeHtml(heading)}</div><span class="dc-pill dc-pill-${escapeHtml(model.status)}">${escapeHtml(runStatusLabel(model.status))}</span></div>
+${body}
+</div>${lightboxes ? `\n${lightboxes}` : ""}${script ? `\n${script}` : ""}
+</body>
+</html>`;
+}

package/build/src/core/report/report-file-name.js

@@ -0,0 +1,31 @@
+// Shared, human-readable filename for downloaded HTML run reports. Used by both the
+// CLI (`--report`) and the Desktop App ("Share" → "Download HTML report") so the two
+// produce identical, conventionally-named files: <test-name>--<date>--<time>.html
+// e.g. `a--2026-06-03--16-09-20.html`.
+function sanitizeStem(value) {
+    return (String(value || "report")
+        .replace(/\.dcua$/i, "")
+        .trim()
+        .replace(/[^a-zA-Z0-9._-]+/g, "-")
+        .replace(/-+/g, "-")
+        .replace(/^[-_.]+|[-_.]+$/g, "") || "report");
+}
+// Returns { datePart: "YYYY-MM-DD", timePart: "HH-MM-SS" } in local time. Falls back to
+// "now" when the timestamp is missing or unparseable.
+function formatStamp(iso) {
+    const parsed = iso ? new Date(iso) : null;
+    const valid = parsed && Number.isFinite(parsed.getTime()) ? parsed : new Date();
+    const pad = (n) => String(n).padStart(2, "0");
+    return {
+        datePart: `${valid.getFullYear()}-${pad(valid.getMonth() + 1)}-${pad(valid.getDate())}`,
+        timePart: `${pad(valid.getHours())}-${pad(valid.getMinutes())}-${pad(valid.getSeconds())}`,
+    };
+}
+// Builds the report filename from a run's name + timestamp. `testName` wins; `suiteName`
+// is the fallback (mirrors the report heading), then a generic "report". The name uses
+// single dashes; `--` separates name↔date↔time so the segments stay visually distinct.
+export function buildReportFileName({ testName, suiteName, timestamp } = {}) {
+    const name = sanitizeStem(testName ?? suiteName);
+    const { datePart, timePart } = formatStamp(timestamp);
+    return `${name}--${datePart}--${timePart}.html`;
+}

package/build/src/core/report/run-log-model.js

@@ -0,0 +1,144 @@
+// Pure leaf classifier predicates for execution log events.
+// Shared by the Desktop App (log-utils.ts re-exports these) and the HTML report renderer.
+// No I/O, no React, no side effects.
+import { classifyCaptureSource } from "../capture-sources.js";
+export function captureSourceOf(line) {
+    const captureSource = line.payload?.captureSource;
+    return typeof captureSource === "string" && captureSource.trim().length > 0 ? captureSource : null;
+}
+export function mediaKindOf(line) {
+    const captureSource = captureSourceOf(line);
+    const classification = classifyCaptureSource(captureSource);
+    const mediaKind = classification.mediaKind;
+    if (mediaKind === "hidden-debug" || mediaKind === "click-annotation" || mediaKind === "screenshot") {
+        return mediaKind;
+    }
+    // Backcompat bridge for older logs and reports that predate captureSource normalization.
+    const toolName = line.payload?.toolName;
+    if (toolName === "preview_click") {
+        return "hidden-debug";
+    }
+    const hasScreenshot = typeof line.payload?.screenshotDataUrl === "string" ||
+        typeof line.payload?.screenshotPath === "string";
+    if (!hasScreenshot) {
+        return "none";
+    }
+    if (line.eventType === "screenshot_captured" || line.eventType === "assertion_result") {
+        return "screenshot";
+    }
+    if (line.kind === "action") {
+        return "click-annotation";
+    }
+    return "none";
+}
+export function isHiddenExecutionLogEvent(line) {
+    return mediaKindOf(line) === "hidden-debug";
+}
+export function isGalleryMediaEvent(line) {
+    const mediaKind = mediaKindOf(line);
+    return mediaKind === "click-annotation" || mediaKind === "screenshot";
+}
+export function cleanAssertionDetails(rawDetails, assertion, passed) {
+    if (!rawDetails)
+        return null;
+    let details = rawDetails
+        .replace(/\[(Assertion|Assistant)\]\s*/gi, "")
+        .replace(/\r/g, "")
+        .trim();
+    const lines = details
+        .split("\n")
+        .map((line) => line.trim())
+        .filter((line) => line.length > 0 && !/assertion result:/i.test(line));
+    details = lines.join(" ").replace(/\s{2,}/g, " ").trim();
+    if (!passed && /assertion result:\s*pass/i.test(rawDetails)) {
+        details = details.replace(/assertion result:\s*pass.*$/i, "").trim();
+    }
+    if (passed && /assertion result:\s*fail/i.test(rawDetails)) {
+        details = details.replace(/assertion result:\s*fail.*$/i, "").trim();
+    }
+    if (details.toLowerCase() === assertion.trim().toLowerCase())
+        return null;
+    return details.length > 0 ? details : null;
+}
+export function assertionData(event) {
+    if (event.eventType !== "assertion_result")
+        return null;
+    const payload = event.payload ?? {};
+    const assertion = typeof payload.assertion === "string" && payload.assertion.trim().length > 0
+        ? payload.assertion
+        : event.text;
+    const passed = Boolean(payload.passed);
+    const rawDetails = typeof payload.details === "string" && payload.details.trim().length > 0
+        ? payload.details
+        : null;
+    return { assertion, details: cleanAssertionDetails(rawDetails, assertion, passed), passed };
+}
+export function runSummaryData(event) {
+    if (event.eventType !== "run_finished")
+        return null;
+    const payload = event.payload ?? {};
+    const success = Boolean(payload.success);
+    const error = typeof payload.error === "string" && payload.error.trim().length > 0 ? payload.error : null;
+    const stopped = !success && Boolean(error && error.toLowerCase().includes("stopped by user"));
+    const isAssertionFailure = Boolean(error && error.startsWith("Assertion failed:"));
+    return {
+        status: success ? "passed" : stopped ? "stopped" : isAssertionFailure ? "failed" : "errored",
+        durationMs: typeof payload.durationMs === "number" ? payload.durationMs : null,
+        instructionsTotal: typeof payload.instructionsTotal === "number" ? payload.instructionsTotal : null,
+        instructionsCompleted: typeof payload.instructionsCompleted === "number" ? payload.instructionsCompleted : null,
+        assertionsPassed: typeof payload.assertionsPassed === "number" ? payload.assertionsPassed : null,
+        assertionsFailed: typeof payload.assertionsFailed === "number" ? payload.assertionsFailed : null,
+        retries: typeof payload.retries === "number" ? payload.retries : null,
+        error,
+    };
+}
+export function formatDuration(ms) {
+    if (ms === null || ms === undefined)
+        return "n/a";
+    const totalSeconds = ms / 1000;
+    if (totalSeconds < 60)
+        return `${totalSeconds.toFixed(1)}s`;
+    const wholeSeconds = Math.floor(totalSeconds);
+    const minutes = Math.floor(wholeSeconds / 60);
+    const seconds = wholeSeconds % 60;
+    if (minutes < 60)
+        return `${minutes}m ${seconds.toString().padStart(2, "0")}s`;
+    const hours = Math.floor(minutes / 60);
+    const remainingMinutes = minutes % 60;
+    return `${hours}h ${remainingMinutes.toString().padStart(2, "0")}m`;
+}
+export function isAssistantAssertionSummary(event) {
+    if (!(event.eventType === "assistant_message" || event.kind === "assistant"))
+        return false;
+    const text = event.text.toLowerCase();
+    return text.includes("assertion result: pass") || text.includes("assertion result: fail");
+}
+export function hasNearbyAssertionCard(events, index) {
+    const current = events[index];
+    const windowStart = Math.max(0, index - 3);
+    const windowEnd = Math.min(events.length - 1, index + 3);
+    for (let i = windowStart; i <= windowEnd; i++) {
+        if (i === index)
+            continue;
+        const candidate = events[i];
+        if (candidate.eventType !== "assertion_result")
+            continue;
+        if (current.stepId && candidate.stepId) {
+            if (current.stepId === candidate.stepId)
+                return true;
+            continue;
+        }
+        return true;
+    }
+    return false;
+}
+export function isDuplicateAssertionLine(event, previous) {
+    if (event.eventType !== "assertion_result" || !previous || previous.eventType !== "assertion_result") {
+        return false;
+    }
+    const current = assertionData(event);
+    const prev = assertionData(previous);
+    if (!current || !prev)
+        return false;
+    return current.assertion === prev.assertion && current.passed === prev.passed;
+}

package/build/src/core/report/run-report-model.js

@@ -0,0 +1,143 @@
+// The single, shared model-assembler for run reports. Both producers — the XML/Desktop
+// path (parse-run-report.js) and the CLI path (headless-report.js) — acquire raw run data
+// their own way (parse stored JUnit XML vs. capture live events), then delegate ALL model
+// assembly to the pure functions here. This guarantees the two paths derive status,
+// success rate, failure shape, and event normalization identically (structural parity,
+// not coincidence), so the shared renderer produces the same HTML from either source.
+//
+// Pure: no I/O, no XML, no React. The canonical normalized event shape is
+//   { ts, kind, text, eventType?, actionType?, payload? }
+// and the assembled model is a RunReportModel (see assembleRunReportModel).
+const VALID_KINDS = new Set([
+    "user",
+    "assistant",
+    "reasoning",
+    "action",
+    "warning",
+    "info",
+    "error",
+    "success",
+    "system",
+    "muted",
+]);
+const VALID_EVENTS = new Set([
+    "run_started",
+    "instruction_started",
+    "reasoning",
+    "assistant_message",
+    "tool_call",
+    "screenshot_captured",
+    "assertion_result",
+    "retry",
+    "input_request",
+    "run_finished",
+    "error",
+    "system_message",
+    "design_started",
+    "design_status",
+    "design_waiting_for_input",
+    "design_user_input",
+    "design_generated_script",
+    "design_saved",
+    "design_error",
+    "design_finished",
+]);
+const VALID_ACTIONS = new Set([
+    "click",
+    "double_click",
+    "drag",
+    "scroll",
+    "type",
+    "keypress",
+    "wait",
+    "screenshot",
+    "move",
+]);
+// Normalizes one raw event (already mapped to canonical field names) into the shared
+// shape, validating kind/eventType/actionType against the known sets and dropping events
+// with no usable text. Returns null for a dropped event (and pushes a warning, if a
+// `warnings` array is provided). Callers map their producer-specific field names
+// (NDJSON `event`/`action`, CLI `type`) to `eventType`/`actionType`/`kind` before calling.
+export function normalizeEvent(value, { fallbackTs = null, warnings } = {}) {
+    const text = typeof value.text === "string" ? value.text : null;
+    if (!text || !text.trim()) {
+        warnings?.push("Skipped one event line due to missing text.");
+        return null;
+    }
+    const ts = typeof value.ts === "string" && value.ts.trim().length > 0 ? value.ts : fallbackTs;
+    const kind = typeof value.kind === "string" && VALID_KINDS.has(value.kind) ? value.kind : "info";
+    const eventType = typeof value.eventType === "string" && VALID_EVENTS.has(value.eventType) ? value.eventType : undefined;
+    const actionType = typeof value.actionType === "string" && VALID_ACTIONS.has(value.actionType) ? value.actionType : undefined;
+    const payload = value.payload && typeof value.payload === "object" && !Array.isArray(value.payload)
+        ? value.payload
+        : undefined;
+    return { ts, kind, text, eventType, actionType, payload };
+}
+// Maps a list of raw events through normalizeEvent, dropping the ones that fail.
+export function normalizeEvents(values, options = {}) {
+    const events = [];
+    for (const value of values) {
+        const event = normalizeEvent(value, options);
+        if (event)
+            events.push(event);
+    }
+    return events;
+}
+// The single status precedence ladder: error > fail > stopped > skipped > pass.
+// `failureKind` is the kind of any parsed <failure>/<error> node (XML) or the CLI's
+// derived failure kind; it lets a run with no count attributes still resolve correctly.
+export function deriveRunStatus({ tests = 0, failures = 0, errors = 0, skipped = 0, stopped = false, hasSkippedNode = false, failureKind, } = {}) {
+    if (errors > 0 || failureKind === "error")
+        return "error";
+    if (failures > 0 || failureKind === "failure")
+        return "fail";
+    if (stopped)
+        return "stopped";
+    if (skipped >= tests || (hasSkippedNode && tests <= 1))
+        return "skipped";
+    return "pass";
+}
+// The single success-rate formula: passed / tests, falling back to status when there are
+// no test counts. `passed` = tests minus failures/errors/skipped (clamped at 0).
+export function computeSuccessRate({ tests = 0, failures = 0, errors = 0, skipped = 0, status } = {}) {
+    const passed = Math.max(0, tests - failures - errors - skipped);
+    return tests > 0 ? (passed / tests) * 100 : status === "pass" ? 100 : 0;
+}
+// The single failureOrError constructor. Returns undefined when there is no failure kind.
+export function makeFailureOrError({ kind, type, message, body } = {}) {
+    if (!kind)
+        return undefined;
+    return { kind, type, message, body };
+}
+// The single run_finished payload contract — the shape the shared renderer's
+// runSummaryData() consumes. Producers map their own stat names to these canonical fields.
+export function buildRunFinishedPayload({ success, error, durationMs, instructionsTotal, instructionsCompleted, actionsTotal, assertionsPassed, assertionsFailed, retries, } = {}) {
+    return {
+        success: Boolean(success),
+        error: error ?? null,
+        durationMs,
+        instructionsTotal,
+        instructionsCompleted: instructionsCompleted ?? 0,
+        actionsTotal: actionsTotal ?? 0,
+        assertionsPassed: assertionsPassed ?? 0,
+        assertionsFailed: assertionsFailed ?? 0,
+        retries: retries ?? 0,
+    };
+}
+// Assembles the final RunReportModel from already-derived parts. Both producers end here so
+// the top-level shape is identical regardless of source.
+export function assembleRunReportModel({ suiteName = null, testName = null, timestamp = null, durationSeconds = null, status, testCases, successRate, failureOrError, events = [], childTests, warnings = [], } = {}) {
+    return {
+        suiteName,
+        testName,
+        timestamp,
+        durationSeconds,
+        status,
+        testCases,
+        successRate,
+        failureOrError,
+        events,
+        childTests,
+        warnings,
+    };
+}