import assert from "node:assert/strict";
import React from "react";
import { renderToStaticMarkup } from "react-dom/server";
import test from "node:test";

import { PersonalReportMarkdownView } from "../src/components/personal-report/personal-report-markdown-view.tsx";
import { planetDisplayLabel, type ReportChartBlock } from "../src/lib/report-chart-block.ts";

Object.assign(globalThis, { React });

const SAMPLE_BLOCK: ReportChartBlock = {
  version: 1,
  id: "D1",
  title: "D1 — Rashi Chart（本命盘）",
  layout: "north",
  ascendant: { sign: "Leo", degree: 12.34 },
  planets: [
    { name: "Sun", sign: "Leo", degree: 3.21, retrograde: false },
    { name: "Saturn", sign: "Capricorn", degree: 3.4, retrograde: true },
  ],
};

const MARKDOWN = [
  "#### D1 — Rashi Chart（本命盘）",
  "",
  '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 420 480"><text>engine</text></svg>',
  "",
  "```jyotish-chart",
  JSON.stringify(SAMPLE_BLOCK),
  "```",
  "",
  "```jyotish-chart",
  "{not-json",
  "```",
].join("\n");

test("markdown view draws the North Indian component and skips engine SVG HTML", () => {
  const markup = renderToStaticMarkup(
    React.createElement(PersonalReportMarkdownView, { markdown: MARKDOWN }),
  );
  assert.match(markup, /<svg/);
  assert.match(markup, /role="img"/);
  assert.match(markup, /personal-report-chart-figure/);
  assert.doesNotMatch(markup, /viewBox="0 0 420 480"/);
  assert.match(markup, /图盘数据无效/);
  assert.doesNotMatch(markup, /<script/i);
  assert.match(markup, new RegExp(planetDisplayLabel("Saturn", 3.4, true)));
});