import { test } from "node:test";
import * as render from "#engine/render";

test("sanity", (t) => t.assert.equal(render.sync("gm <3").text, "gm &lt;3"));
test("simple tree", (t) =>
  t.assert.equal(
    render.sync(
      <main class={["a", "b"]}>
        <h1 style="background-color:red">hello world</h1>
        <p>haha</p>
        {1}|{0}|{true}|{false}|{null}|{undefined}|
      </main>,
    ).text,
    '<main class="a b"><h1 style=background-color:red>hello world</h1><p>haha</p>1|0|||||</main>',
  ));
test("unescaped/escaped html", (t) =>
  t.assert.equal(
    render.sync(
      <div>
        {render.raw("<fuck>")}
        {"\"&'`<>"}
      </div>,
    ).text,
    "<div><fuck>&quot;&amp;&#x27;&#x60;&lt;&gt;</div>",
  ));
test("clsx built-in", (t) =>
  t.assert.equal(
    render.sync(
      <>
        <a class="a" />
        <b class={null} />
        <c class={undefined} />
        <d class={["a", "b", null]} />
        <e class={{ a: true, b: false }} />
        <e
          class={[null, "x", { z: true }, [{ m: true }, null, { v: false }]]}
        />
      </>,
    ).text,
    '<a class=a></a><b></b><c></c><d class="a b"></d><e class=a></e><e class="x z m"></e>',
  ));