diff --git a/website-src/src/__tests__/copy-button.test.jsx b/website-src/src/__tests__/copy-button.test.jsx new file mode 100644 index 0000000..4be541e --- /dev/null +++ b/website-src/src/__tests__/copy-button.test.jsx @@ -0,0 +1,24 @@ +/** @vitest-environment jsdom */ +import { afterEach, describe, expect, it, vi } from "vitest"; +import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react"; +import CopyButton from "../components/CopyButton.jsx"; + +afterEach(() => { cleanup(); vi.restoreAllMocks(); }); + +describe("CopyButton", () => { + it("uses title-case Copy with an icon and copies the exact command", async () => { + const writeText = vi.fn().mockResolvedValue(undefined); + Object.defineProperty(navigator, "clipboard", { configurable: true, value: { writeText } }); + const command = "npm install -g agent-skill-manager"; + render(); + const button = screen.getByRole("button", { name: "Copy to clipboard" }); + expect(button.textContent).toBe("Copy"); + expect(button.querySelector("svg")).not.toBeNull(); + fireEvent.click(button); + await waitFor(() => expect(button.textContent).toContain("copied!")); + expect(writeText).toHaveBeenCalledWith(command); + expect(button.querySelector("svg")).not.toBeNull(); + fireEvent.click(button); + await waitFor(() => expect(writeText).toHaveBeenCalledTimes(2)); + }); +}); diff --git a/website-src/src/components/BundleDetail.jsx b/website-src/src/components/BundleDetail.jsx index 1920565..b48a31f 100644 --- a/website-src/src/components/BundleDetail.jsx +++ b/website-src/src/components/BundleDetail.jsx @@ -88,7 +88,7 @@ export default function BundleDetail({ bundle }) { )} diff --git a/website-src/src/components/CopyButton.jsx b/website-src/src/components/CopyButton.jsx index e71c854..f3e7e6f 100644 --- a/website-src/src/components/CopyButton.jsx +++ b/website-src/src/components/CopyButton.jsx @@ -15,7 +15,7 @@ export default function CopyButton({ text, className = "", size = "default", - label = "copy", + label = "Copy", ariaLabel, variant = "outline", }) {