docs: complete presentation demo chrome slice

2026-07-12 16:09:00 +07:00
parent 7fb48f0f96
commit db6e5c4de6
6 changed files with 121 additions and 16 deletions
@@ -0,0 +1,52 @@
+# Task 6 Report
+
+## Scope
+
+Completed the final presentation demo chrome integration task without changing
+production APIs or adding product behavior.
+
+- Added route-level regressions for Scene 8 -> Scene 10 operation -> Scene 10
+  graph -> title backtracking, stale launch/replay chrome, and approval paused
+  label removal after submit.
+- Added CSS contract assertions for compact footer rail sizing and removal of
+  `.demo-run-launch-control`.
+- Updated `web/README.md` to document the Scenes 8-12 footer rail and removed
+  stale Scene 8 probing and Scene 10 in-scene launch claims.
+- Marked Scene 10 factual graph/proof work complete in the roadmap, linked the
+  design and implementation plan, and kept file-preview work deferred.
+- Moved the completed Scene 10 plan to `docs/historical/superpowers/plans/`.
+
+## Verification
+
+- Focused route/CSS tests: passed, 2 files, 63 tests.
+- Full web test gate: passed, 91 files, 715 tests.
+- Web typecheck: passed for console, RPC package, and server.
+- Web build: passed. Vite emitted the existing chunk-size warning for the main
+  bundle; no build failure occurred.
+- `git diff --check`: passed.
+
+Screenshots were captured at 1280x720 after 2-second waits using the existing
+running server and Playwright tooling. Files were written outside the
+repository under `%TEMP%`:
+
+- `task-6-title.png`
+- `task-6-scene-8.png`
+- `task-6-operation.png`
+- `task-6-approval.png`
+- `task-6-output.png`
+
+## Review
+
+Two-axis repository review against `46f25b45`:
+
+- Standards axis: no findings.
+- Spec axis: no missing requirements, scope creep, or incorrect Task 6
+  implementation findings.
+
+## Deviations And Concerns
+
+- The first parallel full-gate invocation showed two existing route-test
+  failures caused by cross-file Vitest interference. The required rerun with
+  servers unchanged passed completely.
+- Browser console output contained one `favicon.ico` 404 from the existing dev
+  server. No presentation route error was observed.
@@ -293,12 +293,17 @@ separate activity after these surfaces are stable.
    decision outcome rather than a near-duplicate presentation beat.
   Implementation plan:
   [`Scene 11 decision beat compression`](historical/superpowers/plans/2026-07-12-scene-11-decision-beat-compression.md).
-5. **Next: Scene 10 factual proof and graph composition:** remove misleading
-   output/trace claims, replace the hand-positioned graph with a large dark
-   horizontal Dagre/React Flow sequence graph, show selected input files, and
-   place live/replay launch inside the operation proof. Implementation plan:
-   [`Scene 10 factual graph and proof layout`](superpowers/plans/2026-07-12-scene-10-factual-graph-and-proof-layout.md).
-6. **Visual scale and color pass:** remove unwanted blue from Scenes 2 and 14,
+5. **Completed: Scene 10 factual proof and graph composition:** the factual
+   graph, selected input files, and proof layout are now implemented. The
+   completed plan is [`Scene 10 factual graph and proof layout`](historical/superpowers/plans/2026-07-12-scene-10-factual-graph-and-proof-layout.md).
+   File-preview rendering remains explicitly deferred as a separate follow-up.
+6. **Completed: presentation demo-chrome ownership:** Scenes 8–12 share one
+   route-projected footer rail for run, replay fallback, retry, paused, and
+   terminal states. Design:
+   [`presentation demo-chrome ownership`](superpowers/specs/2026-07-12-demo-chrome-ownership-design.md).
+   Implementation:
+   [`presentation demo-chrome ownership plan`](superpowers/plans/2026-07-12-presentation-demo-chrome-ownership.md).
+7. **Visual scale and color pass:** remove unwanted blue from Scenes 2 and 14,
   shorten Scene 2's two-column composition, enlarge the focal diagrams in
   Scenes 7, 9, 13, and 14, separate Scene 7 Validate from Repair visuals, and
   improve Scene 1 title-box padding and contrast.
@@ -195,12 +195,11 @@ the public JSON-RPC operations and record live evidence using the same
 DemoRunFacts projection. Raw protocol payloads are available through the
 evidence receipt and inspector.

-Scene 10's operation beat exposes the explicit `Run prepared workflow` action
-even when a direct link is currently showing replay evidence. With a healthy
-target, it starts the live chain through the existing `/api/rpc` proxy. If the
-health probe fails, the surface shows the failure reason, offers `Retry live
-service`, and keeps `Play replay walkthrough` as an explicit fallback. The
-presentation does not silently replace a live failure with recorded evidence.
+Scenes 8–12 share one compact footer demo rail. Scene 8 remains a local scripted conversation, with its chat composer as the main surface, while the rail owns `Run prepared workflow`, replay fallback, retry, running, paused, resuming, and completed labels.
+With a healthy target, the rail starts the live chain through the existing
+`/api/rpc` proxy; when health fails, it keeps `Play replay walkthrough` as an
+explicit fallback. The presentation does not silently replace a live failure
+with recorded evidence.

 For local live rehearsal, run both services:

@@ -369,14 +368,13 @@ workflow authoring RPC operations.
  the next execution slice.` and makes no run or RPC request.

 The authoring scenes consume deterministic prepared data and never call
-workflow authoring RPCs. Scene 8 also skips live target probing so its request
-and Send path remain fully local. Scene 9 ends at the truthful run-request
+workflow authoring RPCs. Scene 9 ends at the truthful run-request
 handoff; Scenes 10–12 own run activation, typed approval, resume, output, and
 trace evidence. No Scene 9 message submission starts a workflow run.

-### Demo Climax (Scenes 10–12)
+### Demo Climax (Scenes 8–12)

-Scenes 10 through 12 are the demo climax. They keep a continuity rail visible
+Scenes 8 through 12 are the demo climax. They keep a continuity rail visible
 while the prepared replay moves from persisted workflow run, to typed human
 interrupt, to resume/output/evidence. The rail and outcome panel are
 presentation-only projections over the committed replay; they do not add live
@@ -280,6 +280,46 @@ describe("PresentationRoute", () => {
    expect(screen.getAllByRole("button", { name: "Run prepared workflow" })).toHaveLength(1);
  });

+  it("backtracks across demo scenes without leaving stale footer chrome", async () => {
+    window.sessionStorage.setItem("lda.workflowConsole.target", "http://127.0.0.1:8765/rpc");
+    window.location.hash = "#scene/agent-handoff/request";
+    const { PresentationRoute } = await import("./PresentationRoute.js");
+    render(<PresentationRoute />);
+
+    expect(await screen.findByRole("textbox", { name: /authoring request/i })).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Run prepared workflow" })).toBeInTheDocument();
+
+    window.location.hash = "#scene/run-from-deployment/operation";
+    fireEvent(window, new Event("hashchange"));
+    expect(await screen.findByRole("button", { name: "Run prepared workflow" })).toBeInTheDocument();
+    expect(screen.queryByRole("region", { name: "prepared workflow launch" })).not.toBeInTheDocument();
+
+    window.location.hash = "#scene/run-from-deployment/graph";
+    fireEvent(window, new Event("hashchange"));
+    expect(await screen.findByRole("heading", { name: /Run From Deployment/i })).toBeInTheDocument();
+    expect(screen.queryByRole("region", { name: "prepared workflow launch" })).not.toBeInTheDocument();
+    expect(screen.queryByText("Replay evidence")).not.toBeInTheDocument();
+
+    window.location.hash = "#scene/thesis/title";
+    fireEvent(window, new Event("hashchange"));
+    expect(await screen.findByRole("heading", { name: /Design and Implementation of lda\.chat/i })).toBeInTheDocument();
+    expect(screen.queryByLabelText("presentation evidence mode")).not.toBeInTheDocument();
+    expect(screen.queryByRole("button", { name: "Run prepared workflow" })).not.toBeInTheDocument();
+    expect(screen.queryByRole("button", { name: "Retry live service" })).not.toBeInTheDocument();
+    expect(screen.queryByTestId("presentation-demo-rail")).not.toBeInTheDocument();
+  });
+
+  it("removes the paused footer label after approval is submitted", async () => {
+    setReplayMode();
+    window.location.hash = "#scene/typed-human-boundary/approval";
+    const { PresentationRoute } = await import("./PresentationRoute.js");
+    render(<PresentationRoute />);
+
+    expect(await screen.findByText("Run paused - review required")).toBeInTheDocument();
+    await userEvent.click(screen.getByRole("button", { name: "Submit" }));
+    expect(screen.queryByText("Run paused - review required")).not.toBeInTheDocument();
+  });
+
  it("uses stored target for live presentation mode", async () => {
    window.sessionStorage.setItem("lda.workflowConsole.target", "http://127.0.0.1:8765/rpc");
    window.location.hash = "#scene/run-from-deployment/operation";
@@ -6,6 +6,16 @@ const css = readFileSync(join(import.meta.dirname, "presentation.css"), "utf8").
 const demoWorkflowCss = readFileSync(join(import.meta.dirname, "styles", "demo-workflow.css"), "utf8").replace(/\r\n/g, "\n");

 describe("presentation.css", () => {
+  it("keeps the demo footer rail compact and removes the old launch control", () => {
+    const railBlock = css.match(/\.presentation-demo-rail\s*\{(?<body>[\s\S]*?)\n\}/)?.groups?.body;
+
+    expect(railBlock).toContain("min-width: min(22rem, 42vw)");
+    expect(railBlock).toContain("min-height: 1.9rem");
+    expect(railBlock).toContain("display: flex");
+    expect(railBlock).toContain("align-items: center");
+    expect(demoWorkflowCss).not.toContain(".demo-run-launch-control");
+  });
+
  it("allows hidden primary-region scrolling for browser zoom overflow", () => {
    const primaryBlock = css.match(
      /\.presentation-stage__primary\s*\{\n  position: relative;(?<body>[\s\S]*?)\n\}/,