NavigationMenu: Pointer enter/leave issues in Firefox

[Blackwidow-sudo]

Describe the bug

It appears that in firefox the NavigationMenu component has issues opening the menu dropdowns when moving the cursor between two navbar items.

A friend of mine couldn't reproduce the bug in Chrome and i also cant reproduce it in Edge, so it seems to be a Firefox specific issue.

You can reproduce this with the example on the docs

It might take a few tries and it doesn't seem to occur when you're doing it too fast.

cut.mp4

Reproduction

https://www.bits-ui.com/docs/components/navigation-menu

Logs

Nothing in the console

System Info

Browser:
  Firefox 140.0.1 (64-Bit)
System:
    OS: Windows 10 Pro Build 19045.5965
    CPU: (16) x64 AMD Ryzen 7 7700X 8-Core Processor
    Memory: 14.52 GB / 15.17 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
Binaries:
    Node: 22.13.1 - ~/.local/share/pnpm/node
    npm: 10.9.2 - ~/.local/share/pnpm/npm
    pnpm: 10.0.0 - ~/.local/share/pnpm/pnpm

Severity

annoyance

[genericFJS]

I have similar issues with the "Popover" component.
This is reproducible in the Date Picker from shadcn-svelte https://shadcn-svelte.com/docs/components/date-picker and can be provoked by clicking on the trigger-button on an ~500ms interval.
In my app this occurs even when not clicking so frequently - sometimes on the first click. IMO this elevates the bug severity.

Untitled.video.mp4

A quick-and-dirty workaround for me was to "force" the popover to be open using setTimeout in the onOpenChange function of the Popover.Root:

function onOpenChange(value: boolean) {
	if (value) {
		setTimeout(() => {
			open = true;
		});
	}
}

Obviously this is just a workaround which has ugly animation side effects.

[huntabyte]

What browser are you working with @genericFJS?

[genericFJS]

  Browsers:
    Firefox 141.0 (64-Bit)
  System:
    OS: Windows 11 10.0.26100
    CPU: (16) x64 AMD Ryzen 7 5700X 8-Core Processor
    Memory: 12.47 GB / 31.93 GB

[huntabyte]

Thank you. Definitely a bug and should not be happening! I will try to find some time this week/end to investigate, but it seems to be firefox-specific, likely differences in event/focus behaviors.

[Lexikus]

There seem to be general problems with Firefox. We are also experiencing issues with the collapsible component, where a single click triggers it twice, causing it to open and immediately close. It works fine in Chrome. I'm not sure if a recent Firefox update introduced these issues, as it used to work perfectly before. Just wanted to notify you that there might be other problems related to Firefox.

[Blackwidow-sudo]

I have similar issues with the "Popover" component. This is reproducible in the Date Picker from shadcn-svelte https://shadcn-svelte.com/docs/components/date-picker and can be provoked by clicking on the trigger-button on an ~500ms interval. In my app this occurs even when not clicking so frequently - sometimes on the first click. IMO this elevates the bug severity.
Untitled.video.mp4

A quick-and-dirty workaround for me was to "force" the popover to be open using setTimeout in the onOpenChange function of the Popover.Root:

function onOpenChange(value: boolean) {
if (value) {
setTimeout(() => {
open = true;
});
}
}

Obviously this is just a workaround which has ugly animation side effects.

I also just found another bug with the DatePicker. It sometimes skips months. Idk if its browser specific yet.

[radiantwave]

What Svelte version are you all running?

Is this issue maybe already fixed? sveltejs/svelte#16527

[Blackwidow-sudo]

What Svelte version are you all running?

Is this issue maybe already fixed? sveltejs/svelte#16527

I just updated to svelte 5.38.6 and the issue still occurs. But good to know that there is actually a bug in Firefox that might be related.