docs: complete presentation demo chrome slice

This commit is contained in:
lda
2026-07-12 16:09:00 +07:00 Verified
parent 7fb48f0f96
commit db6e5c4de6
6 changed files with 121 additions and 16 deletions
+52
View File
@@ -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.
+11 -6
View File
@@ -293,12 +293,17 @@ separate activity after these surfaces are stable.
decision outcome rather than a near-duplicate presentation beat. decision outcome rather than a near-duplicate presentation beat.
Implementation plan: Implementation plan:
[`Scene 11 decision beat compression`](historical/superpowers/plans/2026-07-12-scene-11-decision-beat-compression.md). [`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 5. **Completed: Scene 10 factual proof and graph composition:** the factual
output/trace claims, replace the hand-positioned graph with a large dark graph, selected input files, and proof layout are now implemented. The
horizontal Dagre/React Flow sequence graph, show selected input files, and completed plan is [`Scene 10 factual graph and proof layout`](historical/superpowers/plans/2026-07-12-scene-10-factual-graph-and-proof-layout.md).
place live/replay launch inside the operation proof. Implementation plan: File-preview rendering remains explicitly deferred as a separate follow-up.
[`Scene 10 factual graph and proof layout`](superpowers/plans/2026-07-12-scene-10-factual-graph-and-proof-layout.md). 6. **Completed: presentation demo-chrome ownership:** Scenes 812 share one
6. **Visual scale and color pass:** remove unwanted blue from Scenes 2 and 14, 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 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 Scenes 7, 9, 13, and 14, separate Scene 7 Validate from Repair visuals, and
improve Scene 1 title-box padding and contrast. improve Scene 1 title-box padding and contrast.
+8 -10
View File
@@ -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 DemoRunFacts projection. Raw protocol payloads are available through the
evidence receipt and inspector. evidence receipt and inspector.
Scene 10's operation beat exposes the explicit `Run prepared workflow` action Scenes 812 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.
even when a direct link is currently showing replay evidence. With a healthy With a healthy target, the rail starts the live chain through the existing
target, it starts the live chain through the existing `/api/rpc` proxy. If the `/api/rpc` proxy; when health fails, it keeps `Play replay walkthrough` as an
health probe fails, the surface shows the failure reason, offers `Retry live explicit fallback. The presentation does not silently replace a live failure
service`, and keeps `Play replay walkthrough` as an explicit fallback. The with recorded evidence.
presentation does not silently replace a live failure with recorded evidence.
For local live rehearsal, run both services: 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 next execution slice.` and makes no run or RPC request.
The authoring scenes consume deterministic prepared data and never call The authoring scenes consume deterministic prepared data and never call
workflow authoring RPCs. Scene 8 also skips live target probing so its request workflow authoring RPCs. Scene 9 ends at the truthful run-request
and Send path remain fully local. Scene 9 ends at the truthful run-request
handoff; Scenes 1012 own run activation, typed approval, resume, output, and handoff; Scenes 1012 own run activation, typed approval, resume, output, and
trace evidence. No Scene 9 message submission starts a workflow run. trace evidence. No Scene 9 message submission starts a workflow run.
### Demo Climax (Scenes 1012) ### Demo Climax (Scenes 812)
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 while the prepared replay moves from persisted workflow run, to typed human
interrupt, to resume/output/evidence. The rail and outcome panel are interrupt, to resume/output/evidence. The rail and outcome panel are
presentation-only projections over the committed replay; they do not add live 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); 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 () => { it("uses stored target for live presentation mode", async () => {
window.sessionStorage.setItem("lda.workflowConsole.target", "http://127.0.0.1:8765/rpc"); window.sessionStorage.setItem("lda.workflowConsole.target", "http://127.0.0.1:8765/rpc");
window.location.hash = "#scene/run-from-deployment/operation"; 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"); const demoWorkflowCss = readFileSync(join(import.meta.dirname, "styles", "demo-workflow.css"), "utf8").replace(/\r\n/g, "\n");
describe("presentation.css", () => { 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", () => { it("allows hidden primary-region scrolling for browser zoom overflow", () => {
const primaryBlock = css.match( const primaryBlock = css.match(
/\.presentation-stage__primary\s*\{\n position: relative;(?<body>[\s\S]*?)\n\}/, /\.presentation-stage__primary\s*\{\n position: relative;(?<body>[\s\S]*?)\n\}/,