diff --git a/packages/paperclip-runner/devtools/issue-thread/issue-thread.spec.ts b/packages/paperclip-runner/devtools/issue-thread/issue-thread.spec.ts index 1378afa3535..a828a68c891 100644 --- a/packages/paperclip-runner/devtools/issue-thread/issue-thread.spec.ts +++ b/packages/paperclip-runner/devtools/issue-thread/issue-thread.spec.ts @@ -146,6 +146,15 @@ test.describe("Phase 7G issue thread", () => { ).toBeVisible(); }); + test("the deliverable strip and card report one size in one unit", async ({ page }) => { + await open(page, "deliverable-registered"); + const card = page.locator('[data-thread-item="deliverable"]'); + await expect(card).toContainText("18.0 kB"); + await expect( + page.locator('[data-tool-strip="register_deliverable"]'), + ).toContainText("18.0 kB"); + }); + test("a denial quotes the authorization record verbatim and badges Evidence", async ({ page, }) => { @@ -249,6 +258,28 @@ test.describe("Phase 7G issue thread", () => { await expect(page.locator('[data-composer-state="disabled"] textarea')).toBeDisabled(); }); + test("the replay strip steps, advances, and plays through to the end", async ({ page }) => { + await open(page, "replay-mode"); + const strip = page.getByTestId("replay-strip"); + const progress = page.getByRole("progressbar", { name: "Replay progress" }); + + await page.getByTestId("replay-step-back").click(); + await expect(strip).toContainText("Replay 11/18"); + await expect(progress).toHaveAttribute("aria-valuenow", "11"); + + await page.getByTestId("replay-next-turn").click(); + await expect(strip).toContainText("Replay 12/18"); + + // Play-all runs the recording out and parks itself at the last ordinal + // instead of leaving the operator to click Next turn eighteen times (§6). + const playAll = page.getByTestId("replay-play-all"); + await playAll.click(); + await expect(playAll).toHaveAttribute("aria-pressed", "true"); + await expect(strip).toContainText("Replay 18/18", { timeout: 15_000 }); + await expect(playAll).toHaveAttribute("aria-pressed", "false"); + await expect(page.getByTestId("replay-next-turn")).toBeDisabled(); + }); + test("a terminal disposition disables the composer with a reason", async ({ page }) => { await open(page, "disposition-terminal"); await expect(page.locator('[data-thread-item="disposition"]')).toContainText("Done"); @@ -321,6 +352,36 @@ test.describe("Phase 7G issue thread", () => { await expect(page.getByRole("heading", { name: "Evidence" })).toBeFocused(); }); + test("Escape closes the desktop overlay sheet and returns focus to its toggle", async ({ + page, + }) => { + // Between the mobile segment and the docked side panel, Evidence renders as + // an overlay sheet; §9.1 makes Escape dismiss it. + await page.setViewportSize({ width: 1000, height: 800 }); + await open(page, "thread-baseline"); + await page.getByTestId("evidence-toggle").click(); + + const panel = page.getByTestId("evidence-panel"); + await expect(panel).toHaveAttribute("data-layout", "overlay"); + await expect(page.getByRole("heading", { name: "Evidence" })).toBeFocused(); + + await page.keyboard.press("Escape"); + await expect(panel).toHaveCount(0); + await expect(page.getByTestId("evidence-toggle")).toBeFocused(); + }); + + test("resolving an interaction card moves focus to its state chip", async ({ page }) => { + await open(page, "interaction-question-pending"); + const card = page.locator('[data-interaction-id="ix-questions-01"]'); + + await card.getByRole("radio", { name: "Yes — runner owns it" }).check(); + await card.getByRole("combobox").selectOption("hb-baseline"); + await card.getByRole("button", { name: "Submit answers" }).click(); + + await expect(card).toHaveAttribute("data-interaction-state", "answered"); + await expect(card.getByTestId("interaction-state-chip")).toBeFocused(); + }); + test("the waiting composer anchor focuses the pending card", async ({ page }) => { await open(page, "interaction-question-pending"); await page.getByTestId("pending-anchor").click(); diff --git a/packages/paperclip-runner/devtools/issue-thread/src/App.tsx b/packages/paperclip-runner/devtools/issue-thread/src/App.tsx index 04091d4a09b..d86f6f63ef7 100644 --- a/packages/paperclip-runner/devtools/issue-thread/src/App.tsx +++ b/packages/paperclip-runner/devtools/issue-thread/src/App.tsx @@ -1,4 +1,4 @@ -import { useCallback, useEffect, useMemo, useRef, useState } from "react"; +import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react"; import { PHASE7_DEFAULT_FIXTURE_PROFILE, @@ -22,6 +22,8 @@ const PANEL_OPEN_KEY = "paperclip-runner.phase7.panel.open"; const PANEL_WIDTH_KEY = "paperclip-runner.phase7.panel.width"; const PANEL_MIN = 320; const PANEL_MAX = 640; +/** Play-all cadence for the replay strip (§6); slow enough to read a turn. */ +const REPLAY_STEP_MS = 800; const SCENARIOS = ["hb-baseline", "dp-documents", "ix-interactions", "ar-artifacts"]; function readStoredNumber(key: string, fallback: number): number { @@ -43,6 +45,20 @@ function readStoredFlag(key: string, fallback: boolean): boolean { } } +/** + * Scroll an Evidence target into the panel viewport. `start` alignment has to + * account for the sticky panel head, which would otherwise sit on top of the + * section header the deep link was supposed to reveal. + */ +function scrollEvidenceIntoView(target: Element, block: "start" | "center"): void { + target.scrollIntoView({ block }); + if (block !== "start") return; + const panel = target.closest(".pit-panel"); + const head = panel?.querySelector(".pit-panel-head"); + if (panel == null || head == null) return; + panel.scrollTop = Math.max(0, panel.scrollTop - head.offsetHeight); +} + function useRoute(): Phase7Route { const [route, setRoute] = useState(() => parsePhase7Route(window.location)); useEffect(() => { @@ -87,6 +103,7 @@ export function App() { const [announcement, setAnnouncement] = useState(""); const [showJump, setShowJump] = useState(false); const [reconnected, setReconnected] = useState(false); + const [playing, setPlaying] = useState(false); const scrollRef = useRef(null); const cancelResetRef = useRef(null); @@ -128,6 +145,19 @@ export function App() { setHighlightedRecordId(route.record); }, [route.panel, route.record]); + useLayoutEffect(() => { + // A deep link has to land on what it addressed. With `rec` that is the + // record; without it, the opened section's header — otherwise the link + // half-arrives with the section still below the fold. Layout effect so the + // scroll is committed before paint and a capture can never race it. + if (route.panel === null || snapshot === null) return; + const target = + route.record === null + ? document.querySelector(`[data-evidence-section="${CSS.escape(route.panel)}"]`) + : document.querySelector(`[data-record-id="${CSS.escape(route.record)}"]`); + if (target !== null) scrollEvidenceIntoView(target, route.record === null ? "start" : "center"); + }, [route.panel, route.record, snapshot, panelOpen, segment, openSections]); + useEffect(() => { setSegment(route.segment); }, [route.segment]); @@ -189,6 +219,24 @@ export function App() { [panelWidth, persistPanel], ); + const closeEvidence = useCallback(() => { + setPanelOpen(false); + persistPanel(false, panelWidth); + if (layout === "segment") setSegment("thread"); + // Focus came into the panel when it opened (§9.2), so hand it back to the + // visible control that owns the panel rather than dropping it on `body`. + window.setTimeout(() => { + const candidates = ['[data-testid="evidence-toggle"]', '[data-testid="segment-thread"]']; + for (const selector of candidates) { + const control = document.querySelector(selector); + if (control !== null && control.offsetParent !== null) { + control.focus(); + return; + } + } + }, 0); + }, [layout, panelWidth, persistPanel]); + const jumpToThread = useCallback((anchorId: string) => { setSegment("thread"); const anchor = document.getElementById(anchorId) ?? document.querySelector(`#${CSS.escape(anchorId)}`); @@ -309,6 +357,42 @@ export function App() { return () => document.removeEventListener("keydown", onKeyDown); }, [confirmReset]); + /* ----------------------------------------------------------- replay (§6) */ + + // `?at=` is the source of truth for where the recording is parked, + // so step / next-turn / play-all and the deep link all move the same value. + const replay = useMemo(() => { + if (snapshot === null || snapshot.replay === null) return null; + const { total } = snapshot.replay; + const ordinal = + route.at === null ? snapshot.replay.ordinal : Math.min(total, Math.max(0, route.at)); + return { ordinal, total }; + }, [snapshot, route.at]); + + const seekReplay = useCallback( + (ordinal: number) => { + setPlaying(false); + window.location.hash = phase7RouteHref(route, { at: ordinal }); + }, + [route], + ); + + useEffect(() => { + if (!playing || replay === null) return; + if (replay.ordinal >= replay.total) { + setPlaying(false); + return; + } + const timer = window.setTimeout(() => { + window.location.hash = phase7RouteHref(route, { at: replay.ordinal + 1 }); + }, REPLAY_STEP_MS); + return () => window.clearTimeout(timer); + }, [playing, replay, route]); + + useEffect(() => { + if (replay === null) setPlaying(false); + }, [replay]); + /* ---------------------------------------------------------------- render */ const denialCount = useMemo( @@ -379,46 +463,54 @@ export function App() {

) : null} - {snapshot.replay !== null ? ( + {replay !== null ? (
- Replay {snapshot.replay.ordinal}/{snapshot.replay.total} + Replay {replay.ordinal}/{replay.total}
+
) : null} @@ -527,11 +619,7 @@ export function App() { : [...current, section], ) } - onClose={() => { - setPanelOpen(false); - persistPanel(false, panelWidth); - if (layout === "segment") setSegment("thread"); - }} + onClose={closeEvidence} onJumpToThread={jumpToThread} /> ) : null} diff --git a/packages/paperclip-runner/devtools/issue-thread/src/EvidencePanel.tsx b/packages/paperclip-runner/devtools/issue-thread/src/EvidencePanel.tsx index 71e576cc396..9198e4b1e1d 100644 --- a/packages/paperclip-runner/devtools/issue-thread/src/EvidencePanel.tsx +++ b/packages/paperclip-runner/devtools/issue-thread/src/EvidencePanel.tsx @@ -118,6 +118,21 @@ export function EvidencePanel(props: EvidencePanelProps) { headingRef.current?.focus(); }, []); + useEffect(() => { + // Contract §9.1: Escape closes the desktop overlay sheet. The side panel is + // a persistent region rather than a sheet, and the mobile segment is a tab + // view, so neither of those is dismissible this way. + if (layout !== "overlay") return; + function onKeyDown(event: KeyboardEvent) { + if (event.key !== "Escape") return; + // A modal dialog owns Escape while it is open (§6 reset confirm). + if (document.querySelector('[role="dialog"][aria-modal="true"]') !== null) return; + onClose(); + } + document.addEventListener("keydown", onKeyDown); + return () => document.removeEventListener("keydown", onKeyDown); + }, [layout, onClose]); + const isOpen = (section: Phase7EvidenceSectionId) => openSections.includes(section); return ( diff --git a/packages/paperclip-runner/devtools/issue-thread/src/InteractionCard.tsx b/packages/paperclip-runner/devtools/issue-thread/src/InteractionCard.tsx index 4ede8ce903a..2f60553e6b8 100644 --- a/packages/paperclip-runner/devtools/issue-thread/src/InteractionCard.tsx +++ b/packages/paperclip-runner/devtools/issue-thread/src/InteractionCard.tsx @@ -1,4 +1,4 @@ -import { useId, useRef, useState } from "react"; +import { useEffect, useId, useRef, useState } from "react"; import type { Phase7ThreadInteractionCard, @@ -79,9 +79,23 @@ export function InteractionCard({ const [rejectReason, setRejectReason] = useState(""); const [error, setError] = useState(null); const firstControl = useRef(null); + const stateChip = useRef(null); + const previousState = useRef(card.state); const resolved = RESOLVED_STATES.has(card.state); const busy = card.state === "submitting"; + useEffect(() => { + // Contract §9.2: resolving a card moves focus to its state chip. The + // controls the user just used unmount on resolve, so without this the + // keyboard caret would fall back to `body` exactly when the card changes. + const from = previousState.current; + previousState.current = card.state; + if (from === card.state) return; + if (!RESOLVED_STATES.has(from) && RESOLVED_STATES.has(card.state)) { + stateChip.current?.focus(); + } + }, [card.state]); + function respond(response: Phase7InteractionResponse) { setError(null); onRespond?.(response); @@ -104,7 +118,12 @@ export function InteractionCard({

{card.title}

- + {card.stateLabel} diff --git a/packages/paperclip-runner/devtools/issue-thread/src/issue-thread.css b/packages/paperclip-runner/devtools/issue-thread/src/issue-thread.css index 10f66e3594b..9cb7fb0eec5 100644 --- a/packages/paperclip-runner/devtools/issue-thread/src/issue-thread.css +++ b/packages/paperclip-runner/devtools/issue-thread/src/issue-thread.css @@ -1156,6 +1156,21 @@ textarea { .pit-thread-scroll { padding: var(--pit-space-4) var(--pit-space-3); } + + /* + * Three transport controls plus a progress bar do not fit on one 390px row — + * squeezing them leaves the bar as an unreadable stub. Wrap so the bar keeps + * the full width on its own line, below the label and buttons. + */ + .pit-replay-strip { + flex-wrap: wrap; + padding: var(--pit-space-2) var(--pit-space-3); + } + + .pit-replay-strip .pit-progress { + order: 1; + flex-basis: 100%; + } } @media (prefers-reduced-motion: reduce) { diff --git a/packages/paperclip-runner/devtools/issue-thread/src/primitives.tsx b/packages/paperclip-runner/devtools/issue-thread/src/primitives.tsx index 6cfc8f93dda..6fe68ed1e27 100644 --- a/packages/paperclip-runner/devtools/issue-thread/src/primitives.tsx +++ b/packages/paperclip-runner/devtools/issue-thread/src/primitives.tsx @@ -1,4 +1,4 @@ -import type { ReactNode } from "react"; +import type { ReactNode, Ref } from "react"; import type { Phase7TaskStatus } from "../../../src/mock-core/phase7-control-plane-types"; @@ -49,14 +49,26 @@ export function Chip({ children, title, testId, + /** Set to -1 so focus management can land on a chip without adding a tab stop. */ + tabIndex, + chipRef, }: { tone?: "live" | "mock" | "accent" | "success" | "danger"; children: ReactNode; title?: string; testId?: string; + tabIndex?: number; + chipRef?: Ref; }) { return ( - + {children} ); @@ -75,8 +87,5 @@ export function Timestamp({ value }: { value: string }) { ); } -export function formatBytes(byteSize: number): string { - if (byteSize < 1024) return `${byteSize} B`; - if (byteSize < 1024 * 1024) return `${(byteSize / 1024).toFixed(1)} kB`; - return `${(byteSize / (1024 * 1024)).toFixed(1)} MB`; -} +/** Re-exported so the thread strip and the deliverable card share one unit. */ +export { phase7FormatBytes as formatBytes } from "../../../src/issue-thread/types"; diff --git a/packages/paperclip-runner/docs/phase-07-issue-thread-ui.md b/packages/paperclip-runner/docs/phase-07-issue-thread-ui.md index 0d0c75dd659..e3a7e8b0124 100644 --- a/packages/paperclip-runner/docs/phase-07-issue-thread-ui.md +++ b/packages/paperclip-runner/docs/phase-07-issue-thread-ui.md @@ -56,9 +56,17 @@ the reserved `MCK-` prefix, and no real Paperclip URL is ever rendered. into the matching record, and each record links back to its thread anchor. The panel is collapsed by default and resizable between 320px and 640px with a -keyboard-operable splitter. Below 1100px it becomes an overlay sheet; below -768px the page switches to a `Thread` / `Evidence` segmented control, with Stop -kept outside the `⋯` menu while a turn is active. +keyboard-operable splitter. Below 1100px it becomes an overlay sheet that +Escape dismisses; below 768px the page switches to a `Thread` / `Evidence` +segmented control, with Stop kept outside the `⋯` menu while a turn is active. +Closing the panel by either route hands focus back to the visible control that +owns it. + +- **Replay strip** — in `mode=replay` a progress strip pins under the header + with `Step back`, `Next turn`, and `Play all`. `?at=` is the single + source of truth for the parked ordinal, so the three controls and the deep + link all move the same value; `Play all` advances one ordinal every 800 ms + and parks itself at the end of the recording. ## Routes @@ -104,11 +112,20 @@ The suite enforces the contract's blocking gate: axe reports zero serious or critical WCAG 2.1 A/AA violations on every screenshot route at both viewports. Structure is one `h1`, `header`/`main`/`complementary` landmarks, a `form` composer, `section` interaction cards labelled by their prompt, and tool strips -as disclosure buttons with `aria-expanded`. Focus moves to the Evidence heading -when the panel opens and to the pending card's first control from the `waiting` -composer anchor. Every state chip pairs color with a glyph and text, all -actionable controls clear 44×44 CSS px on mobile, and `prefers-reduced-motion` -disables the pulse dot, banner slide, and smooth scrolling. +as disclosure buttons with `aria-expanded`. Every state chip pairs color with a +glyph and text, all actionable controls clear 44×44 CSS px on mobile, and +`prefers-reduced-motion` disables the pulse dot, banner slide, and smooth +scrolling. + +Focus management (§9.2) is covered by named regressions in the browser suite: + +- Opening Evidence moves focus to its heading; closing it — with the `Close` + button or with Escape on the overlay sheet — returns focus to the toggle. +- Resolving an interaction card moves focus to the card's state chip. The + controls the user just operated unmount on resolve, so without this the + keyboard caret drops to `body` at the moment the card changes. +- The `waiting` composer's anchor moves focus to the pending card's first + control. ## Contract deviations diff --git a/packages/paperclip-runner/knowledge/evidence/2026-08-10-phase-07g-issue-thread-ui-verification.md b/packages/paperclip-runner/knowledge/evidence/2026-08-10-phase-07g-issue-thread-ui-verification.md index 981e71b71c9..171786d5819 100644 --- a/packages/paperclip-runner/knowledge/evidence/2026-08-10-phase-07g-issue-thread-ui-verification.md +++ b/packages/paperclip-runner/knowledge/evidence/2026-08-10-phase-07g-issue-thread-ui-verification.md @@ -39,8 +39,12 @@ non-empty, and no fixture or projected view matches a credential pattern. # Browser suite -`pnpm exec playwright test --config devtools/issue-thread/playwright.config.ts` -— **46/46 passed**. +`pnpm test:browser:phase7` — **50/50 passed**. + +The script now runs `build:issue-thread` before Playwright. It did not, and the +suite's `vite preview` server serves the built bundle, so a run could pass +against a stale `dist-issue-thread/` that predated the source under test. That +is how the four round-2 regressions below first came up red against fixed code. Functional coverage: baseline item types and turn headers; durable comments distinguished from model prose; collapsed tool strips with `aria-expanded` and @@ -57,8 +61,18 @@ draft survival across refresh; the 390px no-horizontal-scroll assertion; the mobile denial badge; 44px touch targets; Escape closing the `⋯` menu; focus moving to the Evidence heading; and the `waiting` composer anchor. +Round-2 additions from the PAP-16952 gate review: + +* **Escape closes the desktop overlay sheet** at 1000×800 and returns focus to + the `Evidence` toggle (§9.1, was blocking). +* **Resolving a card moves focus to its state chip** (§9.2, was blocking). +* **The replay strip steps, advances, and plays through** to 18/18, then parks + itself with `Next turn` disabled (§6 `play-all`). +* **The deliverable strip and card report one size in one unit** — both now + format through `phase7FormatBytes`. + Accessibility gate: axe (WCAG 2.1 A/AA) on all **12 slugs × 2 viewports** — -zero serious or critical violations. +zero serious or critical violations, re-run after the round-2 fixes. # Screenshot matrix @@ -73,6 +87,14 @@ slugs at 1440×900 and 390×844. Every mobile capture asserts frames are deterministic `fake` mode rendered from package fixtures, so no provider, runner process, or credential is involved. +Five frames were re-recorded for the round-2 fixes and re-verified byte-stable: +`replay-mode--{desktop,mobile}` (the `Play all` control, and the progress bar +wrapping to its own row at 390px so it is not squeezed to a stub), +`debug-panel-open--{desktop,mobile}` (`?panel=` without `rec=` now scrolls the +opened section clear of the sticky panel head, so the §10.2 "authorization +records" requirement is met in frame rather than below the fold), and +`deliverable-registered--desktop` (`18.4 kB` → `18.0 kB`, matching its card). + # Live runnerd and Codex ```sh diff --git a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--desktop.png b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--desktop.png index 06452eaed88..f3e9c2a0a06 100644 Binary files a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--desktop.png and b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--desktop.png differ diff --git a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--mobile.png b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--mobile.png index fddf8ef3511..8d5acb61f7c 100644 Binary files a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--mobile.png and b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/debug-panel-open--mobile.png differ diff --git a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/deliverable-registered--desktop.png b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/deliverable-registered--desktop.png index f4990f54a3a..d738799e6a1 100644 Binary files a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/deliverable-registered--desktop.png and b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/deliverable-registered--desktop.png differ diff --git a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--desktop.png b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--desktop.png index 938643f497d..e4f552741c6 100644 Binary files a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--desktop.png and b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--desktop.png differ diff --git a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--mobile.png b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--mobile.png index dd6e61412cb..f83d2b33c3f 100644 Binary files a/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--mobile.png and b/packages/paperclip-runner/knowledge/evidence/phase-07/ui/replay-mode--mobile.png differ diff --git a/packages/paperclip-runner/package.json b/packages/paperclip-runner/package.json index d1353a100a7..62dd8594b4a 100644 --- a/packages/paperclip-runner/package.json +++ b/packages/paperclip-runner/package.json @@ -81,7 +81,7 @@ "verify:rootless": "bash scripts/verify-rootless-linux.sh", "build:issue-thread": "vite build --config vite.phase7.config.ts", "console:phase7": "pnpm run build:typescript && vite --config vite.phase7.config.ts --host 127.0.0.1 --port 4183", - "test:browser:phase7": "pnpm run build:typescript && playwright test --config devtools/issue-thread/playwright.config.ts", + "test:browser:phase7": "pnpm run build:typescript && pnpm run build:issue-thread && playwright test --config devtools/issue-thread/playwright.config.ts", "record:phase7:ui": "pnpm run build:typescript && pnpm run build:issue-thread && node scripts/record-phase7-ui-evidence.mjs", "check:phase7:ui": "pnpm run build:typescript && pnpm run build:issue-thread && node scripts/record-phase7-ui-evidence.mjs --check", "smoke:phase7:ui": "pnpm run build:typescript && cargo build --manifest-path runner/Cargo.toml --locked -p paperclip-runner-core --bin paperclip-runnerd && node scripts/phase7-issue-thread-smoke.mjs", diff --git a/packages/paperclip-runner/src/issue-thread/fixtures.ts b/packages/paperclip-runner/src/issue-thread/fixtures.ts index e078220cd24..c2469475a78 100644 --- a/packages/paperclip-runner/src/issue-thread/fixtures.ts +++ b/packages/paperclip-runner/src/issue-thread/fixtures.ts @@ -12,7 +12,7 @@ import type { Phase7ThreadItem, Phase7ThreadTurn, } from "./types.js"; -import { PHASE7_ISSUE_THREAD_VIEW_SCHEMA } from "./types.js"; +import { PHASE7_ISSUE_THREAD_VIEW_SCHEMA, phase7FormatBytes } from "./types.js"; export const PHASE7_UI_SHOT_SLUGS = [ "thread-baseline", @@ -896,6 +896,7 @@ const BUILDERS: Record Phase7IssueThreadSnapshot> = { "deliverable-registered": () => { const snapshot = baseline(); const turn = lastTurn(snapshot); + const deliverableBytes = 18_432; turn.toolCallCount = 1; turn.items.push( { @@ -904,7 +905,8 @@ const BUILDERS: Record Phase7IssueThreadSnapshot> = { at: at(4, 20), status: "ok", operationId: "register_deliverable", - summary: "spike-trace.json registered · 18.4 kB", + // Same formatter as the deliverable card so the two never disagree. + summary: `spike-trace.json registered · ${phase7FormatBytes(deliverableBytes)}`, input: { filename: "spike-trace.json", contentType: "application/json" }, result: { commandKind: "register_deliverable", stateRevision: 4 }, evidenceRef: { section: "calls", recordId: "call-5" }, @@ -915,7 +917,7 @@ const BUILDERS: Record Phase7IssueThreadSnapshot> = { at: at(4, 20), filename: "spike-trace.json", deliverableKind: "attachment bytes", - byteSize: 18_432, + byteSize: deliverableBytes, registeredBy: AGENT, contentRef: "mock://artifacts/artifact-7", evidenceRef: { section: "calls", recordId: "call-5" }, diff --git a/packages/paperclip-runner/src/issue-thread/types.ts b/packages/paperclip-runner/src/issue-thread/types.ts index 160d0869a3c..ab7058295fe 100644 --- a/packages/paperclip-runner/src/issue-thread/types.ts +++ b/packages/paperclip-runner/src/issue-thread/types.ts @@ -426,6 +426,18 @@ export function phase7DispositionLabel(disposition: Phase7ToolDisposition): stri return PHASE7_DISPOSITION_LABELS[disposition]; } +/** + * The one byte formatter for the whole surface. Deliverable sizes surface in + * two places — the tool-activity strip summary and the deliverable card — and + * they must agree, so both sides (fixtures, live projection, and the browser + * components) format through here rather than rolling their own division. + */ +export function phase7FormatBytes(byteSize: number): string { + if (byteSize < 1024) return `${byteSize} B`; + if (byteSize < 1024 * 1024) return `${(byteSize / 1024).toFixed(1)} kB`; + return `${(byteSize / (1024 * 1024)).toFixed(1)} MB`; +} + /** * Authorization denials that the agent actually hit. Drives the `Evidence` * badge (§2.2) and reads straight off authorization records — the browser never