// v0.2 Phase 5 — minimal browser-mode component test for LumotiaButton.
// Verifies the primary contract: a click on the rendered button fires
// the onclick handler the parent passed. Covers the most common Phase 7
// migration path (replacing ad-hoc <button> blocks with LumotiaButton).
import { describe, it, expect, vi } from "vitest";
import { render } from "vitest-browser-svelte";
import LumotiaButton from "./LumotiaButton.svelte";

describe("LumotiaButton", () => {
  it("renders its children", async () => {
    const { getByRole } = render(LumotiaButton, {
      props: { children: ((() => "Save") as unknown as never) },
    });
    await expect.element(getByRole("button")).toBeInTheDocument();
  });

  it("fires onclick when clicked", async () => {
    const onclick = vi.fn();
    const { getByRole } = render(LumotiaButton, {
      props: {
        onclick,
        children: ((() => "Save") as unknown as never),
      },
    });
    await getByRole("button").click();
    expect(onclick).toHaveBeenCalledTimes(1);
  });

  it("does not fire onclick when disabled", async () => {
    const onclick = vi.fn();
    const { getByRole } = render(LumotiaButton, {
      props: {
        onclick,
        disabled: true,
        children: ((() => "Save") as unknown as never),
      },
    });
    await getByRole("button").click({ force: true }).catch(() => {});
    expect(onclick).not.toHaveBeenCalled();
  });
});
