1import { renderToStaticMarkup } from "react-dom/server";
2import ReactMarkdown from "react-markdown";
3import remarkGfm from "remark-gfm";
4import { describe, expect, it } from "vite-plus/test";
5
6import { remarkGithubAlerts } from "@t3tools/shared/markdownGithubAlerts";
7
8function renderMarkdown(markdown: string): string {
9 return renderToStaticMarkup(
10 <ReactMarkdown remarkPlugins={[remarkGfm, remarkGithubAlerts]}>{markdown}</ReactMarkdown>,
11 );
12}
13
14describe("remarkGithubAlerts", () => {
15 it("keeps content that follows a marker-only paragraph", () => {
16 const html = renderMarkdown("> [!WARNING]\n>\n> ### A heading\n>\n> And a paragraph.");
17
18 expect(html).toContain('data-alert="warning"');
19 expect(html).not.toContain("[!WARNING]");
20 expect(html).toContain("A heading");
21 expect(html).toContain("And a paragraph.");
22 });
23
24 it("tags a quote whose next line opens with an inline node rather than text", () => {
25 const html = renderMarkdown("> [!NOTE]\n> **Medium Risk** Changes live transcript routing.");
26
27 expect(html).toContain('data-alert="note"');
28 expect(html).not.toContain("[!NOTE]");
29 expect(html).toContain("<strong>Medium Risk</strong>");
30 expect(html).toContain("Changes live transcript routing.");
31 });
32
33 it("leaves a quote alone when the marker shares its line with anything else", () => {
34 const html = renderMarkdown("> [!NOTE] an ordinary quote");
35
36 expect(html).not.toContain("data-alert");
37 expect(html).toContain("[!NOTE] an ordinary quote");
38 });
39});