[Pressable] pointerEvents "box-only" and "box-none" broken #3904
Description
Description
Only iOS is affected, Android and Web look to be fine.
box-only
<Pressable
style={{ width: 100, height: 80, backgroundColor: 'red' }}
onPress={() => Alert.alert('outer')}
pointerEvents="box-only"
>
<Pressable
style={{ width: 50, height: 50, backgroundColor: 'green' }}
onPress={() => Alert.alert('inner')}
/>
</Pressable>Expected result: clicking on the inner alerts "outer", clicking on the outer alerts "outer"
Actual result: clicking on the inner alerts nothing, clicking on the outer alerts nothing
box-none
<Pressable
style={{ width: 100, height: 80, backgroundColor: 'red' }}
onPress={() => Alert.alert('outer')}
pointerEvents="box-none"
>
<Pressable
style={{ width: 50, height: 50, backgroundColor: 'green' }}
onPress={() => Alert.alert('inner')}
/>
</Pressable>Expected result: clicking on the inner alerts "inner", clicking on the outer alerts nothing
Actual result: clicking on the inner alerts "inner", clicking on the outer alerts"outer"
Steps to reproduce
In the description
A link to a Gist, an Expo Snack or a link to a repository based on this template that reproduces the bug.
n/a
Gesture Handler version
2.30.0
Also reproducible on 2.28.0
React Native version
0.82.0
Platforms
Web, iOS
JavaScript runtime
None
Workflow
None
Architecture
New Architecture (Fabric)
Build type
None
Device
None
Device model
No response
Acknowledgements
Yes