102 lines
3.0 KiB
TypeScript
102 lines
3.0 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>,
|
|
);
|
|
|
|
// Full-suite workers can keep the first Prism grammar import busy for more
|
|
// than Testing Library's one-second default, especially on Windows.
|
|
const highlighted = await screen.findByTestId(
|
|
"syntax-highlighted-diff-hunk",
|
|
{},
|
|
{ timeout: 10_000 },
|
|
);
|
|
await waitFor(
|
|
() => {
|
|
const tokens = highlighted.querySelectorAll<HTMLElement>(
|
|
'td:last-child span[style*="color"]',
|
|
);
|
|
expect(tokens).not.toHaveLength(0);
|
|
expect(new Set([...tokens].map((token) => token.style.color)).size).toBeGreaterThan(1);
|
|
},
|
|
{ timeout: 10_000 },
|
|
);
|
|
|
|
expect(highlighted).toHaveAttribute("data-language", "tsx");
|
|
expect(highlighted.querySelectorAll("tbody tr")).toHaveLength(4);
|
|
});
|
|
|
|
it("preserves markdown table line boundaries", async () => {
|
|
const lines = [
|
|
"## 发布安排",
|
|
"",
|
|
"| 日期 | 角色 | 方向 | 是否进实验 |",
|
|
"| --- | --- | --- | --- |",
|
|
"| 7/22 | trust / core | data-driven | yes |",
|
|
];
|
|
|
|
render(
|
|
<ThemeProvider theme="light">
|
|
<DiffSyntaxHighlight
|
|
language="markdown"
|
|
lines={lines.map((content, index) => ({
|
|
kind: "add" as const,
|
|
old_lineno: null,
|
|
new_lineno: 20 + index,
|
|
content,
|
|
}))}
|
|
/>
|
|
</ThemeProvider>,
|
|
);
|
|
|
|
const highlighted = await screen.findByTestId(
|
|
"syntax-highlighted-diff-hunk",
|
|
{},
|
|
{ timeout: 10_000 },
|
|
);
|
|
const rows = [...highlighted.querySelectorAll("tbody tr")];
|
|
|
|
expect(rows).toHaveLength(lines.length);
|
|
expect(rows.map((row) => row.querySelector("td:last-child")?.textContent)).toEqual(
|
|
lines.map((line) => line || " "),
|
|
);
|
|
expect(highlighted.querySelector(".token.table")).toBeNull();
|
|
});
|
|
});
|