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

describe("Separator", () => {
  it("renders with role=separator by default", () => {
    render(() => <Separator />);
    expect(screen.getByRole("separator")).toBeTruthy();
  });

  it("renders with role=none when decorative", () => {
    render(() => <Separator decorative data-testid="sep" />);
    expect(screen.queryByRole("separator")).toBeNull();
    expect(screen.getByTestId("sep").getAttribute("role")).toBe("none");
  });

  it("has data-orientation=horizontal by default", () => {
    render(() => <Separator data-testid="sep" />);
    expect(screen.getByTestId("sep").getAttribute("data-orientation")).toBe("horizontal");
  });

  it("has data-orientation=vertical when set", () => {
    render(() => <Separator orientation="vertical" data-testid="sep" />);
    expect(screen.getByTestId("sep").getAttribute("data-orientation")).toBe("vertical");
  });

  it("has aria-orientation=vertical when vertical and not decorative", () => {
    render(() => <Separator orientation="vertical" data-testid="sep" />);
    expect(screen.getByTestId("sep").getAttribute("aria-orientation")).toBe("vertical");
  });

  it("does not have aria-orientation when horizontal (default)", () => {
    render(() => <Separator data-testid="sep" />);
    expect(screen.getByTestId("sep").getAttribute("aria-orientation")).toBeNull();
  });
});
