panResponder inside ScrollView on Android behaves differently than iOS. Android can't scroll.

[andywall66]

Description

This is a revival of: https://github.com/facebook/react-native/issues/21894 ...which was closed but is still an issue as was described.

Attached is a simple demo (updated from original) - running on the latest Expo, which is up-to-date RN - which shows this issue persisting: different behavior between ios and android when using PanResponder on a View inside a ScrollView.

Steps to reproduce

In the Snack...

Load iOS version, then:

1. Press down within the red square (which has a panResponder), wait briefly, then drag up or down, as you are intending to scroll the whole page (which is a ScrollView).
2. The panResponder receives onPanResponderMove, but soon thereafter...
3. The panResponder receives onPanResponderTerminate, so the ScrollView takes over. This is desired behavior.

Now load Android version, then:

1. Press down within the red square (which has a panResponder), wait briefly, then drag up or down, as you are intending to scroll the whole page (which is a ScrollView).
2. The panResponder receives onPanResponderMove, ...and continues to only receive this.
3. The panResponder never receives onPanResponderTerminate, and the ScrollView never scrolls. This is not desired.

React Native Version

0.79.2

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info

System:
  OS: macOS 14.4.1
  CPU: (12) x64 Apple M2 Max
  Memory: 26.11 MB / 32.00 GB
  Shell:
    version: 3.2.57
    path: /bin/sh
Binaries:
  Node:
    version: 18.18.0
    path: /usr/local/bin/node
  Yarn:
    version: 1.22.22
    path: ~/refresh/client/nativeweb/node_modules/.bin/yarn
  npm:
    version: 9.8.1
    path: /usr/local/bin/npm
  Watchman:
    version: 2023.10.30.00
    path: /usr/local/bin/watchman
Managers:
  CocoaPods: Not Found
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.4
      - iOS 17.4
      - macOS 14.4
      - tvOS 17.4
      - visionOS 1.1
      - watchOS 10.4
  Android SDK: Not Found
IDEs:
  Android Studio: 2023.3 AI-233.14808.21.2331.11842104
  Xcode:
    version: 15.3/15E204a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.11
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.79.2
    wanted: ^0.79.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Stacktrace or Logs

See snack

MANDATORY Reproducer

https://snack.expo.dev/@andywall66/fbc57d?platform=android

Screenshots and Videos

No response

[cipolleschi]

@andywall66 thanks for the issue. I forwarded the issue internally to people with more experience on Android. I'll be back here as soon as I know more.

[javache]

Can you try with with onShouldBlockNativeResponder={() => false}?

This is only supported on Android, and block native responder defaults to true on in PanResponder.

[j-piasecki]

Can you try with with onShouldBlockNativeResponder={() => false}? This is only supported on Android, and block native responder defaults to true on in PanResponder.

With this change, Android works the same as iOS:

https://github.com/user-attachments/assets/51f74354-48b7-4482-9b46-829e935c29b1

[react-native-bot]

This issue is stale because it has been open for 180 days with no activity. It will be closed in 7 days unless you comment on it or remove the "Stale" label.