import { describe, expect, it } from "vitest";
import { highlight, renderHighlightedHtml, supportsLanguage } from "../src/utils/syntax-highlight.js";
describe("syntax highlight renderer", () => {
it("renders highlighted spans with the provided theme", () => {
const rendered = renderHighlightedHtml('const value', {
keyword: (text) => `[keyword:${text}]`,
});
expect(rendered).toBe("[keyword:const] value");
});
it("decodes HTML entities emitted by highlight.js", () => {
const rendered = renderHighlightedHtml("<tag attr="value">AA</tag>");
expect(rendered).toBe('AA');
});
it("inherits parent formatting for unmapped nested scopes", () => {
const interpolation = "$" + "{x}";
const rendered = renderHighlightedHtml(
`a${interpolation}b`,
{
string: (text) => `[string:${text}]`,
},
);
expect(rendered).toBe(`[string:a][string:${interpolation}][string:b]`);
});
it("keeps parent formatting across unscoped nested spans", () => {
const rendered = renderHighlightedHtml('abc', {
string: (text) => `[string:${text}]`,
});
expect(rendered).toBe("[string:a][string:b][string:c]");
});
it("highlights code through highlight.js", () => {
expect(supportsLanguage("typescript")).toBe(true);
const rendered = highlight("const value = 1", {
language: "typescript",
ignoreIllegals: true,
theme: {
keyword: (text) => `[keyword:${text}]`,
number: (text) => `[number:${text}]`,
},
});
expect(rendered).toContain("[keyword:const]");
expect(rendered).toContain("[number:1]");
});
});