diff --git a/src/components/ActionButtons.test.tsx b/src/components/ActionButtons.test.tsx new file mode 100644 index 0000000..7e53530 --- /dev/null +++ b/src/components/ActionButtons.test.tsx @@ -0,0 +1,69 @@ +// @vitest-environment jsdom +import { render, screen } from "@testing-library/react"; +import { describe, it, expect, vi } from "vitest"; +import { ActionButtons } from "./ActionButtons"; +import userEvent from "@testing-library/user-event"; +import "@testing-library/jest-dom"; + +describe("ActionButtons", () => { + const defaultProps = { + handleCopy: vi.fn(), + handleDownload: vi.fn(), + previewUrl: "https://example.com/preview.png", + copyStatus: "idle" as const, + }; + + it("renders the Copy Image and Download PNG buttons", () => { + render(); + + expect(screen.getByRole("button", { name: /Copy Image/i })).toBeInTheDocument(); + expect(screen.getByRole("button", { name: /Download PNG/i })).toBeInTheDocument(); + }); + + it("renders 'Copied!' text when copyStatus is 'copied'", () => { + render(); + + expect(screen.getByRole("button", { name: /Copied!/i })).toBeInTheDocument(); + expect(screen.queryByRole("button", { name: /Copy Image/i })).not.toBeInTheDocument(); + }); + + it("disables both buttons when previewUrl is null", () => { + render(); + + const copyButton = screen.getByRole("button", { name: /Copy Image/i }); + const downloadButton = screen.getByRole("button", { name: /Download PNG/i }); + + expect(copyButton).toBeDisabled(); + expect(downloadButton).toBeDisabled(); + }); + + it("enables both buttons when previewUrl is provided", () => { + render(); + + const copyButton = screen.getByRole("button", { name: /Copy Image/i }); + const downloadButton = screen.getByRole("button", { name: /Download PNG/i }); + + expect(copyButton).not.toBeDisabled(); + expect(downloadButton).not.toBeDisabled(); + }); + + it("calls handleCopy when the copy button is clicked", async () => { + const handleCopyMock = vi.fn(); + render(); + + const copyButton = screen.getByRole("button", { name: /Copy Image/i }); + await userEvent.click(copyButton); + + expect(handleCopyMock).toHaveBeenCalledTimes(1); + }); + + it("calls handleDownload when the download button is clicked", async () => { + const handleDownloadMock = vi.fn(); + render(); + + const downloadButton = screen.getByRole("button", { name: /Download PNG/i }); + await userEvent.click(downloadButton); + + expect(handleDownloadMock).toHaveBeenCalledTimes(1); + }); +}); diff --git a/vitest.config.ts b/vitest.config.ts index 9404856..ed7483e 100644 --- a/vitest.config.ts +++ b/vitest.config.ts @@ -16,6 +16,7 @@ export default defineConfig({ "src/lib/**/*.ts", "src/hooks/**/*.ts", "src/components/ThemeController.tsx", + "src/components/ActionButtons.tsx", "src/components/ReadmeCardUrlSection.tsx", "src/components/BusinessCard.tsx", "src/components/LanguageChart.tsx",