import { fileURLToPath } from "node:url";

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

// `local/jsx-comment-text` (eslint.config.js): a `//` inside JSX children is rendered as text. One
// reached the Playlists page past tsc, eslint and every test — only a visual check caught it. A rule
// that matches nothing looks exactly like a clean codebase, so this asserts it fires.
const RULE = "local/jsx-comment-text";
const FRONTEND = fileURLToPath(new URL("../../", import.meta.url));

async function hits(source: string): Promise<number> {
  const eslint = new ESLint({ cwd: FRONTEND });
  const [result] = await eslint.lintText(source, { filePath: "src/components/__probe.tsx" });
  return (result?.messages ?? []).filter((m) => m.ruleId === RULE).length;
}

describe("a comment inside JSX children", () => {
  it("is refused — it would render as text", async () => {
    expect(
      await hits(`export const A = () => (\n  <>\n    // the list\n    <ul />\n  </>\n);\n`),
    ).toBe(1);
    expect(await hits(`export const B = () => <div>/* note */</div>;\n`)).toBe(1);
  });

  it("is fine as a real comment, and text that merely contains a slash pair is text", async () => {
    expect(await hits(`export const C = () => <div>{/* the list */}</div>;\n`)).toBe(0);
    expect(await hits(`export const D = () => <p>See https://example.com</p>;\n`)).toBe(0);
  });
});