aboutsummaryrefslogtreecommitdiff
path: root/src/lib/components/ToggleButton.test.js
blob: cfbb90d6b3f2338bbe6a99987136b6a229a091fc (plain) (blame)
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();
  });
});