From 4c7d0101538cd47203b5d2f53e14d6d0a6a53ba3 Mon Sep 17 00:00:00 2001
From: 7PH <benjamin.raymond@sonarsource.com>
Date: Wed, 19 Jun 2024 12:13:48 +0200
Subject: [PATCH] SONAR-22429 Fix inline copy button

---
 .../src/components/__tests__/clipboard-test.tsx | 17 +++++++++++++++--
 .../design-system/src/components/clipboard.tsx  |  2 +-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/server/sonar-web/design-system/src/components/__tests__/clipboard-test.tsx b/server/sonar-web/design-system/src/components/__tests__/clipboard-test.tsx
index 0a5983a9765..027b990fff6 100644
--- a/server/sonar-web/design-system/src/components/__tests__/clipboard-test.tsx
+++ b/server/sonar-web/design-system/src/components/__tests__/clipboard-test.tsx
@@ -32,7 +32,7 @@ afterEach(() => {
 });
 
 describe('ClipboardButton', () => {
-  it('should display correctly', async () => {
+  it('should display and function correctly', async () => {
     /* Delay: null is necessary to play well with fake timers
      * https://github.com/testing-library/user-event/issues/833
      */
@@ -60,10 +60,23 @@ describe('ClipboardButton', () => {
 });
 
 describe('ClipboardIconButton', () => {
-  it('should display correctly', () => {
+  it('should display and function correctly', async () => {
+    /* Delay: null is necessary to play well with fake timers
+     * https://github.com/testing-library/user-event/issues/833
+     */
+    const user = userEvent.setup({ delay: null });
     renderWithContext(<ClipboardIconButton copyValue="foo" />);
 
     const copyButton = screen.getByRole('button', { name: 'Copy to clipboard' });
     expect(copyButton).toBeInTheDocument();
+
+    expect(screen.getByRole('button', { name: 'Copy to clipboard' })).toBeInTheDocument();
+
+    await user.click(screen.getByRole('button', { name: 'Copy to clipboard' }));
+
+    expect(await screen.findByText('Copied')).toBeVisible();
+
+    await waitForElementToBeRemoved(() => screen.queryByText('Copied'));
+    jest.runAllTimers();
   });
 });
diff --git a/server/sonar-web/design-system/src/components/clipboard.tsx b/server/sonar-web/design-system/src/components/clipboard.tsx
index ffe88b4a045..b84de731144 100644
--- a/server/sonar-web/design-system/src/components/clipboard.tsx
+++ b/server/sonar-web/design-system/src/components/clipboard.tsx
@@ -172,7 +172,7 @@ export function ClipboardIconButton(props: IconButtonProps) {
               aria-label={props['aria-label'] ?? copyLabel}
               className={className}
               data-clipboard-text={copyValue}
-              innerRef={setCopyButton}
+              ref={setCopyButton}
               size={size}
             />
           </Tooltip>
-- 
2.39.5