React-native-picker-select: Android: Picker not responding to touch correctly inside Touchable

[deansimcox]

Describe the bug

Under certain conditions on physical Android devices, tapping on <RNPickerSelect /> does not always trigger the dialog menu to show.
The root cause of this issue appears to be rendering a <Picker /> inside of a <TouchableOpacity />
More info: https://github.com/facebook/react-native/issues/25203

To Reproduce

Steps to reproduce the behavior:

1. Render a <RNPickerSelect /> with children
2. 'react-native-picker-select' then renders using renderAndroidHeadless()
3. On a physical android device, tap the rendered <RNPickerSelect />
4. Observe if this opens up the picker
5. Repeat steps 3 and 4, 20 times
6. Observe that the picker has not opened 20 times

Expected behavior

After tapping a <RNPickerSelect /> 20 times, the picker should have also opened 20 times.

Screenshots

"n/a".

Additional details

• Device: OnePlus 5T
• OS: Android 9
• react-native-picker-select version: 6.6.0
• react-native version: 0.62.2
• expo sdk version: n/a

Reproduction and/or code sample

https://snack.expo.io/@deansimcox/brave-cashew
_Note: Please make sure you run this expo snack on an actual android device, the issue is not present when using the Android view on expo._

[naveen1601]

I am facing the same issue. Is there any solution of this? It is becoming critical for me, lots of users are complaining about this.

[deansimcox]

Making this change (https://github.com/lawnstarter/react-native-picker-select/pull/355/commits/331824c577575e70b473c8194f779984c90df742) should fix it, however this would also remove the touchable opacity feedback, so that might not be desirable.

[naveen1601]

Thanks @deansimcox. It worked 👍

[lfkwtz]

@deansimcox any chance this is related to #237 ?

[MrtYlnzz]

This is a similar issue with me and 331824c solves it. Any chance this will be solved in upcoming versions?

[neiker]

Should be nice to release a new version with this fix

[lfkwtz]

don't want to make a breaking change quite yet, so fixed with a conditional flag in 8.0.2

worth investigating how the new Pressable component reacts to this vs the bug found with TouchableOpacity

[oli-laban]

@lfkwtz Pressable unfortunately seems to have the same issue.

Showing feedback on press is quite important and we can't even implement our own animation as <Picker> doesn't provide a callback on open.

[johnlund]

fixAndroidTouchableBug={true} seems to solve this for me.

[thethirdship]

On android it would intermittently not respond to the user's touch. Originally, I wasn't sure if it was my layout, or I was doing something else to lock the app.

After setting this prop on version 8.0.3, fixAndroidTouchableBug={true}, it is firing consistently. Thank you!!!

For me if I had to choose whether to have feedback or consistently have the dialog come out on press, I choose the dialog.

Is the breaking change only for older versions of the package, older androids, or people expecting a feedback???