A card above the lists shows the entries the reader hasn't seen, five at most; Got it records the newest. The footer opens the changelog: release notes with their commit range and specs, the short entries each covers, and the rest by month. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
60 lines
2.5 KiB
TypeScript
60 lines
2.5 KiB
TypeScript
import { describe, expect, test } from "bun:test";
|
|
import { renderToStaticMarkup } from "react-dom/server";
|
|
import { ChangelogSheet } from "../src/client/components/ChangelogSheet.tsx";
|
|
import { WhatsNew } from "../src/client/components/WhatsNew.tsx";
|
|
import { Colophon } from "../src/client/components/Colophon.tsx";
|
|
import type { Entry, Note } from "../src/shared/changelog.ts";
|
|
|
|
const e = (id: string, kind: Entry["kind"] = "feature", note?: string): Entry => ({
|
|
id, date: "2026-10-13", kind, title: `Title ${id}`, ref: "abcdef1", ...(note ? { note } : {}),
|
|
});
|
|
|
|
describe("What's new", () => {
|
|
const noop = () => {};
|
|
|
|
test("lists unseen entries with their kind, at most five", () => {
|
|
const html = renderToStaticMarkup(
|
|
<WhatsNew entries={["a", "b", "c", "d", "e", "f", "g"].map((x) => e(x))} onDismiss={noop} onSeeAll={noop} />,
|
|
);
|
|
expect(html).toContain("What's new");
|
|
expect(html).toContain("Title e");
|
|
expect(html).not.toContain("Title f");
|
|
expect(html).toContain("See all (2 more)");
|
|
expect(html).toContain("Got it");
|
|
expect(html).toContain("New");
|
|
});
|
|
|
|
test("renders nothing with nothing unseen", () => {
|
|
expect(renderToStaticMarkup(<WhatsNew entries={[]} onDismiss={noop} onSeeAll={noop} />)).toBe("");
|
|
});
|
|
});
|
|
|
|
describe("the changelog sheet", () => {
|
|
const note: Note = {
|
|
id: "goals", date: "2026-10-13", title: "Check-in goals", summary: ["Para one.", "Para two."],
|
|
from: "1deb0cb", to: "064cea2", specs: ["docs/superpowers/specs/2026-10-03-check-in-goals-design.md"],
|
|
};
|
|
|
|
test("a note shows its summary, its commit range and its specs, with its entries under it", () => {
|
|
const html = renderToStaticMarkup(
|
|
<ChangelogSheet notes={[note]} entries={[e("x", "fix", "goals"), e("loose", "games")]} onClose={() => {}} />,
|
|
);
|
|
expect(html).toContain("Check-in goals");
|
|
expect(html).toContain("Para two.");
|
|
expect(html).toContain("/compare/1deb0cb...064cea2");
|
|
expect(html).toContain("/blob/main/docs/superpowers/specs/2026-10-03-check-in-goals-design.md");
|
|
expect(html).toContain("Title x");
|
|
expect(html).toContain("/commit/abcdef1");
|
|
// An entry with no note is still listed.
|
|
expect(html).toContain("Title loose");
|
|
expect(html).toContain("Games & sources");
|
|
});
|
|
});
|
|
|
|
describe("the footer link", () => {
|
|
test("opens the changelog when the app can show it", () => {
|
|
const html = renderToStaticMarkup(<Colophon sources={[]} now={0} onChangelog={() => {}} />);
|
|
expect(html).toContain("Changelog");
|
|
});
|
|
});
|