Files
nanobot/webui/src/tests/diff-syntax-highlight.integration.test.tsx
T

57 lines
1.7 KiB
TypeScript

import { render, screen, waitFor } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { DiffSyntaxHighlight } from "@/components/thread/activity/DiffSyntaxHighlight";
import { ThemeProvider } from "@/hooks/useTheme";
describe("DiffSyntaxHighlight with Prism", () => {
it("loads the TSX grammar and renders styled syntax tokens", async () => {
render(
<ThemeProvider theme="light">
<DiffSyntaxHighlight
language="tsx"
lines={[
{
kind: "context",
old_lineno: 1,
new_lineno: 1,
content: 'import { useMemo } from "react";',
},
{
kind: "delete",
old_lineno: 2,
new_lineno: null,
content: "export function StatusBadge() {",
},
{
kind: "add",
old_lineno: null,
new_lineno: 2,
content: "export function StatusBadge(): JSX.Element {",
},
{
kind: "context",
old_lineno: 3,
new_lineno: 3,
content: ' return <span className="badge">ready</span>;',
},
]}
/>
</ThemeProvider>,
);
const highlighted = await screen.findByTestId("syntax-highlighted-diff-hunk");
await waitFor(
() => {
expect(highlighted.querySelectorAll('td:last-child span[style*="color"]')).not.toHaveLength(
0,
);
},
{ timeout: 10_000 },
);
expect(highlighted).toHaveAttribute("data-language", "tsx");
expect(highlighted.querySelectorAll("tbody tr")).toHaveLength(4);
});
});