import { fireEvent, render, screen } from "@solidjs/testing-library";
import { describe, expect, it } from "vitest";
import { Toggle } from "../../../src/components/toggle/index";

describe("Toggle", () => {
  it("is off by default", () => {
    render(() => <Toggle>Bold</Toggle>);
    expect(screen.getByRole("button").getAttribute("aria-pressed")).toBe("false");
  });

  it("toggles on click", () => {
    render(() => <Toggle>Bold</Toggle>);
    fireEvent.click(screen.getByRole("button"));
    expect(screen.getByRole("button").getAttribute("aria-pressed")).toBe("true");
  });

  it("respects defaultPressed=true", () => {
    render(() => <Toggle defaultPressed>Bold</Toggle>);
    expect(screen.getByRole("button").getAttribute("aria-pressed")).toBe("true");
  });

  it("controlled: stays at given value", () => {
    render(() => <Toggle pressed={false} onPressedChange={() => {}}>Bold</Toggle>);
    fireEvent.click(screen.getByRole("button"));
    expect(screen.getByRole("button").getAttribute("aria-pressed")).toBe("false");
  });

  it("data-state reflects pressed state", () => {
    render(() => <Toggle>Bold</Toggle>);
    expect(screen.getByRole("button").getAttribute("data-state")).toBe("off");
    fireEvent.click(screen.getByRole("button"));
    expect(screen.getByRole("button").getAttribute("data-state")).toBe("on");
  });

  it("does not toggle when disabled", () => {
    render(() => <Toggle disabled>Bold</Toggle>);
    fireEvent.click(screen.getByRole("button"));
    expect(screen.getByRole("button").getAttribute("aria-pressed")).toBe("false");
  });
});