Skip to content

[Bug]: Popover and DropdownMenu content is not positioned when the trigger is inside TooltipRoot #2993

Open

Description

@mansurkhoja

Environment

Developement/Production OS: macOS 26.6.2
Node version: 24.16.0
Package manager: npm@11.13.0
Reka UI version: 2.11.0 (Popover also tested on 2.0.0, 2.5.0, 2.8.0, 2.10.5; DropdownMenu on 2.0.0, 2.10.5)
Vue version: 3.5.43
Nuxt version: N/A
Nuxt mode: N/A
Nuxt target: N/A
CSS framework: N/A
Client OS: macOS 26.6.2
Browser: Chrome 148

Link to minimal reproduction

https://github.com/mansurkhoja/reka-ui-nested-popper-repro

Steps to reproduce

  1. npm install && npm run dev
  2. Click the buttons "Popover + tooltip" and "Menu + tooltip".

Describe the bug

When a PopoverTrigger or DropdownMenuTrigger is inside a TooltipRoot (to show a tooltip on the same button), the content opens but is never positioned. Its [data-reka-popper-content-wrapper] keeps transform: translate(0px, -200%), so it is above the top of the page. The same happens with PopoverAnchor, and the order of the as-child triggers does not matter.

This is the structure from "Composing multiple primitives" in the Composition guide, only with PopoverTrigger instead of DialogTrigger:

<PopoverRoot>
  <TooltipRoot>
    <TooltipTrigger as-child>
      <PopoverTrigger>Open</PopoverTrigger>
    </TooltipTrigger>
    <TooltipPortal>…</TooltipPortal>
  </TooltipRoot>
  <PopoverPortal>…</PopoverPortal>
</PopoverRoot>

All popper-based components use the same PopperRoot context, and PopperAnchor injects the nearest one. Inside TooltipRoot this is the tooltip's PopperRoot. I logged the onAnchorChange calls: the tooltip's PopperRoot gets the button from both triggers, and the popover's PopperRoot never gets an anchor.

It works when TooltipRoot is below the popover anchor, for example in a separate component inside PopoverAnchor as-child (case 4 in the reproduction).

In Radix (React), Popover and Tooltip each create their own popper scope (createPopperScope). I would like to send a PR. Would you accept a change where each component family keeps its own popper context, so that a popper of another family between the root and the trigger does not take it?

Expected behavior

The popover or menu is positioned next to the button, like without the tooltip.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions