diff options
| author | Karan Jayachandra <mail@karanjayachandra.com> | 2026-08-30 22:43:21 +0200 |
|---|---|---|
| committer | Karan Jayachandra <mail@karanjayachandra.com> | 2026-08-30 22:43:21 +0200 |
| commit | fc8d8ab8d0da95ec79056f59e14a150df6fcea89 (patch) | |
| tree | 33f8050b2f2920c0f1b884a205a8aa4c81d7687c /src/lib/components/ToggleButton.test.js | |
| parent | d37ebfda883bcd03b146a85bc3e5a4657d0abd73 (diff) | |
Moved to sveltemain
Diffstat (limited to 'src/lib/components/ToggleButton.test.js')
| -rw-r--r-- | src/lib/components/ToggleButton.test.js | 31 |
1 files changed, 31 insertions, 0 deletions
diff --git a/src/lib/components/ToggleButton.test.js b/src/lib/components/ToggleButton.test.js new file mode 100644 index 0000000..cfbb90d --- /dev/null +++ b/src/lib/components/ToggleButton.test.js @@ -0,0 +1,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(); + }); +}); |
