TouchableHighlights appear overly sensitive

[ThomasRedstone]

What is the current behavior?

When scrolling in Chrome on Android, it's very easy to mis-click a TouchableHighlight.

Link to minimal test case: https://pastebin.com/Nrb0ZLAu

What is the expected behaviour?

Touching a TouchableHighlight requires a more deliberate action (with some period of pressing without moving required).

Steps to reproduce

1. Swipe clumsily on a mobile device.
2. Have touch even triggered.

Environment (include versions)

OS: Android
Device: Galaxy S7
Browser: Android
React Native for Web (version): 0.0.68
React (version): 15.4.1

[necolas]

Are you saying this is more sensitive than it is in React Native? If not, there are press delay props: http://facebook.github.io/react-native/releases/0.40/docs/touchablewithoutfeedback.html#delaypressin

[necolas]

Closing due to no follow up.

[wjielim]

Hi there, I have a similar problem. The touchables are too sensitive -- by this I mean the button onPress function is triggered by just doing a swiping gesture on the button, which is unintentional when trying to scroll down a web page. This can be reproduced by simply attempting to scroll down web page by swiping on the touchable on a mobile browser.

[necolas]

To prevent that you should put your app in a scroll view

[dennishansen]

Hi @necolas, is there a way to fix this without using a react-native-web scroll view? I'm asking because we are using react-native-web components from an external library and do not have react-native-web as an explicit dependency in our project.

[necolas]

You can look through this issue for ideas, but realistically you need to be using ScrollView I'm afraid. I'm starting to explore options but this is tied to the event systems in React, which are being rewritten in both React DOM and React Native.

[tafelito]

@necolas what do you mean by wrapping the app in a scrollview? I'm using a FlatList and I'm still having this issue.

I wrapped all my App component inside a ScrollView and nothing changed. Is there any workaround for this?