Environment
- Operating System:
Windows 10.0.26220
- Node Version:
v24.16.0
- Nuxt Version:
4.4.6
- CLI Version:
3.35.2
- Nitro Version:
2.13.4
- Package Manager:
bun 1.3.3
- Builder:
vite 7.3.3
Is this bug related to Nuxt or Vue?
Nuxt
Package
v4.x
Version
v4.4.6
Reproduction
playground
Steps:
- Open the first
SelectMenu.
- Without clicking outside, quickly left-click the second
SelectMenu.
- The second
SelectMenu opens briefly and immediately closes.
Expected:
The first SelectMenu should close, and the second SelectMenu should remain open.
Actual:
The second SelectMenu opens briefly and immediately closes.
Additional observation:
If I press and hold the left mouse button for about 0.2 seconds or longer before releasing it, the second SelectMenu opens normally and stays open.
After successfully opening a SelectMenu by delaying the mouse release, directly clicking another SelectMenu works normally. However, after closing the dropdown and testing again from the initial closed state, the same issue happens again.
Description
Describe the bug
When there are multiple SelectMenu components on the same page, clicking another SelectMenu while one dropdown is already open causes the newly clicked SelectMenu to open and then immediately close.
This only happens when performing a quick left-click, meaning pressing and releasing the mouse button quickly.
If I press and hold the left mouse button for about 0.2 seconds or longer before releasing it, the second SelectMenu opens normally and stays open.
After successfully opening a SelectMenu by delaying the mouse release, directly clicking another SelectMenu works normally. However, after closing the dropdown and testing again from the initial closed state, the same issue happens again.
Steps to reproduce
- Open the first
SelectMenu.
- Without clicking outside, quickly left-click the second
SelectMenu by pressing and releasing the mouse button immediately.
- Observe that the second
SelectMenu opens briefly and immediately closes.
Additional observation:
If I press and hold the left mouse button on the second SelectMenu for about 0.2 seconds or longer before releasing it, the second SelectMenu opens normally and stays open.
After the dropdown is successfully opened this way, directly clicking another SelectMenu works normally. But if the dropdown is closed and the test is repeated again, the same issue occurs again.
Expected behavior
When clicking the second SelectMenu, the first dropdown should close and the second dropdown should remain open.
Actual behavior
The second SelectMenu opens briefly and immediately closes when it is clicked quickly.
If the second SelectMenu is opened successfully by delaying the mouse release, switching directly to another SelectMenu works normally afterward. However, once the dropdown is closed and the test is repeated, the issue occurs again.
Additional context
This issue can be seen in the attached GIF.
In the recording, after opening the first SelectMenu and then quickly clicking the second SelectMenu directly, the second dropdown opens briefly and immediately closes.
This issue affects forms with multiple SelectMenu fields. Users need to click outside first, click the target SelectMenu twice, or press and hold the mouse button briefly before releasing it.
After successfully opening a SelectMenu by delaying the mouse release, directly clicking another SelectMenu works normally. However, after closing the dropdown and testing again from the initial closed state, the same issue happens again.
I also added a small measurement in the reproduction to show the time between pointerdown and pointerup. The issue only appears when this duration is very short.
Logs
Environment
Windows 10.0.26220v24.16.04.4.63.35.22.13.4bun 1.3.3vite 7.3.3Is this bug related to Nuxt or Vue?
Nuxt
Package
v4.x
Version
v4.4.6
Reproduction
playground
Steps:
SelectMenu.SelectMenu.SelectMenuopens briefly and immediately closes.Expected:
The first
SelectMenushould close, and the secondSelectMenushould remain open.Actual:
The second
SelectMenuopens briefly and immediately closes.Additional observation:
If I press and hold the left mouse button for about 0.2 seconds or longer before releasing it, the second
SelectMenuopens normally and stays open.After successfully opening a
SelectMenuby delaying the mouse release, directly clicking anotherSelectMenuworks normally. However, after closing the dropdown and testing again from the initial closed state, the same issue happens again.Description
Describe the bug
When there are multiple
SelectMenucomponents on the same page, clicking anotherSelectMenuwhile one dropdown is already open causes the newly clickedSelectMenuto open and then immediately close.This only happens when performing a quick left-click, meaning pressing and releasing the mouse button quickly.
If I press and hold the left mouse button for about 0.2 seconds or longer before releasing it, the second
SelectMenuopens normally and stays open.After successfully opening a
SelectMenuby delaying the mouse release, directly clicking anotherSelectMenuworks normally. However, after closing the dropdown and testing again from the initial closed state, the same issue happens again.Steps to reproduce
SelectMenu.SelectMenuby pressing and releasing the mouse button immediately.SelectMenuopens briefly and immediately closes.Additional observation:
If I press and hold the left mouse button on the second
SelectMenufor about 0.2 seconds or longer before releasing it, the secondSelectMenuopens normally and stays open.After the dropdown is successfully opened this way, directly clicking another
SelectMenuworks normally. But if the dropdown is closed and the test is repeated again, the same issue occurs again.Expected behavior
When clicking the second
SelectMenu, the first dropdown should close and the second dropdown should remain open.Actual behavior
The second
SelectMenuopens briefly and immediately closes when it is clicked quickly.If the second
SelectMenuis opened successfully by delaying the mouse release, switching directly to anotherSelectMenuworks normally afterward. However, once the dropdown is closed and the test is repeated, the issue occurs again.Additional context
This issue can be seen in the attached GIF.
In the recording, after opening the first
SelectMenuand then quickly clicking the secondSelectMenudirectly, the second dropdown opens briefly and immediately closes.This issue affects forms with multiple
SelectMenufields. Users need to click outside first, click the targetSelectMenutwice, or press and hold the mouse button briefly before releasing it.After successfully opening a
SelectMenuby delaying the mouse release, directly clicking anotherSelectMenuworks normally. However, after closing the dropdown and testing again from the initial closed state, the same issue happens again.I also added a small measurement in the reproduction to show the time between
pointerdownandpointerup. The issue only appears when this duration is very short.Logs