@crvouga/atlas 0.0.0-stage → 0.2.0

package/dist/reports/src/frames.js

@@ -0,0 +1,245 @@
+const frameCache = new WeakMap();
+const actorOrderCache = new WeakMap();
+const carryCache = new WeakMap();
+/** Per frame index: each client's latest UI snapshot at or before it. */
+function carriedUiBlobs(test) {
+    const cached = carryCache.get(test.report.steps);
+    if (cached)
+        return cached;
+    const out = [];
+    let last = new Map();
+    for (const frame of testFrames(test)) {
+        const next = new Map(last);
+        for (const blob of uiBlobs(frame)) {
+            if (blob.nodeId)
+                next.set(blob.nodeId, blob);
+        }
+        out.push(next);
+        last = next;
+    }
+    carryCache.set(test.report.steps, out);
+    return out;
+}
+export function flattenFrames(steps, out = [], depth = 0) {
+    for (const step of steps) {
+        for (const frame of step.frames) {
+            out.push({ step, frame, depth, index: out.length });
+        }
+        flattenFrames(step.steps, out, depth + 1);
+    }
+    return out;
+}
+export function flattenSteps(steps, out = [], depth = 0, parent = null) {
+    for (const step of steps) {
+        const row = { step, depth, parent, index: out.length };
+        out.push(row);
+        flattenSteps(step.steps, out, depth + 1, row);
+    }
+    return out;
+}
+export function firstFrameFor(step, frames) {
+    for (const f of frames) {
+        if (f.step === step)
+            return f;
+    }
+    for (const kid of step.steps) {
+        const f = firstFrameFor(kid, frames);
+        if (f)
+            return f;
+    }
+    return null;
+}
+export function lastFrameBefore(step, frames) {
+    let best = null;
+    for (const f of frames) {
+        if (f.frame.capturedAtMs <= step.endedAtMs)
+            best = f;
+    }
+    return best;
+}
+export function testFrames(test) {
+    const cached = frameCache.get(test.report.steps);
+    if (cached)
+        return cached;
+    const flattened = flattenFrames(test.report.steps, [], 0).map((frame, order) => ({ frame, order }));
+    flattened.sort((a, b) => a.frame.frame.capturedAtMs - b.frame.frame.capturedAtMs ||
+        a.order - b.order);
+    const frames = flattened.map(({ frame }, index) => ({
+        ...frame,
+        index,
+    }));
+    frameCache.set(test.report.steps, frames);
+    return frames;
+}
+function allUiActorIds(test) {
+    const cached = actorOrderCache.get(test.report.steps);
+    if (cached)
+        return cached;
+    const observed = [];
+    const seen = new Set();
+    for (const frame of testFrames(test)) {
+        for (const blob of uiBlobs(frame)) {
+            const id = blob.nodeId;
+            if (id && !seen.has(id)) {
+                seen.add(id);
+                observed.push(id);
+            }
+        }
+    }
+    if (observed.length === 0) {
+        actorOrderCache.set(test.report.steps, []);
+        return [];
+    }
+    const ordered = test.report.meta.actorIds.filter((id) => seen.has(id));
+    for (const id of observed) {
+        if (!ordered.includes(id))
+            ordered.push(id);
+    }
+    actorOrderCache.set(test.report.steps, ordered);
+    return ordered;
+}
+/** Return UI snapshots in one stable actor order, including empty slots. */
+export function orderedUiBlobs(frame, test) {
+    const blobs = uiBlobs(frame);
+    const byNode = new Map();
+    const unassigned = [];
+    for (const blob of blobs) {
+        const nodeId = blob.nodeId || '';
+        if (nodeId && !byNode.has(nodeId))
+            byNode.set(nodeId, blob);
+        else if (!nodeId)
+            unassigned.push(blob);
+    }
+    const carried = frame ? carriedUiBlobs(test)[frame.index] : undefined;
+    const ordered = allUiActorIds(test).map((nodeId) => {
+        const own = byNode.get(nodeId);
+        if (own)
+            return { nodeId, blob: own, stale: false };
+        return { nodeId, blob: carried?.get(nodeId) ?? null, stale: true };
+    });
+    for (const blob of unassigned) {
+        ordered.push({
+            nodeId: `snapshot-${ordered.length + 1}`,
+            blob,
+            stale: false,
+        });
+    }
+    return ordered;
+}
+export function selectedFrame(frames, route) {
+    const n = Number.parseInt(route.params['frame'] || '', 10);
+    if (Number.isFinite(n) && n >= 1 && n <= frames.length) {
+        return frames[n - 1] ?? null;
+    }
+    for (const f of frames) {
+        if (f.step.status === 'failed')
+            return f;
+    }
+    return frames[frames.length - 1] ?? null;
+}
+export function isUi(b) {
+    return b.media === 'html' || b.media === 'png';
+}
+export function uiBlobs(frame) {
+    return frame ? frame.frame.snapshots.filter(isUi) : [];
+}
+export function stageBlobs(frame) {
+    return frame ? [...frame.frame.snapshots] : [];
+}
+export function frameHasUi(frame) {
+    return uiBlobs(frame).length > 0;
+}
+const PREFETCH_MEDIA = new Set([
+    'html',
+    'png',
+    'json',
+    'text',
+]);
+/** Frame files around `index` (the visible one, plus neighbors) to fetch ahead. */
+export function frameFilesNear(frames, index, radius) {
+    const files = [];
+    const seen = new Set();
+    const from = Math.max(0, index - radius);
+    const to = Math.min(frames.length, index + radius + 1);
+    for (let i = from; i < to; i += 1) {
+        for (const blob of frames[i]?.frame.snapshots ?? []) {
+            if (!PREFETCH_MEDIA.has(blob.media) || seen.has(blob.file))
+                continue;
+            seen.add(blob.file);
+            files.push(blob.file);
+        }
+    }
+    return files;
+}
+export function actorIds(frame, test) {
+    const ids = [];
+    const seen = {};
+    const add = (id) => {
+        if (!id || seen[id])
+            return;
+        seen[id] = true;
+        ids.push(id);
+    };
+    for (const b of uiBlobs(frame))
+        add(b.nodeId || '');
+    if (ids.length === 0) {
+        for (const b of stageBlobs(frame))
+            add(b.nodeId || '');
+    }
+    if (ids.length === 0) {
+        for (const id of test.report.meta.actorIds)
+            add(id);
+    }
+    return ids;
+}
+export function selectedNode(frame, route, test) {
+    const ids = actorIds(frame, test);
+    const param = route.params['node'];
+    if (param && ids.includes(param))
+        return param;
+    if (frame?.step.actorId && ids.includes(frame.step.actorId)) {
+        return frame.step.actorId;
+    }
+    return ids[0] ?? null;
+}
+export function blobText(test, blob) {
+    const b = test.blobs[blob.file];
+    return b && typeof b.text === 'string' ? b.text : null;
+}
+export function blobDataUrl(test, blob) {
+    const b = test.blobs[blob.file];
+    if (!b?.base64)
+        return null;
+    return `data:${b.contentType};base64,${b.base64}`;
+}
+/** Whether any frame of `step` (not its children) shows a press target. */
+export function stepHasPress(step) {
+    return step.frames.some((f) => f.hit !== undefined);
+}
+/** Next (`delta` 1) / previous (-1) frame of a failed step, wrapping. */
+export function neighborFailure(frames, from, delta) {
+    const n = frames.length;
+    for (let k = 1; k <= n; k += 1) {
+        const f = frames[(((from + delta * k) % n) + n) % n];
+        if (f && f.step.status === 'failed' && f.index !== from)
+            return f;
+    }
+    return null;
+}
+/** First frame of the next / previous step (skipping same-step frames). */
+export function neighborStepFrame(frames, from, delta) {
+    const cur = frames[from];
+    if (!cur)
+        return null;
+    let i = from + delta;
+    while (frames[i] && frames[i]?.step === cur.step)
+        i += delta;
+    const target = frames[i];
+    if (!target)
+        return null;
+    if (delta === 1)
+        return target;
+    while (frames[i - 1] && frames[i - 1]?.step === target.step)
+        i -= 1;
+    return frames[i] ?? null;
+}

package/dist/reports/src/hash.d.ts

@@ -0,0 +1,17 @@
+export type RouteParams = Readonly<Record<string, string>>;
+export type ListRoute = {
+    readonly view: 'list';
+    readonly params: RouteParams;
+};
+export type TestRoute = {
+    readonly view: 'test';
+    readonly testId: string;
+    readonly params: RouteParams;
+};
+export type Route = ListRoute | TestRoute;
+export declare function parseHash(hash: string): Route;
+export declare function buildHash(route: Route): string;
+export declare function viewMode(route: Route): 'single' | 'multi';
+export declare function zoomMode(route: Route): string;
+export declare function showAside(route: Route): boolean;
+export declare function showPress(route: Route): boolean;

package/dist/reports/src/hash.js

@@ -0,0 +1,43 @@
+export function parseHash(hash) {
+    const raw = hash.replace(/^#\/?/, '');
+    const q = raw.split('?');
+    const parts = (q[0] ?? '').split('/').filter(Boolean);
+    const params = {};
+    for (const kv of (q[1] ?? '').split('&')) {
+        if (!kv)
+            continue;
+        const i = kv.indexOf('=');
+        const key = decodeURIComponent(kv.slice(0, i < 0 ? kv.length : i));
+        const value = decodeURIComponent(i < 0 ? '' : kv.slice(i + 1));
+        params[key] = value;
+    }
+    if (parts[0] === 'test' && parts[1]) {
+        // `buildHash` encodes the id; an aggregated report's ids carry slashes
+        // (`libs/chess/monkey`), so the encoded form must be read back.
+        return { view: 'test', testId: decodeURIComponent(parts[1]), params };
+    }
+    return { view: 'list', params };
+}
+export function buildHash(route) {
+    const qs = Object.keys(route.params)
+        .filter((k) => {
+        const v = route.params[k];
+        return v !== undefined && v !== null && v !== '';
+    })
+        .map((k) => `${encodeURIComponent(k)}=${encodeURIComponent(route.params[k] ?? '')}`)
+        .join('&');
+    const path = route.view === 'test' ? `/test/${encodeURIComponent(route.testId)}` : '/';
+    return `#${path}${qs ? `?${qs}` : ''}`;
+}
+export function viewMode(route) {
+    return route.params['view'] === 'single' ? 'single' : 'multi';
+}
+export function zoomMode(route) {
+    return route.params['zoom'] || 'fit';
+}
+export function showAside(route) {
+    return route.params['aside'] !== '0';
+}
+export function showPress(route) {
+    return route.params['press'] !== '0';
+}

package/dist/reports/src/html-frame.d.ts

@@ -0,0 +1,13 @@
+import type { FlatFrame } from './frames.js';
+/**
+ * A self-contained HTML document for a frame that has no UI snapshot: a
+ * Quint step's model state, or any spec step that only recorded text.
+ * Painted in the same phone surface as a real snapshot.
+ */
+type Section = {
+    readonly heading: string;
+    readonly body: string;
+};
+/** HTML document of one frame's model or recorded state. */
+export declare function stateFrameHtml(frame: FlatFrame, sections: readonly Section[]): string;
+export {};

package/dist/reports/src/html-frame.js

@@ -0,0 +1,63 @@
+import { fmtMs } from './format.js';
+const CARD_CSS = [
+    'html,body{margin:0;background:#f4f1ea;color:#1c1915;',
+    'font:14px/1.45 ui-sans-serif,system-ui,sans-serif}',
+    'article{padding:20px 18px 28px}',
+    'h1{font-size:16px;line-height:1.3;margin:0 0 8px}',
+    '.meta{color:#6b645b;font-size:12px;margin:0 0 16px}',
+    'table{width:100%;border-collapse:collapse;background:#fff;',
+    'border:1px solid #e4ddd2;border-radius:10px}',
+    'th,td{text-align:left;vertical-align:top;padding:8px 10px;',
+    'border-top:1px solid #eee6dc;font-size:12px}',
+    'th{width:34%;color:#6b645b;font-weight:600}',
+    'td{font-family:ui-monospace,monospace;white-space:pre-wrap}',
+    'pre{white-space:pre-wrap;background:#fff;border:1px solid #e4ddd2;',
+    'border-radius:10px;padding:10px 12px;font:12px/1.4 ui-monospace,monospace}',
+    'h2{font-size:12px;margin:18px 0 6px;color:#6b645b}',
+    '.err{color:#9f1239;background:#fff1f2;border:1px solid #fecdd3;',
+    'border-radius:10px;padding:10px 12px;white-space:pre-wrap}',
+].join('');
+function escapeHtml(value) {
+    return value
+        .replaceAll('&', '&')
+        .replaceAll('<', '&lt;')
+        .replaceAll('>', '&gt;');
+}
+/** `name = value` lines (a Quint step's observed state), or null. */
+function stateRows(detail) {
+    const lines = detail.split('\n').filter((line) => line.trim() !== '');
+    if (lines.length === 0)
+        return null;
+    const rows = [];
+    for (const line of lines) {
+        const at = line.indexOf(' = ');
+        if (at <= 0)
+            return null;
+        rows.push({ name: line.slice(0, at), value: line.slice(at + 3) });
+    }
+    return rows;
+}
+function detailBlock(detail) {
+    if (detail === undefined || detail.trim() === '')
+        return '';
+    const rows = stateRows(detail);
+    if (rows === null)
+        return `<pre>${escapeHtml(detail)}</pre>`;
+    const body = rows
+        .map((row) => `<tr><th>${escapeHtml(row.name)}</th><td>${escapeHtml(row.value)}</td></tr>`)
+        .join('');
+    return `<table>${body}</table>`;
+}
+function sectionBlocks(sections) {
+    return sections
+        .map((section) => `<h2>${escapeHtml(section.heading)}</h2><pre>${escapeHtml(section.body)}</pre>`)
+        .join('');
+}
+/** HTML document of one frame's model or recorded state. */
+export function stateFrameHtml(frame, sections) {
+    const step = frame.step;
+    const error = step.error === undefined
+        ? ''
+        : `<pre class="err">${escapeHtml(step.error)}</pre>`;
+    return `<!DOCTYPE html><html><head><meta charset="utf-8"><style>${CARD_CSS}</style></head><body><article><p class="meta">${escapeHtml(step.kind)} · ${escapeHtml(fmtMs(step.durationMs))} · frame ${escapeHtml(fmtMs(frame.frame.durationMs))}</p><h1>${escapeHtml(step.title)}</h1>${error}${detailBlock(step.detail)}${sectionBlocks(sections)}</article></body></html>`;
+}

package/dist/reports/src/http.d.ts

@@ -0,0 +1,3 @@
+export type HttpClient = {
+    fetch(input: RequestInfo | URL, init?: RequestInit): Promise<Response>;
+};

package/dist/reports/src/junit.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Overlay test-runner outcomes (JUnit XML) onto a report bundle. A harness run
+ * only sees failures raised inside its own steps; assertions in the test body
+ * surface through the runner's report instead.
+ */
+import type { HtmlReportBundle } from './recording-bundle.js';
+export type JunitCase = {
+    readonly file: string;
+    readonly name: string;
+    /** 1-based line of the test declaration, when the runner emits it. */
+    readonly line: number | null;
+    readonly status: 'passed' | 'failed' | 'skipped';
+    readonly failure: string | null;
+};
+/** Parse the `<testcase>` elements of a JUnit XML document. */
+export declare function parseJunit(xml: string): JunitCase[];
+/**
+ * The test case whose declaration precedes `sourceLine` in the same file and
+ * is the nearest one (bodies follow declarations).
+ */
+export declare function matchJunitCase(cases: readonly JunitCase[], sourceFile: string, sourceLine: number | undefined): JunitCase | null;
+/** Apply runner outcomes / titles to every test with a known source file. */
+export declare function applyJunitOutcomes(bundle: HtmlReportBundle, cases: readonly JunitCase[]): HtmlReportBundle;

package/dist/reports/src/junit.js

@@ -0,0 +1,119 @@
+/**
+ * Overlay test-runner outcomes (JUnit XML) onto a report bundle. A harness run
+ * only sees failures raised inside its own steps; assertions in the test body
+ * surface through the runner's report instead.
+ */
+const ENTITIES = {
+    '&lt;': '<',
+    '&gt;': '>',
+    '&quot;': '"',
+    '&apos;': "'",
+    '&amp;': '&',
+};
+function decodeXml(text) {
+    return text
+        .replace(/&#x([0-9a-fA-F]+);/g, (_, hex) => String.fromCodePoint(Number.parseInt(hex, 16)))
+        .replace(/&#(\d+);/g, (_, dec) => String.fromCodePoint(Number(dec)))
+        .replace(/&(lt|gt|quot|apos|amp);/g, (m) => ENTITIES[m] ?? m);
+}
+function attr(tag, name) {
+    const m = new RegExp(`\\s${name}="([^"]*)"`).exec(tag);
+    return m === null ? null : decodeXml(m[1] ?? '');
+}
+function failureText(body) {
+    const m = /<failure\b([^>]*)(?:\/>|>([\s\S]*?)<\/failure>)/.exec(body);
+    if (m === null)
+        return null;
+    const message = attr(m[1] ?? '', 'message');
+    const inner = (m[2] ?? '').replace(/<!\[CDATA\[([\s\S]*?)\]\]>/g, '$1');
+    const text = decodeXml(inner).trim();
+    return text.length > 0 ? text : (message ?? 'failed');
+}
+function parseCase(tag, inner, suiteFile) {
+    const lineRaw = attr(tag, 'line');
+    const line = lineRaw === null ? null : Number(lineRaw);
+    const failure = failureText(inner);
+    return {
+        file: attr(tag, 'file') ?? suiteFile,
+        name: attr(tag, 'name') ?? '',
+        line: line !== null && Number.isFinite(line) ? line : null,
+        status: caseStatus(failure, inner),
+        failure,
+    };
+}
+function caseStatus(failure, inner) {
+    if (failure !== null)
+        return 'failed';
+    if (/<skipped\b/.test(inner))
+        return 'skipped';
+    return 'passed';
+}
+function parseSuite(tag, body, out) {
+    const suiteFile = attr(tag, 'file') ?? '';
+    const caseRe = /<testcase\b([^>]*?)(?:\/>|>([\s\S]*?)<\/testcase>)/g;
+    for (let c = caseRe.exec(body); c; c = caseRe.exec(body)) {
+        out.push(parseCase(c[1] ?? '', c[2] ?? '', suiteFile));
+    }
+}
+/** Parse the `<testcase>` elements of a JUnit XML document. */
+export function parseJunit(xml) {
+    const cases = [];
+    const suiteRe = /<testsuite\b([^>]*)>([\s\S]*?)<\/testsuite>/g;
+    for (let suite = suiteRe.exec(xml); suite; suite = suiteRe.exec(xml)) {
+        parseSuite(suite[1] ?? '', suite[2] ?? '', cases);
+    }
+    return cases;
+}
+function sameFile(a, b) {
+    const na = a.replace(/\\/g, '/');
+    const nb = b.replace(/\\/g, '/');
+    return na === nb || na.endsWith(`/${nb}`) || nb.endsWith(`/${na}`);
+}
+/**
+ * The test case whose declaration precedes `sourceLine` in the same file and
+ * is the nearest one (bodies follow declarations).
+ */
+export function matchJunitCase(cases, sourceFile, sourceLine) {
+    const inFile = cases.filter((c) => sameFile(c.file, sourceFile));
+    if (inFile.length === 0)
+        return null;
+    if (inFile.length === 1 || sourceLine === undefined)
+        return inFile[0];
+    let best = null;
+    for (const c of inFile) {
+        if (c.line === null || c.line > sourceLine)
+            continue;
+        if (best === null || (best.line ?? 0) < c.line)
+            best = c;
+    }
+    return best;
+}
+function overlayTest(test, c) {
+    const failed = c.status === 'failed' || test.report.meta.status === 'failed';
+    const status = failed ? 'failed' : c.status;
+    const error = test.report.meta.error ?? (c.failure !== null ? c.failure : undefined);
+    return {
+        ...test,
+        report: {
+            ...test.report,
+            meta: {
+                ...test.report.meta,
+                title: c.name.length > 0 ? c.name : test.report.meta.title,
+                status,
+                ...(error !== undefined ? { error } : {}),
+            },
+        },
+    };
+}
+/** Apply runner outcomes / titles to every test with a known source file. */
+export function applyJunitOutcomes(bundle, cases) {
+    const tests = bundle.tests.map((test) => {
+        const { sourceFile, sourceLine } = test.report.meta;
+        if (sourceFile === undefined)
+            return test;
+        const c = matchJunitCase(cases, sourceFile, sourceLine);
+        return c === null ? test : overlayTest(test, c);
+    });
+    const failed = tests.some((t) => t.report.meta.status === 'failed');
+    return { ...bundle, tests, status: failed ? 'failed' : bundle.status };
+}

package/dist/reports/src/keyboard.d.ts

@@ -0,0 +1,16 @@
+import type { FlatFrame } from './frames.js';
+import type { Route } from './hash.js';
+import type { ReportData } from './types.js';
+export type KeyNavHandlers = {
+    toggleHelp: () => void;
+    showHelp: () => boolean;
+    showPalette: () => boolean;
+    togglePalette: () => void;
+    stopPlay: () => void;
+    navigate: (route: Route) => void;
+    goFrame: (frame: FlatFrame | null, node?: string) => void;
+    togglePlay: () => void;
+    setParam: (key: string, value: string) => void;
+    route: () => Route;
+};
+export declare function onReportKeyDown(e: KeyboardEvent, data: ReportData, h: KeyNavHandlers): void;

package/dist/reports/src/keyboard.js

@@ -0,0 +1,135 @@
+import { catalogParams } from './catalog.js';
+import { actorIds, frameHasUi, neighborFailure, neighborStepFrame, selectedFrame, testFrames, } from './frames.js';
+import { showAside, showPress, viewMode, zoomMode } from './hash.js';
+function neighborTest(data, testId, delta) {
+    const i = data.tests.findIndex((t) => t.report.meta.testId === testId);
+    const n = i + delta;
+    if (i < 0 || n < 0 || n >= data.tests.length)
+        return null;
+    return data.tests[n]?.report.meta.testId ?? null;
+}
+function scrubKeys(e, frames, sel, h) {
+    const idx = sel ? sel.index : -1;
+    if (e.key === 'ArrowLeft' && idx > 0)
+        h.goFrame(frames[idx - 1] ?? null);
+    if (e.key === 'ArrowRight' && idx >= 0 && idx < frames.length - 1) {
+        h.goFrame(frames[idx + 1] ?? null);
+    }
+    if (e.key === 'Home' && frames.length)
+        h.goFrame(frames[0] ?? null);
+    if (e.key === 'End' && frames.length) {
+        h.goFrame(frames[frames.length - 1] ?? null);
+    }
+    if (e.key === ' ') {
+        e.preventDefault();
+        h.togglePlay();
+    }
+}
+/** ↑/↓ jump between steps, N / Shift+N between failures. */
+function jumpKeys(e, frames, sel, h) {
+    const idx = sel ? sel.index : -1;
+    let target = null;
+    if (e.key === 'ArrowDown')
+        target = neighborStepFrame(frames, idx, 1);
+    else if (e.key === 'ArrowUp')
+        target = neighborStepFrame(frames, idx, -1);
+    else if (e.key === 'n')
+        target = neighborFailure(frames, idx, 1);
+    else if (e.key === 'N')
+        target = neighborFailure(frames, idx, -1);
+    else
+        return;
+    e.preventDefault();
+    if (target)
+        h.goFrame(target);
+}
+function neighborKeys(e, data, testId, h) {
+    const params = catalogParams(h.route().params);
+    if (e.key === '[') {
+        const id = neighborTest(data, testId, -1);
+        if (id)
+            h.navigate({ view: 'test', testId: id, params });
+    }
+    if (e.key === ']') {
+        const id = neighborTest(data, testId, 1);
+        if (id)
+            h.navigate({ view: 'test', testId: id, params });
+    }
+}
+function uiToggleKeys(e, r, h, ui) {
+    if (!ui)
+        return;
+    if (e.key === 'm' || e.key === 'M') {
+        h.setParam('view', viewMode(r) === 'multi' ? 'single' : '');
+    }
+    if (e.key === 'a' || e.key === 'A') {
+        h.setParam('aside', showAside(r) ? '0' : '');
+    }
+    if (e.key === 'p' || e.key === 'P') {
+        h.setParam('press', showPress(r) ? '0' : '');
+    }
+    if (e.key === 'f' || e.key === 'F') {
+        const order = ['fit', '50', '75', '100'];
+        const cur = zoomMode(r);
+        const next = order[(order.indexOf(cur) + 1) % order.length] ?? 'fit';
+        h.setParam('zoom', next === 'fit' ? '' : next);
+    }
+}
+function viewKeys(e, ctx) {
+    neighborKeys(e, ctx.data, ctx.route.testId, ctx.h);
+    uiToggleKeys(e, ctx.route, ctx.h, frameHasUi(ctx.sel));
+    if (/^[1-9]$/.test(e.key)) {
+        const ids = actorIds(ctx.sel, ctx.test);
+        const n = Number.parseInt(e.key, 10);
+        if (n >= 1 && n <= ids.length)
+            ctx.h.goFrame(ctx.sel, ids[n - 1] ?? '');
+    }
+}
+export function onReportKeyDown(e, data, h) {
+    if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === 'k') {
+        e.preventDefault();
+        h.togglePalette();
+        return;
+    }
+    if (e.key === 'Escape' && h.showPalette()) {
+        e.preventDefault();
+        h.togglePalette();
+        return;
+    }
+    if (h.showPalette())
+        return;
+    const target = e.target;
+    const tag = target?.tagName;
+    if (tag === 'INPUT' ||
+        tag === 'TEXTAREA' ||
+        tag === 'SELECT' ||
+        tag === 'BUTTON' ||
+        tag === 'A' ||
+        target?.isContentEditable) {
+        return;
+    }
+    if (e.key === '?' || (e.shiftKey && e.key === '/')) {
+        h.toggleHelp();
+        return;
+    }
+    if (e.key === 'Escape') {
+        if (h.showHelp()) {
+            h.toggleHelp();
+            return;
+        }
+        h.stopPlay();
+        h.navigate({ view: 'list', params: {} });
+        return;
+    }
+    const r = h.route();
+    if (r.view !== 'test')
+        return;
+    const test = data.tests.find((t) => t.report.meta.testId === r.testId) ?? null;
+    if (!test)
+        return;
+    const frames = testFrames(test);
+    const sel = selectedFrame(frames, r);
+    scrubKeys(e, frames, sel, h);
+    jumpKeys(e, frames, sel, h);
+    viewKeys(e, { data, test, sel, route: r, h });
+}