Tooltip: Improve accessibility for context menus

src/accessibility/context_menu/ContextMenuTooltipButton.tsx

@@ -18,9 +18,9 @@ limitations under the License.
 
 import React, { ComponentProps, forwardRef, Ref } from "react";
 
-import AccessibleTooltipButton from "../../components/views/elements/AccessibleTooltipButton";
+import AccessibleButton from "../../components/views/elements/AccessibleButton";
 
-type Props<T extends keyof JSX.IntrinsicElements> = ComponentProps<typeof AccessibleTooltipButton<T>> & {
+type Props<T extends keyof JSX.IntrinsicElements> = ComponentProps<typeof AccessibleButton<T>> & {
  // whether the context menu is currently open
  isExpanded: boolean;
 };
@@ -31,17 +31,17 @@ export const ContextMenuTooltipButton = forwardRef(function <T extends keyof JSX
  ref: Ref<HTMLElement>,
 ) {
  return (
- <AccessibleTooltipButton
+ <AccessibleButton
  {...props}
  element={element as keyof JSX.IntrinsicElements}
  onClick={onClick}
  onContextMenu={onContextMenu ?? onClick ?? undefined}
  aria-haspopup={true}
  aria-expanded={isExpanded}
- forceHide={isExpanded}
+ disableTooltip={isExpanded}
  ref={ref}
  >
  {children}
- </AccessibleTooltipButton>
+ </AccessibleButton>
  );
 });

src/components/views/elements/AccessibleButton.tsx

@@ -106,6 +106,11 @@ type Props<T extends keyof JSX.IntrinsicElements> = DynamicHtmlElementProps<T> &
  * Callback for when the tooltip is opened or closed.
  */
  onTooltipOpenChange?: TooltipProps["onOpenChange"];
+
+ /**
+ * Whether the tooltip should be disabled.
+ */
+ disableTooltip?: TooltipProps["disabled"];
 };
 
 /**
@@ -140,6 +145,7 @@ const AccessibleButton = forwardRef(function <T extends keyof JSX.IntrinsicEleme
  caption,
  placement = "right",
  onTooltipOpenChange,
+ disableTooltip,
  ...restProps
  }: Props<T>,
  ref: Ref<HTMLElement>,
@@ -217,6 +223,7 @@ const AccessibleButton = forwardRef(function <T extends keyof JSX.IntrinsicEleme
  isTriggerInteractive={true}
  placement={placement}
  onOpenChange={onTooltipOpenChange}
+ disabled={disableTooltip}
  >
  {button}
  </Tooltip>

test/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap

@@ -229,8 +229,8 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
  class="mx_ThreadsActivityCentre_container"
  >
  <button
- aria-controls="floating-ui-35"
- aria-describedby="floating-ui-35"
+ aria-controls="floating-ui-39"
+ aria-describedby="floating-ui-39"
  aria-expanded="true"
  aria-haspopup="dialog"
  aria-label="Threads"