import { expect, test } from "bun:test";
import { fillSlots } from "../src/runtime.ts";

test("an outer default slot preserves a nested component's named slots", () => {
  const child =
    '<div data-component="LayoutSplitter"><div data-slot="start">Inbox</div><div data-slot="end">Message</div></div>';
  const shell = fillSlots("<main><slot></slot></main>", child, true);
  expect(shell).toContain(child);
  const panes = fillSlots(
    '<section><slot name="start"></slot><slot name="end"></slot></section>',
    '<div data-slot="start">Inbox</div><div data-slot="end">Message</div>',
    true,
  );
  expect(panes).toContain("Inbox</wrn-slot>");
  expect(panes).toContain("Message</wrn-slot>");
});

test("void children do not swallow following direct named slots", () => {
  const html = fillSlots(
    '<slot name="header"></slot><slot></slot>',
    'Text<input><div data-slot="header">Heading</div><p>Body</p>',
  );
  expect(html).toBe("HeadingText<input><p>Body</p>");
});