Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Overlay Components : hide on click outside does not work if clicked element have a stopPropagation #7234

Open
4 tasks
mehdirande opened this issue Feb 11, 2025 · 0 comments · May be fixed by #7233
Open
4 tasks
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible

Comments

@mehdirande
Copy link

Describe the bug

In PrimeVue some components that have an overlay (such as Popup, Select, Menu, etc.), the overlay is expected to hide when clicking outside the component.
However, if the click event is triggered on an element that has a stopPropagation applied, either directly on the element or on one of its parent elements, the overlay does not hide on a click outside. This issue prevents proper behavior of the overlay, as the stopPropagation interrupts the outside click event from being recognized by the document.

I’m not sure if this is a bug or an edge case, but this configuration seems fairly common, so I’m opening this issue.

Pull Request Link

#7233

Reason for not contributing a PR

  • Lack of time
  • Unsure how to implement the fix/feature
  • Difficulty understanding the codebase
  • Other

Other Reason

No response

Reproducer

https://stackblitz.com/edit/primevue-4-vite-issue-template-fovhrzsq

Environment

Any environnement

Vue version

3.5.0

PrimeVue version

4.2.5

Node version

No response

Browser(s)

No response

Steps to reproduce the behavior

  1. Click on "Dropdown 1"
  2. Menu1 is shown
  3. Click on "Dropdown 2"
  4. Menu2 is shown but Menu1 is not hidden

Expected behavior

When Menu2 is shown, Menu1 should be hidden

@mehdirande mehdirande added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Feb 11, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant