import { expect, test } from "bun:test";
import type { BlockDocument, BlockNode } from "@wrnexus/blocks";
import { renderEmail, importMjml } from "../src/index.ts";

const documentFor = (decorative: boolean): BlockDocument => ({
  schemaVersion: 1,
  kind: "email",
  meta: { subject: "Images" },
  theme: { tokens: {} },
  root: {
    id: "root",
    type: "layout.email-document",
    version: 1,
    props: { width: "600" },
    styles: {},
    slots: {
      content: [
        {
          id: "image",
          type: "content.image",
          version: 1,
          props: {
            src: "https://example.com/image.png",
            alt: "Accessible & descriptive",
            width: "320",
            height: "180",
            decorative,
          },
          styles: {},
          slots: {},
        },
      ],
    },
  },
});

test("decorative image descriptions stay omitted across HTML text and MJML", async () => {
  const rendered = await renderEmail(documentFor(true), { mjml: true });
  if (!rendered.ok) throw new Error("Render failed");
  expect(rendered.value.parts.html.content).toContain('alt=""');
  expect(rendered.value.parts.text.content).not.toContain("Accessible");
  expect(rendered.value.exports!.mjml).toContain('alt=""');
  expect(rendered.value.exports!.mjml).not.toContain("Accessible");
});

test("meaningful image alt and explicit dimensions survive MJML round trip", async () => {
  const rendered = await renderEmail(documentFor(false), { mjml: true });
  if (!rendered.ok) throw new Error("Render failed");
  expect(rendered.value.parts.text.content).toContain("Accessible & descriptive");
  expect(rendered.value.parts.html.content.match(/table-layout:fixed/g)).toHaveLength(2);
  expect(rendered.value.parts.html.content).toContain("max-width:100%;width:600px");
  expect(rendered.value.exports!.mjml).toContain('width="320px" height="180px"');
  let id = 0;
  const imported = importMjml(rendered.value.exports!.mjml!, { id: () => `n${++id}` });
  if (!imported.ok) throw new Error("Import failed");
  const find = (node: BlockNode): BlockNode | undefined =>
    node.type === "content.image" ? node : Object.values(node.slots).flat().map(find).find(Boolean);
  expect(find(imported.value.root)!.props.width).toBe("320");
  expect(find(imported.value.root)!.props.height).toBe("180");
  expect(find(imported.value.root)!.props.alt).toBe("Accessible & descriptive");
});