Skip to content

Commit

Permalink
Pressable: disable click bubbling in Pressable (#37542)
Browse files Browse the repository at this point in the history
Summary:
Pull Request resolved: #37542

Changelog: [General] [Changed] - Pressable: prevent click bubbling in Pressable

This diff modifies pressability such that `onClick` events for pressables will only result in `onPress` being called when the pressable in question is both the `target` and the `currentTarget` for the event.

This is only really relevant for nested pressables, where `click` received by the inner pressable may bubble up to the parent pressable (this change effectively prevents that from happening). A future change will update the click event on Android to be bubbling (currently its a direct event); this change will reduce the possibility of breakages from that change.

Reviewed By: vincentriemer

Differential Revision: D46081810

fbshipit-source-id: ed38ee30061e7160ab90305f85367fc095301025
  • Loading branch information
Alex Danoff authored and facebook-github-bot committed May 24, 2023
1 parent 6b33e75 commit d6d5712
Showing 1 changed file with 7 additions and 0 deletions.
7 changes: 7 additions & 0 deletions packages/react-native/Libraries/Pressability/Pressability.js
Original file line number Diff line number Diff line change
Expand Up @@ -553,6 +553,13 @@ export default class Pressability {
return;
}

// for non-pointer click events (e.g. accessibility clicks), we should only dispatch when we're the "real" target
// in particular, we shouldn't respond to clicks from nested pressables
if (event?.currentTarget !== event?.target) {
event?.stopPropagation();
return;
}

const {onPress, disabled} = this._config;
if (onPress != null && disabled !== true) {
onPress(event);
Expand Down

0 comments on commit d6d5712

Please sign in to comment.