diff --git a/tests/CopyButton.test.svelte b/tests/CopyButton.test.svelte deleted file mode 100644 index 929adc28..00000000 --- a/tests/CopyButton.test.svelte +++ /dev/null @@ -1,11 +0,0 @@ - - - text} - feedback="Copied to clipboard" -/> diff --git a/tests/CopyButton/CopyButton.test.svelte b/tests/CopyButton/CopyButton.test.svelte new file mode 100644 index 00000000..b02d999f --- /dev/null +++ b/tests/CopyButton/CopyButton.test.svelte @@ -0,0 +1,26 @@ + + + { + console.log("copied"); + }} +/> + + + + { + console.log(`Custom copy: ${text}`); + }} +/> diff --git a/tests/CopyButton/CopyButton.test.ts b/tests/CopyButton/CopyButton.test.ts new file mode 100644 index 00000000..c8472c8f --- /dev/null +++ b/tests/CopyButton/CopyButton.test.ts @@ -0,0 +1,69 @@ +import { render, screen } from "@testing-library/svelte"; +import { user } from "../setup-tests"; +import CopyButton from "./CopyButton.test.svelte"; + +describe("CopyButton", () => { + const getCopyButton = (label: string) => + screen.getByRole("button", { name: label }); + + beforeEach(() => { + Object.defineProperty(navigator, "clipboard", { + value: { writeText: () => Promise.resolve() }, + writable: true, + }); + }); + + it("renders and functions correctly", async () => { + const consoleLog = vi.spyOn(console, "log"); + render(CopyButton); + + const button = getCopyButton("Basic"); + expect(button).toHaveAttribute("aria-live", "polite"); + + await user.click(button); + expect(consoleLog).toHaveBeenCalledWith("copied"); + + const feedback = button.querySelector(".bx--copy-btn__feedback"); + expect(feedback).toHaveTextContent("Copied!"); + }); + + it("supports custom feedback text and timeout", async () => { + render(CopyButton); + + const button = getCopyButton("Custom feedback"); + await user.click(button); + + const feedback = button.querySelector(".bx--copy-btn__feedback"); + expect(feedback).toHaveTextContent("Copied to clipboard"); + + await new Promise((resolve) => setTimeout(resolve, 0)); + expect(button).toHaveClass("bx--copy-btn--fade-out"); + }); + + it("supports custom copy function", async () => { + const consoleLog = vi.spyOn(console, "log"); + const clipboard = vi.spyOn(navigator.clipboard, "writeText"); + render(CopyButton); + + const button = getCopyButton("Custom copy function"); + await user.click(button); + expect(consoleLog).toHaveBeenCalledWith( + "Custom copy: Custom copy function", + ); + expect(clipboard).not.toHaveBeenCalled(); + }); + + it("handles clipboard API errors", async () => { + const consoleLog = vi.spyOn(console, "log"); + Object.defineProperty(navigator, "clipboard", { + value: { writeText: () => Promise.reject("Clipboard error") }, + writable: true, + }); + + render(CopyButton); + + const button = getCopyButton("Basic"); + await user.click(button); + expect(consoleLog).toHaveBeenCalledWith("Clipboard error"); + }); +});