We have a dropdown inside of a <a tag. We placed the dropdown inside of a <span so that we could capture the onClick event and call event.preventDefault() (and event.stopPropagation()) to stop the default behavior of navigating to the URL in the <a tag. However, in primereact 10.8.4, event.stopPropagation() was added to the click handler in the dropdown. Now, the click handler in our <span no longer receives the event, so can no longer call event.preventDefault().
I think the best solution is to also call event.preventDefault() within the dropdown onClick handler. I will submit a PR to that effect.
I have include a stackblitz below. Unfortunately, the problem does not manifest itself while running in stackblitz. However, if you download it and run it locally in Chrome, you will see that clicking on the dropdown navigates to google.com.
The dropdown prevents the default onClick behavior as well as stopping the propagation. It seems that any user would expect the dropdown to handle the click. The alternative is for the dropdown to NOT stop propagation, and individual projects would be responsible for stopping propagation as needed.
Describe the bug
We have a dropdown inside of a
<a
tag. We placed the dropdown inside of a<span
so that we could capture the onClick event and callevent.preventDefault()
(andevent.stopPropagation()
) to stop the default behavior of navigating to the URL in the<a
tag. However, in primereact 10.8.4,event.stopPropagation()
was added to the click handler in the dropdown. Now, the click handler in our<span
no longer receives the event, so can no longer callevent.preventDefault()
.I think the best solution is to also call
event.preventDefault()
within the dropdown onClick handler. I will submit a PR to that effect.I have include a stackblitz below. Unfortunately, the problem does not manifest itself while running in stackblitz. However, if you download it and run it locally in Chrome, you will see that clicking on the dropdown navigates to google.com.
Reproducer
https://stackblitz.com/edit/vitejs-vite-hizbrv?file=src%2FApp.tsx
System Information
Steps to reproduce the behavior
Expected behavior
The dropdown prevents the default onClick behavior as well as stopping the propagation. It seems that any user would expect the dropdown to handle the click. The alternative is for the dropdown to NOT stop propagation, and individual projects would be responsible for stopping propagation as needed.