fix: address review feedback - aria-modal, formatJson dedup, overlay close order
This commit is contained in:
@@ -1,8 +1,7 @@
|
||||
import type { EvidenceRecord } from "../app/state.js";
|
||||
import { formatJson } from "./format.js";
|
||||
import type { PresentationState } from "./presentation-state.js";
|
||||
|
||||
const formatJson = (value: unknown): string => JSON.stringify(value, null, 2);
|
||||
|
||||
type EvidenceDrawerProps = {
|
||||
readonly records: readonly EvidenceRecord[];
|
||||
readonly mode: PresentationState["evidenceMode"];
|
||||
|
||||
@@ -19,8 +19,8 @@ export const NodeSpotlight = ({ nodeId, close }: NodeSpotlightProps) => {
|
||||
const node = presentationNodes.find((candidate) => candidate.id === nodeId);
|
||||
if (!node) return null;
|
||||
|
||||
return (
|
||||
<aside className="node-spotlight" role="dialog" aria-label={node.label}>
|
||||
return (
|
||||
<aside className="node-spotlight" role="dialog" aria-modal="true" aria-label={node.label}>
|
||||
<button type="button" onClick={close}>Close</button>
|
||||
<p>NodeUse</p>
|
||||
<h2>{node.label}</h2>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import type { DemoEvent } from "../demo/timeline/models.js";
|
||||
|
||||
const formatJson = (value: unknown): string => JSON.stringify(value, null, 2);
|
||||
import { formatJson } from "./format.js";
|
||||
|
||||
type OperationBlockProps = {
|
||||
readonly event: DemoEvent;
|
||||
|
||||
@@ -38,4 +38,11 @@ describe("PresentationRoute", () => {
|
||||
expect(screen.getByRole("dialog", { name: /issue review/i })).toBeInTheDocument();
|
||||
expect(screen.getByText("NodeUse")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("can advance replay far enough to show a product operation block", async () => {
|
||||
render(<PresentationRoute />);
|
||||
await userEvent.click(screen.getByRole("button", { name: /product operation/i }));
|
||||
|
||||
expect(await screen.findByText(/workflow.runs.start/i)).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
export const formatJson = (value: unknown): string => JSON.stringify(value, null, 2);
|
||||
@@ -34,4 +34,22 @@ describe("presentationReducer", () => {
|
||||
expect(closed.evidenceMode).toBe("hidden");
|
||||
expect(closed.beat).toBe("intro");
|
||||
});
|
||||
|
||||
it("closes node spotlight before evidence drawer", () => {
|
||||
const withNode = presentationReducer(initialPresentationState, {
|
||||
type: "select_node",
|
||||
nodeId: "review_issues",
|
||||
});
|
||||
const withEvidence = presentationReducer(withNode, {
|
||||
type: "set_evidence_mode",
|
||||
mode: "open",
|
||||
});
|
||||
|
||||
expect(withEvidence.selectedNodeId).toBe("review_issues");
|
||||
expect(withEvidence.evidenceMode).toBe("open");
|
||||
|
||||
const afterEscape = presentationReducer(withEvidence, { type: "close_overlay" });
|
||||
expect(afterEscape.selectedNodeId).toBeNull();
|
||||
expect(afterEscape.evidenceMode).toBe("open");
|
||||
});
|
||||
});
|
||||
|
||||
@@ -61,8 +61,8 @@ export const presentationReducer = (
|
||||
case "set_evidence_mode":
|
||||
return { ...state, evidenceMode: action.mode };
|
||||
case "close_overlay":
|
||||
if (state.evidenceMode !== "hidden") return { ...state, evidenceMode: "hidden" };
|
||||
if (state.selectedNodeId !== null) return { ...state, selectedNodeId: null };
|
||||
if (state.evidenceMode !== "hidden") return { ...state, evidenceMode: "hidden" };
|
||||
return state;
|
||||
case "set_playback_mode":
|
||||
return { ...state, playbackMode: action.mode };
|
||||
|
||||
Reference in New Issue
Block a user