Menu trigger not opening menu

[t3chguy]

Platform

• Web

Package version

• 7.6.1 (issue not present in 7.5.0)

Description

See test failures on element-hq/element-web#28708

Screen.Recording.2025-01-07.at.15.21.25.mov

[robintown]

Taking a timeboxed look at this: you can reproduce this by putting a tooltip on any menu trigger.

[robintown]

Testing with the following story:

import React, { ComponentPropsWithoutRef, forwardRef, Suspense, useState } from "react";
import { Meta, StoryObj } from "@storybook/react";
import UserProfileIcon from "@vector-im/compound-design-tokens/assets/web/icons/user-profile";

import { Menu as MenuComponent } from "./Menu";
import { MenuItem } from "./MenuItem";
import { Button } from "../Button/Button";
import { Tooltip } from "../Tooltip/Tooltip";
import { TooltipProvider } from "../Tooltip/TooltipProvider";

type Props = Omit<
  React.ComponentProps<typeof MenuComponent>,
  "open" | "onOpenChange" | "trigger" | "align" | "children"
>;

const TooltipButton = forwardRef<HTMLButtonElement, ComponentPropsWithoutRef<typeof Button>>((props, ref) => {
  return (
    <Tooltip description='This is a tooltip'>
      <Button ref={ref} {...props}>
        Open menu
      </Button>
    </Tooltip>
  )
})

const Template: React.FC<Props> = (args) => {
  const [open, setOpen] = useState(true);

  return (
    <Suspense>
    <TooltipProvider>
    <MenuComponent
      {...args}
      open={open}
      onOpenChange={setOpen}
      trigger={<TooltipButton />}
      align="start"
    >
      <MenuItem Icon={UserProfileIcon} label="Profile" onSelect={() => {}} />
    </MenuComponent>
    </TooltipProvider>
  </Suspense>
  );
};

const meta = {
  title: "Menu2",
  component: Template,
  tags: ["autodocs"],
  argTypes: {},
  args: {},
} satisfies Meta<typeof Template>;
export default meta;

type Story = StoryObj<typeof meta>;

export const WithTooltip: Story = {
  args: { title: "Today's Menu" },
}

c0589107008a1bd13f7c06c665781815579939e5 is the first bad commit
commit c0589107008a1bd13f7c06c665781815579939e5
Author: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Date:   Tue Dec 10 14:50:09 2024 +0000

    Update react monorepo to v19

 package.json |  8 ++++----
 yarn.lock    | 35 +++++++++++++++++++++++------------
 2 files changed, 27 insertions(+), 16 deletions(-)

[robintown]

Setting this aside for now. Conclusion is that something seems to be wrong with Tooltip's handling of refs post-React-19 (but why is that affecting Element Web, which is on React 18?)