[Dialog+Tooltip]: Tooltip inside `Primitive`.Title auto-opens when dialog opens

[mykola-kolomoyets]

Bug report

Current Behavior

1. Create the Dialog component has Tooltip inside Dialog.Title or Popover.Title or inside Dialog.Content/Popover.Content, but as not last element (Tooltip is between two Dialog/Popover primitives elements)
2. Open the dialog by clicking on trigger
3. DIalog opens, tooltip opens too

Expected behavior

1. Same
2. Same
3. Dialog opens, tooltip is NOT opened, and openes on focus,hover, touch only.

Reproducible example

CodeSandbox Here

Suggested solution

PR in progress

Additional context

• It happens with inside Popover too.
• Setting defaultOpen or setting open and onOpenChange by useState do not help with this issue.

Your environment

Software	Name(s)	Version
Radix Package(s)	Dialog, Popover, Tooltip	1.0.7
React	n/a	^18.2.0
Browser	Chrome	v120.0.6099.10(arm64)
Assistive tech	-	-
Node	n/a	>=16.0.0
npm/yarn	n/a	>=7.10.0
Operating System	MacOS, Windows	MacOS v14 and newer, Windows 10

[mykola-kolomoyets]

UPD: Tooltip works fine once we put the Tooltip.Root after Dialog.Close. Otherwise it will open automatically with dialog open.

[mykola-kolomoyets]

like:

Here it works fine

<Tooltip.Provider>
  <Dialog.Root>
    <Dialog.Trigger>Open dialog with tooltip</Dialog.Trigger>
    <Dialog.Content>
      <Dialog.Title>Dialog title </Dialog.Title>
      <Dialog.Description>Dialog description</Dialog.Description>
      <Dialog.Close>Close dialog</Dialog.Close>
      // Placing here ^ after Dialog.Close - it works
      <Tooltip.Root>
        <Tooltip.Trigger>Hover or Focus me</Tooltip.Trigger>
        <Tooltip.Portal>
          <Tooltip.Content sideOffset={5}>
            Nicely done!
            <Tooltip.Arrow offset={10} />
          </Tooltip.Content>
        </Tooltip.Portal>
      </Tooltip.Root>
    </Dialog.Content>
  </Dialog.Root>
</Tooltip.Provider>

Here it opens by dialog open

<Tooltip.Provider>
  <Dialog.Root>
    <Dialog.Trigger>Open dialog with tooltip</Dialog.Trigger>
    <Dialog.Content>
      <Dialog.Title>Dialog title </Dialog.Title>
      // Placing here, in middle of Dialog tags - it opens automatically
      <Tooltip.Root>
        <Tooltip.Trigger>Hover or Focus me</Tooltip.Trigger>
        <Tooltip.Portal>
          <Tooltip.Content sideOffset={5}>
            Nicely done!
            <Tooltip.Arrow offset={10} />
          </Tooltip.Content>
        </Tooltip.Portal>
      </Tooltip.Root>
      <Dialog.Description>Dialog description</Dialog.Description>
      <Dialog.Close>Close dialog</Dialog.Close>
    </Dialog.Content>
  </Dialog.Root>
</Tooltip.Provider>

[mykola-kolomoyets]

UPD: Situation i the same for HoverCard and Popover inside Dialog as well

[oyal]

I am facing the same issue.

[BennyKok]

I have the same problem, and seems like adding autoFocus tabIndex={0} somewhere so that i got the focus first fixed it

<DialogTitle autoFocus tabIndex={0}>
    Workflow Dependencies
</DialogTitle>

[benoitgrelard]

Duplicate of #2248