Improve mobile comment copy button feedback

This commit is contained in:
dotta 2026-04-07 19:16:24 -05:00
parent 038dd2bb82
commit 1e4ccb2b1f
2 changed files with 127 additions and 8 deletions

View file

@ -61,12 +61,26 @@ vi.mock("@/plugins/slots", () => ({
describe("CommentThread", () => {
let container: HTMLDivElement;
let writeTextMock: ReturnType<typeof vi.fn>;
let execCommandMock: ReturnType<typeof vi.fn>;
beforeEach(() => {
container = document.createElement("div");
document.body.appendChild(container);
vi.useFakeTimers();
vi.setSystemTime(new Date("2026-03-11T12:00:00.000Z"));
writeTextMock = vi.fn(async () => {});
execCommandMock = vi.fn(() => true);
Object.assign(navigator, {
clipboard: {
writeText: writeTextMock,
},
});
Object.defineProperty(window, "isSecureContext", {
value: true,
configurable: true,
});
document.execCommand = execCommandMock;
});
afterEach(() => {
@ -234,4 +248,59 @@ describe("CommentThread", () => {
root.unmount();
});
});
it("uses a larger copy control with feedback and a clipboard fallback", async () => {
const root = createRoot(container);
act(() => {
root.render(
<MemoryRouter>
<CommentThread
comments={[{
id: "comment-1",
companyId: "company-1",
issueId: "issue-1",
authorAgentId: null,
authorUserId: "user-1",
body: "Hello from the comment body",
createdAt: new Date("2026-03-11T11:00:00.000Z"),
updatedAt: new Date("2026-03-11T11:00:00.000Z"),
}]}
onAdd={async () => {}}
/>
</MemoryRouter>,
);
});
const copyButton = Array.from(container.querySelectorAll("button")).find(
(element) => element.getAttribute("aria-label") === "Copy comment as markdown",
) as HTMLButtonElement | undefined;
expect(copyButton).toBeDefined();
expect(copyButton?.className).toContain("min-h-8");
expect(copyButton?.textContent).toContain("Copy");
Object.defineProperty(window, "isSecureContext", {
value: false,
configurable: true,
});
await act(async () => {
copyButton?.click();
});
expect(writeTextMock).not.toHaveBeenCalled();
expect(execCommandMock).toHaveBeenCalledWith("copy");
expect(copyButton?.textContent).toContain("Copied");
act(() => {
vi.advanceTimersByTime(1500);
});
expect(copyButton?.textContent).toContain("Copy");
act(() => {
root.unmount();
});
});
});