import { readFileSync } from "node:fs";
import { resolve } from "node:path";

import { describe, expect, it } from "vitest";

const stylesheet = readFileSync(
  resolve(process.cwd(), "app/globals.css"),
  "utf8",
);

describe("assistant Markdown code styling", () => {
  it("keeps dark syntax colors on a dark code surface", () => {
    expect(stylesheet).toMatch(
      /\.assistant-markdown \[data-streamdown="code-block-body"\]\s*\{[^}]*background:\s*oklch\([^;]+;[^}]*color:\s*oklch\([^;]+;/,
    );
  });

  it("lays out highlighted code tokens as separate readable lines", () => {
    expect(stylesheet).toMatch(
      /\.assistant-markdown \[data-streamdown="code-block-body"\] code > span\s*\{[^}]*display:\s*block;[^}]*line-height:\s*1\.6;/,
    );
  });

  it("uses an explicit monospace stack when no custom code font is loaded", () => {
    expect(stylesheet).toMatch(
      /\.assistant-markdown \[data-streamdown="code-block-body"\]\s*\{[^}]*font-family:\s*ui-monospace,[^;}]+;/,
    );
  });
});