import { test } from "node:test";
import { renderStreaming, Suspense } from "./suspense.ts";

test("sanity", async (t) => {
  let resolve: () => void = null!;

  // @ts-expect-error
  async function AsyncComponent() {
    await new Promise<void>((done) => resolve = done);
    return <button>wow!</button>;
  }

  const example = (
    <main>
      <h1>app shell</h1>
      <Suspense fallback="loading...">
        <AsyncComponent />
      </Suspense>
      <footer>(c) 2025</footer>
    </main>
  );

  const iterator = renderStreaming(example);
  const assertContinue = (actual: unknown, value: unknown) =>
    t.assert.deepEqual(actual, { done: false, value });

  assertContinue(
    await iterator.next(),
    "<template shadowrootmode=open><main><h1>app shell</h1><slot name=suspended_1>loading...</slot><footer>(c) 2025</footer></main></template>",
  );
  t.assert.ok(resolve !== null), resolve();
  assertContinue(
    await iterator.next(),
    "<button slot=suspended_1>wow!</button>",
  );
  t.assert.deepEqual(
    await iterator.next(),
    { done: true, value: {} },
  );
});