fix(Popover/Dropdown): prevent unintended closure on touchstart in mobile devices #1609
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🔗 Linked issue
A previous PR #1520 changed the event listener from @touchstart.prevent to @touchstart.passive to improve performance on mobile devices. This change introduced an unintended side effect where popovers and dropdowns unintentionally close on touch interaction.
❓ Type of change
📚 Description
This pull request addresses a bug where both popover and dropdown components would unintentionally close on touch interaction (specifically the @touchstart.passive event) on mobile devices. This behavior did not occur on desktops.
While a previous change aimed to improve mobile performance by switching to @touchstart.passive, it caused this unintended side effect.
The fix introduces a check for the event.cancelable property before closing the component. This ensures the component only closes on intentional touch interactions.
Benefits:
Maintains the performance improvement introduced by the previous change.
Improves user experience on touch devices by preventing accidental closure of popovers and dropdowns.
Resource:
Easy fix for: '[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false'
📝 Checklist