mirror of
https://github.com/alkimake/paperclip.git
synced 2026-06-15 02:20:38 +09:00
Improve mobile comment copy button feedback
This commit is contained in:
parent
038dd2bb82
commit
1e4ccb2b1f
2 changed files with 127 additions and 8 deletions
|
|
@ -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();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue