React-native-web: Unable to scroll vertically from an horizontal FlatList or ScrollView

[yairopro]

The problem
An horizontal FlatList completely disable the vertical scroll.

How to reproduce
Simplified test case: https://codesandbox.io/s/yvqoo5nqr9

Steps to reproduce:

1. Place an horizontal FlatList in a ScrollView.
2. Try to scroll vertically from the FlatList.
3. The ScrollView won't scroll vertically.

Expected behavior
When scrolling vertically in the FlatList, the parent ScrollView should scroll vertically.

Environment (include versions). Did this work in previous versions?

• React Native for Web (version): 0.8.8
• React (version): 16.4.1
• Browser: Chrome 67

I don't know if this work in the previous version.

[yairopro]

The same issue is for ScrollView.
If you set an horizontal ScrollView inside a vertical ScrollView, it's impossible to scroll vertically from the horizontal one.

Here's the sandbox: https://codesandbox.io/s/k3j2w7yx25

[yairopro]

And just to confirm, this is not the behavior in React Native:

• Sanbox for FlatList: https://snack.expo.io/B13QdaaXm
• Sanbox for ScrollView: https://snack.expo.io/S1VVuppXm

[yairopro]

And because FlatList uses the ScrollView as default scroll view (VirtualizedList/index 991), this push request solves the vertical scrolling for both components ScrollView & FlatList.
🎉

[yairopro]

For people looking for a workaround while this issue is still opened:
https://codesandbox.io/s/ywjqyoo3rz

[yairopro]

The same problem occurs when scrollEnabled={false}.

[ranjanrukhaya-gommt]

@necolas
Have we fixed this issue? I am still facing this issue.

[yairopro]

Not for touch scroll only

[ranjanrukhaya-gommt]

Not for touch scroll only

Any plans to cater this as well.
Please let me know if there is any work around to make it scroll.

Thanks for the prompt response.

[leotok]

@ranjanrukhaya @yairopro
I've been having the same problem here with my app, but today I managed to fix it by adding:

overscrollBehaviorY: 'auto',
touchAction: 'auto'

to the style of my <FlatList>.
It seems to work well (scroll and touch) on Chrome.

If you guys have any thoughts about this, I'd like to hear!

[km-tr]

@necolas
https://github.com/necolas/react-native-web/issues/1042#issuecomment-407157580

Related to this.
https://github.com/necolas/react-native-web/blob/74acb21aa850bcb242b0c9e77c2cef1754a19c2f/packages/react-native-web/src/exports/ScrollView/ScrollViewBase.js#L182

Is there a way around this?