[LG-5488] fix(code-editor): open copy button tooltip on click

CodeEditorCopyButton duplicates Code's CopyButton and needed the same
openTooltip() patch, since focus no longer opens the tooltip after
mouse usage. Also note LeafyGreenProvider requirement in changeset and
dedupe Tooltip spec render helper.

Author: tsck

.changeset/tooltip-keyboard-focus.md

@@ -1,6 +1,7 @@
 ---
 '@leafygreen-ui/tooltip': patch
 '@leafygreen-ui/code': patch
+'@leafygreen-ui/code-editor': patch
 ---
 
-[LG-5488](https://jira.mongodb.org/browse/LG-5488): `Tooltip` no longer opens when its trigger receives focus from mouse interaction or programmatic focus (e.g. focus restored after closing a modal). It still opens when focus comes from keyboard navigation. `Code`'s copy button now explicitly opens its tooltip on click to continue showing the copied confirmation.
+[LG-5488](https://jira.mongodb.org/browse/LG-5488): `Tooltip` no longer opens when its trigger receives focus from mouse interaction or programmatic focus (e.g. focus restored after closing a modal). It still opens when focus comes from keyboard navigation. Keyboard detection requires the app to be wrapped in `LeafyGreenProvider`; without one, focus continues to open the tooltip as before. The copy buttons in `Code` and `CodeEditor` now explicitly open their tooltips on click to continue showing the copied confirmation.

packages/code-editor/src/CodeEditorCopyButton/CodeEditorCopyButton.spec.tsx

@@ -1,7 +1,15 @@
 import React from 'react';
-import { act, render, screen, waitFor } from '@testing-library/react';
+import {
+  act,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
+import LeafyGreenProvider from '@leafygreen-ui/leafygreen-provider';
+
 import { CodeEditorCopyButton } from './CodeEditorCopyButton';
 import { CopyButtonVariant } from './CodeEditorCopyButton.types';
 import { COPIED_SUCCESS_DURATION, COPIED_TEXT, COPY_TEXT } from './constants';
@@ -109,6 +117,35 @@ describe('CodeEditorCopyButton', () => {
       });
     });
 
+    test('opens tooltip with copied text on keyboard activation after mouse usage', async () => {
+      render(
+        <LeafyGreenProvider>
+          <CodeEditorCopyButton
+            getContentsToCopy={mockgetContentsToCopy}
+            onCopy={mockOnCopy}
+          />
+        </LeafyGreenProvider>,
+      );
+
+      const button = screen.getByRole('button', { name: COPY_TEXT });
+
+      // Mouse usage sets usingKeyboard to false, so the focus from
+      // Enter activation no longer opens the tooltip — the click
+      // handler must open it explicitly
+      await act(async () => {
+        fireEvent.mouseDown(document.body);
+      });
+
+      await act(async () => {
+        button.focus();
+        await userEvent.keyboard('{Enter}');
+      });
+
+      await waitFor(() => {
+        expect(screen.getByRole('tooltip')).toHaveTextContent(COPIED_TEXT);
+      });
+    });
+
     test('shows copied text in tooltip after successful copy', async () => {
       render(
         <CodeEditorCopyButton

packages/code-editor/src/CodeEditorCopyButton/CodeEditorCopyButton.tsx

@@ -104,6 +104,9 @@ export function CodeEditorCopyButton({
     await copyToClipboard();
     onCopy?.();
     setCopied(true);
+    // Explicitly open the tooltip to show the copied confirmation,
+    // since focus alone no longer opens the tooltip
+    openTooltip();
 
     setTimeout(() => {
       setCopied(false);

packages/tooltip/src/Tooltip/Tooltip.spec.tsx

@@ -2,6 +2,7 @@ import React, { createRef, ReactElement } from 'react';
 import {
   act,
   render,
+  RenderOptions,
   screen,
   waitFor,
   waitForElementToBeRemoved,
@@ -66,6 +67,7 @@ function renderTooltip(
       { renderMode?: 'portal'; portalClassName?: string },
       { renderMode: 'inline' | 'top-layer' }
     > = {},
+  options?: Pick<RenderOptions, 'wrapper'>,
 ) {
   const utils = render(
     <>
@@ -78,6 +80,7 @@ function renderTooltip(
         <div>Tooltip Contents!</div>
       </Tooltip>
     </>,
+    options,
   );
 
   const button = utils.getByText(buttonText);
@@ -159,29 +162,15 @@ describe('packages/tooltip', () => {
     });
 
     describe('when "triggerEvent" is "hover", focusing the trigger (LG-5488)', () => {
-      const renderTooltipWithProvider = () => {
-        const utils = render(
-          <LeafyGreenProvider>
-            <div data-testid="backdrop" />
-            <Tooltip
-              trigger={<button>{buttonText}</button>}
-              data-testid={tooltipTestId}
-              triggerEvent="hover"
-            >
-              <div>Tooltip Contents!</div>
-            </Tooltip>
-          </LeafyGreenProvider>,
+      // LeafyGreenProvider is required for keyboard detection
+      const renderTooltipWithProvider = () =>
+        renderTooltip(
+          { triggerEvent: 'hover' },
+          { wrapper: LeafyGreenProvider },
         );
 
-        const button = utils.getByText(buttonText);
-        const backdrop = utils.getByTestId('backdrop');
-
-        return { ...utils, button, backdrop };
-      };
-
       test('does not open the tooltip when focus follows mouse usage', async () => {
-        const { queryByTestId, button, backdrop } =
-          renderTooltipWithProvider();
+        const { queryByTestId, button, backdrop } = renderTooltipWithProvider();
 
         // Mouse usage sets usingKeyboard to false
         await userEvent.click(backdrop);