hitSlop does not work inside in stack header

[alexandernanberg]

Description

hitSlop does not work as expected in a Stack header

Screen.Recording.2023-12-02.at.08.16.39.mov

Steps to reproduce

1. Add a <Pressable> to either headerLeft or headerRight
2. Set a hitSlop
3. Try to press on the hitSlop area and see the onPress cb isn't called

Snack or a link to a repository

https://github.com/alexandernanberg/react-native-screens-repro

Screens version

3.22.1

React Native version

0.72.6

Platforms

Android, iOS

JavaScript runtime

Hermes

Workflow

Expo managed workflow

Architecture

Fabric (New Architecture)

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

[kkafar]

Yeah, I can confirm the issue, thanks for reporting

[thomasttvo]

seeing this as well on native-stack navigation, @kkafar any idea how we can patch the library for a fix?

[kkafar]

@thomasttvo, checkout this PR: #1995

[otariterterashvili]

I have react-native-screens~3.29.0 and this issue still fired, any idea how to fix @kkafar

[hirbod]

I can confirm that hitSlop indeed doesn't work in v4.4.0

[thomasttvo]

This works for our team on 3.32.0. Perhaps the fix needs to be merged into v4.

[kkafar]

Pressables on Fabric were a subject of different issue. #2466 is supposed to fix that => this should longer be no problem since 4.6.0-beta.0 release (just released). Let me know in case you still encounter this issue.