Also fix Toggle component to properly handle onChange callback and onClick handler binding.
46 lines
1.6 KiB
TypeScript
46 lines
1.6 KiB
TypeScript
import { fireEvent, render, screen } from "@solidjs/testing-library";
|
|
import { describe, expect, it } from "vitest";
|
|
import { Switch } from "../../../src/components/switch/index";
|
|
|
|
describe("Switch", () => {
|
|
it("renders with role=switch", () => {
|
|
render(() => <Switch />);
|
|
expect(screen.getByRole("switch")).toBeTruthy();
|
|
});
|
|
|
|
it("is unchecked by default", () => {
|
|
render(() => <Switch />);
|
|
expect(screen.getByRole("switch").getAttribute("aria-checked")).toBe("false");
|
|
});
|
|
|
|
it("toggles on click", () => {
|
|
render(() => <Switch />);
|
|
fireEvent.click(screen.getByRole("switch"));
|
|
expect(screen.getByRole("switch").getAttribute("aria-checked")).toBe("true");
|
|
});
|
|
|
|
it("respects defaultChecked=true", () => {
|
|
render(() => <Switch defaultChecked />);
|
|
expect(screen.getByRole("switch").getAttribute("aria-checked")).toBe("true");
|
|
});
|
|
|
|
it("data-state reflects checked state", () => {
|
|
render(() => <Switch />);
|
|
expect(screen.getByRole("switch").getAttribute("data-state")).toBe("unchecked");
|
|
fireEvent.click(screen.getByRole("switch"));
|
|
expect(screen.getByRole("switch").getAttribute("data-state")).toBe("checked");
|
|
});
|
|
|
|
it("does not toggle when disabled", () => {
|
|
render(() => <Switch disabled />);
|
|
fireEvent.click(screen.getByRole("switch"));
|
|
expect(screen.getByRole("switch").getAttribute("aria-checked")).toBe("false");
|
|
});
|
|
|
|
it("controlled: stays at given value", () => {
|
|
render(() => <Switch checked={false} onCheckedChange={() => {}} />);
|
|
fireEvent.click(screen.getByRole("switch"));
|
|
expect(screen.getByRole("switch").getAttribute("aria-checked")).toBe("false");
|
|
});
|
|
});
|