alice.pds.demo.boltless.dev
This repository has no description
1<script module lang="ts">
2 import { defineMeta, type StoryContext } from "@storybook/addon-svelte-csf";
3 import { expect, waitFor } from "storybook/test";
4 import type { NiceDiff } from "$lib/api/diff";
5 import { toCommitDetail } from "$lib/api/repo";
6 import CommitView from "./CommitView.svelte";
7
8 const diff: NiceDiff = {
9 commit: {
10 this: "0123456789abcdef0123456789abcdef01234567",
11 parent: "abcdef0123456789abcdef0123456789abcdef01",
12 author: { Name: "dawn", Email: "dawn@example.test", When: "2026-07-28T09:00:00Z" },
13 committer: { Name: "cheri", Email: "cheri@example.test", When: "2026-07-28T10:00:00Z" },
14 message:
15 "add a storybook fixture\n\nthis body is hidden until the disclosure button is pressed.\n\nCo-authored-by: riley <riley@example.test>",
16 change_id: "kqpuwoxzrnvs"
17 },
18 stat: { insertions: 2, deletions: 1, files_changed: 2 },
19 diff: [
20 {
21 name: { old: "src/colors.ts", new: "src/colors.ts" },
22 text_fragments: [
23 {
24 OldPosition: 1,
25 OldLines: 3,
26 NewPosition: 1,
27 NewLines: 4,
28 LinesAdded: 2,
29 LinesDeleted: 1,
30 Lines: [
31 { Op: 0, Line: "export const palette = {\n" },
32 { Op: 1, Line: '\tbackground: "white",\n' },
33 { Op: 2, Line: '\tbackground: "oklch(0.98 0 0)",\n' },
34 { Op: 2, Line: '\tforeground: "oklch(0.2 0 0)",\n' },
35 { Op: 0, Line: "};\n" }
36 ]
37 }
38 ]
39 },
40 {
41 name: { old: "assets/logo.png", new: "assets/logo.png" },
42 is_binary: true
43 }
44 ]
45 };
46
47 type PlayContext = Pick<StoryContext<Record<string, unknown>>, "canvas" | "canvasElement">;
48
49 const shadowText = (canvasElement: HTMLElement) =>
50 [...canvasElement.querySelectorAll("diffs-container")]
51 .map((host) => host.shadowRoot?.textContent ?? "")
52 .join("\n");
53
54 const fullCommit = async ({ canvas, canvasElement }: PlayContext) => {
55 await expect(canvas.getByText("add a storybook fixture")).toBeVisible();
56 await expect(canvas.getByText("co-author")).toBeVisible();
57 await expect(canvas.getByText("committer")).toBeVisible();
58
59 await expect(canvas.getByRole("link", { name: ".patch" })).toHaveAttribute(
60 "href",
61 "/dawn/tangled/commit/0123456789abcdef0123456789abcdef01234567.patch"
62 );
63
64 // the filename is in the light-dom card header, the diff body in the
65 // shadow root
66 await expect(canvas.getByText("src/colors.ts")).toBeVisible();
67 await waitFor(() => expect(shadowText(canvasElement)).toContain("palette"));
68 await expect(
69 canvas.getByText("This is a binary file and will not be displayed.")
70 ).toBeVisible();
71 };
72
73 const hidesDownloadsForShortRef = async ({ canvas }: PlayContext) => {
74 await expect(canvas.getByText("add a storybook fixture")).toBeVisible();
75 await expect(canvas.queryByRole("link", { name: ".patch" })).toBeNull();
76 await expect(canvas.queryByRole("link", { name: ".diff" })).toBeNull();
77 };
78
79 const { Story } = defineMeta({
80 title: "Repo/CommitView",
81 component: CommitView,
82 tags: ["autodocs"],
83 args: {
84 ownerHandle: "dawn",
85 repoName: "tangled",
86 ref: "0123456789abcdef0123456789abcdef01234567",
87 commit: toCommitDetail(diff.commit!),
88 parent: diff.commit?.parent ?? "",
89 changeId: diff.commit?.change_id ?? "",
90 files: diff.diff ?? [],
91 stat: diff.stat
92 }
93 });
94</script>
95
96<Story name="Full commit" play={fullCommit} />
97
98<Story name="Split" args={{ diffStyle: "split" }} />
99
100<Story name="Branch ref" args={{ ref: "main" }} play={hidesDownloadsForShortRef} />