import { renderToStaticMarkup } from "react-dom/server";import { beforeEach, describe, expect, it, vi } from "vite-plus/test"; const testState = vi.hoisted(() => ({ codeViewClassName: null as string | null, codeViewOptions: null as Record<string, unknown> | null,})); vi.mock("@pierre/diffs/react", () => ({ CodeView: (props: { className: string; options: Record<string, unknown> }) => { testState.codeViewClassName = props.className; testState.codeViewOptions = props.options; return null; },})); import { StyledDiffCodeView } from "./StyledDiffCodeView"; describe("StyledDiffCodeView", () => { beforeEach(() => { testState.codeViewClassName = null; testState.codeViewOptions = null; }); it("always pairs the shared diff styling with its virtualized geometry", () => { const loadDiffFiles = vi.fn(async () => ({ oldFile: { name: "before.ts", contents: "before\n" }, newFile: { name: "after.ts", contents: "after\n" }, })); renderToStaticMarkup( <StyledDiffCodeView className="min-h-0" items={[]} options={{ theme: "pierre-dark", stickyHeaders: true, loadDiffFiles }} />, ); expect(testState.codeViewClassName).toBe( "diff-render-surface [--code-background:var(--background)] outline-none min-h-0", ); expect(testState.codeViewOptions).toMatchObject({ theme: "pierre-dark", stickyHeaders: true, loadDiffFiles, itemMetrics: { diffHeaderHeight: 32, hunkSeparatorHeight: 24, paddingTop: 0, paddingBottom: 8, }, layout: { paddingTop: 0, paddingBottom: 0, gap: 0 }, }); expect(testState.codeViewOptions?.unsafeCSS).toEqual( expect.stringContaining("[data-unmodified-lines]::before"), ); expect(testState.codeViewOptions?.unsafeCSS).toEqual( expect.stringContaining(")[data-expand-index]\n [data-unmodified-lines]"), ); });});
import { renderToStaticMarkup } from "react-dom/server";
import { beforeEach, describe, expect, it, vi } from "vite-plus/test";
const testState = vi.hoisted(() => ({
codeViewClassName: null as string | null,
codeViewOptions: null as Record<string, unknown> | null,
}));
vi.mock("@pierre/diffs/react", () => ({
CodeView: (props: { className: string; options: Record<string, unknown> }) => {
testState.codeViewClassName = props.className;
testState.codeViewOptions = props.options;
return null;
},
}));
import { StyledDiffCodeView } from "./StyledDiffCodeView";
describe("StyledDiffCodeView", () => {
beforeEach(() => {
testState.codeViewClassName = null;
testState.codeViewOptions = null;
});
it("always pairs the shared diff styling with its virtualized geometry", () => {
const loadDiffFiles = vi.fn(async () => ({
oldFile: { name: "before.ts", contents: "before\n" },
newFile: { name: "after.ts", contents: "after\n" },
}));
renderToStaticMarkup(
<StyledDiffCodeView
className="min-h-0"
items={[]}
options={{ theme: "pierre-dark", stickyHeaders: true, loadDiffFiles }}
/>,
);
expect(testState.codeViewClassName).toBe(
"diff-render-surface [--code-background:var(--background)] outline-none min-h-0",
);
expect(testState.codeViewOptions).toMatchObject({
theme: "pierre-dark",
stickyHeaders: true,
loadDiffFiles,
itemMetrics: {
diffHeaderHeight: 32,
hunkSeparatorHeight: 24,
paddingTop: 0,
paddingBottom: 8,
},
layout: { paddingTop: 0, paddingBottom: 0, gap: 0 },
});
expect(testState.codeViewOptions?.unsafeCSS).toEqual(
expect.stringContaining("[data-unmodified-lines]::before"),
);
expect(testState.codeViewOptions?.unsafeCSS).toEqual(
expect.stringContaining(")[data-expand-index]\n [data-unmodified-lines]"),
);
});
});