Different behaviour on Android and iOS in bottom sheet

[IslamRustamov]

Bug description:

Let's say that I have a bottom sheet (gorhom-bottom-sheet) that has a WebView inside of it. I am able to scroll this webview up and down. But, when I am at top of the webview's content (scrolled to the top of the website) I want to be able to pan down to close the bottom sheet.

This works as expected on iOS, however it doesn't work on Android.

To Reproduce:

Code example:

import React, { useCallback, useRef } from 'react';
import { StyleSheet } from 'react-native';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import BottomSheet, {
  BottomSheetScrollView,
} from '@gorhom/bottom-sheet';
import { WebView } from 'react-native-webview';

export default function App() {
  const bottomSheetRef = useRef<BottomSheet>(null);

  const handleScroll = useCallback(event => {
    console.log("I scrolled yay")
  }, []);

  return (
    <GestureHandlerRootView style={styles.container}>
      <BottomSheet
        enablePanDownToClose
        snapPoints={['90%']}
        ref={bottomSheetRef}
        enableDynamicSizing={false}
      >
        <BottomSheetScrollView
          contentContainerStyle={{ flex: 1 }}
          style={styles.contentContainer}
        >
          <WebView
            onScroll={handleScroll}
            source={{ uri: 'https://afina.app/landing-test' }}
            nestedScrollEnabled
            style={{ flex: 1 }}
          />
        </BottomSheetScrollView>
      </BottomSheet>
    </GestureHandlerRootView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'grey',
  },
  contentContainer: {
    flex: 1,
    backgroundColor: 'red',
  },
});

Expected behavior:

I am expecting the same behaviour on iOS and Android. So that I can pan down to close the bottom sheet if I am on top of the webview

Screenshots/Videos: How it works on iOS (correct, we can close the bottom sheet when we are at the top of the webview):

https://github.com/user-attachments/assets/b8b9bb88-ce38-46db-a821-4e70716f8a09

How it works on Android (incorrect, we can't close the bottom sheet when we are at the top of the webview):

https://github.com/user-attachments/assets/a9ab5624-aee9-4218-b764-333f9b820f23

Environment:

• OS: iOS and Android
• OS version: tested on several iOS and Android versions
• react-native version: 0.80.2
• react-native-webview version: 13.16.0

NOTE: I might be wrong for posting this issue here since the problem might be in the bottom sheet library, but any feedback would be welcome

[Brma1048]

@IslamRustamov Maybe try to disable overScrollMode

[github-actions[bot]]

Hello 👋, this issue has been opened for more than 2 months with no activity on it. If the issue is still here, please keep in mind that we need community support and help to fix it! Just comment something like still searching for solutions and if you found one, please open a pull request! You have 7 days until this gets closed automatically