diff --git a/src/components/Button/Button.test.tsx b/src/components/Button/Button.test.tsx new file mode 100644 index 0000000..1e19a9d --- /dev/null +++ b/src/components/Button/Button.test.tsx @@ -0,0 +1,48 @@ +import { fireEvent, render, screen } from "@testing-library/react"; +import { afterEach, beforeEach, expect, test, vi } from "vitest"; + +import Button from "./Button"; +import styles from "./Button.module.css"; + +beforeEach(() => { + vi.useFakeTimers(); +}); +afterEach(() => { + vi.restoreAllMocks(); +}); + +test("render primary button", () => { + render(); + + const button = screen.getByRole("button", { name: "test" }); + + expect(button.className).includes(styles.primary); +}); + +test("render secondary button", () => { + render(); + + const button = screen.getByRole("button", { name: "test" }); + + expect(button.className).includes(styles.secondary); +}); + +test("debounce 300ms one click", async () => { + const mockOnClick = vi.fn(); + + render( + , + ); + + const button = screen.getByRole("button", { name: "test" }); + + fireEvent.click(button); + fireEvent.click(button); + fireEvent.click(button); + + await vi.advanceTimersByTimeAsync(300); + + expect(mockOnClick).toHaveBeenCalledOnce(); +});