From 91a9222b815c27429161d0bce648d07cd5e80dbb Mon Sep 17 00:00:00 2001
From: Victor Genaev <vgenaev@gmail.com>
Date: Wed, 4 Dec 2024 15:30:08 +0500
Subject: [PATCH] feat(react-tooltip): do not show tooltip, if it's applied to
 menu trigger and menu is opened (#33394)

---
 ...t-tooltip-783b798d-8864-492c-a76d-bd4fdc1d0775.json |  7 +++++++
 .../library/src/components/Tooltip/Tooltip.types.ts    | 10 +++++++++-
 .../library/src/components/Tooltip/useTooltip.tsx      |  6 ++++--
 3 files changed, 20 insertions(+), 3 deletions(-)
 create mode 100644 change/@fluentui-react-tooltip-783b798d-8864-492c-a76d-bd4fdc1d0775.json

diff --git a/change/@fluentui-react-tooltip-783b798d-8864-492c-a76d-bd4fdc1d0775.json b/change/@fluentui-react-tooltip-783b798d-8864-492c-a76d-bd4fdc1d0775.json
new file mode 100644
index 0000000000000..340acfa2332fa
--- /dev/null
+++ b/change/@fluentui-react-tooltip-783b798d-8864-492c-a76d-bd4fdc1d0775.json
@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "feat: do not show tooltip, if it's menu trigger and Menu is opened",
+  "packageName": "@fluentui/react-tooltip",
+  "email": "vgenaev@gmail.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-tooltip/library/src/components/Tooltip/Tooltip.types.ts b/packages/react-components/react-tooltip/library/src/components/Tooltip/Tooltip.types.ts
index e4b4e7218f27e..a206d213748ae 100644
--- a/packages/react-components/react-tooltip/library/src/components/Tooltip/Tooltip.types.ts
+++ b/packages/react-components/react-tooltip/library/src/components/Tooltip/Tooltip.types.ts
@@ -20,7 +20,15 @@ export type TooltipChildProps = {
   ref?: React.Ref<unknown>;
 } & Pick<
   React.HTMLAttributes<HTMLElement>,
-  'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'
+  | 'aria-describedby'
+  | 'aria-label'
+  | 'aria-labelledby'
+  | 'onBlur'
+  | 'onFocus'
+  | 'onPointerEnter'
+  | 'onPointerLeave'
+  | 'aria-haspopup'
+  | 'aria-expanded'
 >;
 
 /**
diff --git a/packages/react-components/react-tooltip/library/src/components/Tooltip/useTooltip.tsx b/packages/react-components/react-tooltip/library/src/components/Tooltip/useTooltip.tsx
index 5916c354587bf..8d5382f23353f 100644
--- a/packages/react-components/react-tooltip/library/src/components/Tooltip/useTooltip.tsx
+++ b/packages/react-components/react-tooltip/library/src/components/Tooltip/useTooltip.tsx
@@ -238,6 +238,7 @@ export const useTooltip_unstable = (props: TooltipProps): TooltipState => {
   const child = getTriggerChild(children);
 
   const triggerAriaProps: Pick<TooltipChildProps, 'aria-label' | 'aria-labelledby' | 'aria-describedby'> = {};
+  const isMenuTrigger = child?.props?.['aria-haspopup'] === 'menu' && child?.props?.['aria-expanded'];
 
   if (relationship === 'label') {
     // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.
@@ -254,8 +255,9 @@ export const useTooltip_unstable = (props: TooltipProps): TooltipState => {
     state.shouldRenderTooltip = true;
   }
 
-  // Don't render the Tooltip in SSR to avoid hydration errors
-  if (isServerSideRender) {
+  // Case 1: Don't render the Tooltip in SSR to avoid hydration errors
+  // Case 2: Don't render the Tooltip, if it triggers Menu and it's already opened
+  if (isServerSideRender || isMenuTrigger) {
     state.shouldRenderTooltip = false;
   }