1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
// @vitest-environment jsdom
import { describe, it, expect, vi } from "vitest";
import { render, screen, fireEvent } from "@testing-library/svelte";
import ToggleButton from "./ToggleButton.svelte";
describe("ToggleButton", () => {
it("renders the label", () => {
render(ToggleButton, { label: "Court 1", active: true, onclick: () => {} });
expect(screen.getByText("Court 1")).toBeInTheDocument();
});
it("shows the outline/secondary styling when inactive", () => {
render(ToggleButton, { label: "Court 1", active: false, onclick: () => {} });
const button = screen.getByRole("button");
expect(button).toHaveClass("outline", "secondary");
});
it("has no outline/secondary styling when active", () => {
render(ToggleButton, { label: "Court 1", active: true, onclick: () => {} });
const button = screen.getByRole("button");
expect(button).not.toHaveClass("outline");
expect(button).not.toHaveClass("secondary");
});
it("calls onclick when clicked", async () => {
const onclick = vi.fn();
render(ToggleButton, { label: "Court 1", active: true, onclick });
await fireEvent.click(screen.getByRole("button"));
expect(onclick).toHaveBeenCalledOnce();
});
});
|