Touchable components stop responding randomly #36710

vrgimael · 2023-03-29T23:04:55Z

Description

We've been experiencing this issue in a couple of our apps, it's kinda driving us mad.

Basically, sometimes, completely unpredictably the touchable areas just stop responding.

We tried reproducing this consistently in several different ways but just couldn't pin point what causes it to happen and in which devices. It happens on both iOS and Android, and also in debug or release mode. Generally, it looks like it only happens after the user has been using the app for a little while (10+ minutes). It seems to happen in any button in the app randomly, and some times it also seemingly randomly starts working again. Closing and opening the app again always fixes the problem.

We had clients complain about it in quite a few occasion, but some of our public testers rarely ever experience this either which makes it even harder to understand.

I spent a very long time investigating it over literally the past entire year, but it's really really hard to debug, because when the issue happens in debug mode, anything you do in the code that causes hot reloading actually "fixes it", making it almost impossible to investigate.

I have added lots of debugging tools to try and understand what happens though, I got a few bits of information that might be able to help.

This is not a performance or execution queue issue, as we have other interactive components in the screen that update automatically based on time and these never freeze.
Other touch based components seem to continue working like scrolls or maps.
The zindex of the buttons I'm trying to interact with is much greater than anything else in the screen.
I have tried swapping out our "button" component's touchable with react-native-gesture-handler's, but the issue still persists.
This has been going for several different versions of RN and none resolved.
When the issue happens, the onPressIn and onPressOut events are fired almost simultaneously with only a few milliseconds difference but onPress is not fired - kinda like what happens when you're scrolling or actually interacting with another gesture handler. I tried to make a fallback mechanism that uses this behaviour to our advantage but it's outcome is not very consistent for a few different reasons.
Surprisingly (and this is what makes me think it's an issue with RN and not our code), when this issue happens and you manage to open the RN inspect menu by shaking the device, the tabs in the menu (Inspect, Perf, Network, Touchables) don't even work, exactly the same behaviour observed with our own buttons in the app.
It might be out of pure coincidence, but I have only seen this happen in apps that use react-native-maps - one of my hypothesis is that the gesture responder somehow gets confused with the map handler.

As far as I can tell, this has always happened - it's so rare that I was not very bothered by it. But as our apps grow and have a larger userbase now, this issue is coming up more frequently and we need to figure it out some time soon.
I suspect this is not too much of a problem in other apps because normally if a problem like this happens you'd just reopen the app and everything is fine again. However, it has already caused bad reviews in the App Store because our app's functionality is really time sensitive and if users aren't able to interact with the screen it's kinda problematic.

I've read all issues related to several relevant keywords in this repo (like touchable, onpressin, not responding, etc...), and there are a few issues that mention similar behaviour #34999 #36063 but none have barely any responses (possibly due to the rare nature of the problem).

Any help would be really appreciated. Please let me know if I can provide any other useful information.

Thanks

React Native Version

0.70.6

Output of `npx react-native info`

System:
OS: macOS 13.2.1
CPU: (10) arm64 Apple M1 Max
Memory: 192.88 MB / 32.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.13.0 - ~/.nvm/versions/node/v16.13.0/bin/node
Yarn: 1.19.1 - ~/.yarn/bin/yarn
npm: 7.24.2 - ~/CodeLeap-Software/Client-Projects/x-follo-mobile/mobile/node_modules/.bin/npm
Watchman: 2022.07.04.00 - /opt/homebrew/bin/watchman
Managers:
CocoaPods: 1.11.3 - /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1
Android SDK:
API Levels: 26, 28, 29, 30, 31, 33
Build Tools: 28.0.3, 29.0.2, 30.0.2, 30.0.3, 31.0.0, 32.0.0, 33.0.0
System Images: android-30 | Google Play ARM 64 v8a, android-31 | ARM 64 v8a, android-31 | Google APIs ARM 64 v8a, android-31 | Google Play ARM 64 v8a, android-Sv2 | Google APIs ARM 64 v8a, android-Sv2 | Google Play ARM 64 v8a
Android NDK: 22.1.7171670
IDEs:
Android Studio: 2020.3 AI-203.7717.56.2031.7784292
Xcode: 14.2/14C18 - /usr/bin/xcodebuild
Languages:
Java: 11.0.13 - /Users/victor/Library/Java/JavaVirtualMachines/azul-11.0.13/Contents/Home/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: ^18.2.0 => 18.2.0
react-native: ^0.70.6 => 0.70.7
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

The hardest thing about this is that it can't be reliably reproduced. See description above.

Snack, code example, screenshot, or link to a repository

Example in our own app (that's in the App Stores too), a client sent us this recording of it happening in practice. Looking back now I should have taken more recordings of it but I'm not sure it would be of any use too.

Screen_Recording_20230219_103121_Becon.mp4

EDIT 30/05/23 -> Here are the dependencies for this project:

  "dependencies": {
    "@babel/plugin-proposal-export-namespace-from": "^7.18.9",
    "@babel/runtime": "^7.14.6",
    "@faker-js/faker": "^7.3.0",
    "@googlemaps/polyline-codec": "^1.0.1",
    "@invertase/react-native-apple-authentication": "^2.2.2",
    "@miblanchard/react-native-slider": "^2.3.1",
    "@react-native-async-storage/async-storage": "~1.17.3",
    "@react-native-community/netinfo": "^9.3.6",
    "@react-native-community/push-notification-ios": "^1.10.1",
    "@react-native-firebase/analytics": "^15.2.0",
    "@react-native-firebase/app": "^15.2.0",
    "@react-native-firebase/auth": "^15.2.0",
    "@react-native-firebase/crashlytics": "^15.2.0",
    "@react-native-firebase/messaging": "^15.2.0",
    "@react-native-google-signin/google-signin": "^8.0.0",
    "@react-native-masked-view/masked-view": "^0.2.8",
    "@react-navigation/bottom-tabs": "^6.3.2",
    "@react-navigation/native": "^6.0.11",
    "@react-navigation/stack": "^6.2.2",
    "@sentry/react-native": "^3.1.1",
    "callsites": "^3.1.0",
    "date-fns": "^2.29.2",
    "deep-equal": "^2.0.5",
    "deep-object-diff": "^1.1.9",
    "deprecated-react-native-prop-types": "^2.3.0",
    "expo": "^48.0.6",
    "expo-av": "^13.0.2",
    "expo-battery": "^7.0.0",
    "expo-cellular": "^5.0.1",
    "expo-constants": "^14.0.2",
    "expo-keep-awake": "^11.0.1",
    "expo-linear-gradient": "^12.1.2",
    "expo-linking": "^3.2.3",
    "expo-local-authentication": "^13.0.2",
    "expo-location": "^15.0.1",
    "expo-network": "^5.0.0",
    "expo-sensors": "^12.0.1",
    "expo-store-review": "^6.0.0",
    "expo-task-manager": "^11.0.1",
    "faker": "^5.5.3",
    "fs": "0.0.1-security",
    "geolocation-utils": "^1.2.5",
    "libphonenumber-js": "^1.9.25",
    "lodash": "^4.17.21",
    "lottie-ios": "3.4.1",
    "lottie-react-native": "5.1.3",
    "moment": "^2.29.1",
    "npm": "^7.18.1",
    "npm-license-crawler": "^0.2.1",
    "patch-package": "^6.4.7",
    "path": "^0.12.7",
    "pretty-bytes": "^5.6.0",
    "react": "^18.2.0",
    "react-mixin": "^5.0.0",
    "react-native": "^0.70.6",
    "react-native-android-open-settings": "^1.3.0",
    "react-native-animatable": "^1.3.3",
    "react-native-background-timer": "^2.4.1",
    "react-native-contacts": "^7.0.4",
    "react-native-date-picker": "^4.2.5",
    "react-native-device-info": "^10.3.0",
    "react-native-fbsdk-next": "^10.0.0",
    "react-native-flipper": "0.163.0",
    "react-native-geocoding": "^0.5.0",
    "react-native-geolocation-service": "^5.3.0-beta.1",
    "react-native-gesture-handler": "^2.8.0",
    "react-native-get-random-values": "^1.8.0",
    "react-native-google-mobile-ads": "^9.1.1",
    "react-native-google-places-autocomplete": "^2.5.1",
    "react-native-gradle-plugin": "^0.70.0",
    "react-native-iap": "^12.7.2",
    "react-native-image-crop-picker": "^0.38.0",
    "react-native-in-app-review": "^4.3.1",
    "react-native-in-app-utils": "^6.1.0",
    "react-native-keyboard-aware-scroll-view": "^0.9.5",
    "react-native-localize": "^2.2.2",
    "react-native-maps": "^1.3.2",
    "react-native-notification-sounds": "^0.5.5",
    "react-native-onesignal": "^4.5.1",
    "react-native-permissions": "^3.6.0",
    "react-native-pose": "^0.9.1",
    "react-native-push-notification": "^8.1.1",
    "react-native-render-html": "^6.3.4",
    "react-native-ringer-mode": "^2.0.0",
    "react-native-safe-area-context": "^4.3.1",
    "react-native-screens": "^3.15.0",
    "react-native-splash-screen": "^3.3.0",
    "react-native-svg": "^13.4.0",
    "react-native-system-navigation-bar": "^1.0.5",
    "react-native-system-setting": "^1.7.6",
    "react-native-vector-icons": "^9.2.0",
    "react-redux": "^8.0.2",
    "react-timer-hook": "^3.0.5",
    "react-timer-mixin": "^0.13.4",
    "react-use": "^17.4.0",
    "redux": "^4.2.0",
    "redux-flipper": "^2.0.2",
    "redux-middleware-flipper": "^1.0.9",
    "redux-sentry-middleware": "^0.2.2",
    "redux-thunk": "^2.4.1",
    "rn-async-storage-flipper": "^0.0.10",
    "rn-emoji-keyboard": "^1.0.0",
    "rn-sliding-up-panel": "^2.4.6",
    "url-parse": "^1.5.10",
    "uuid": "^8.3.2",
    "validator": "^13.7.0"
  },

The text was updated successfully, but these errors were encountered:

github-actions · 2023-03-29T23:05:15Z

⚠️	Newer Version of React Native is Available!
ℹ️	You are on a supported minor version, but it looks like there's a newer patch available. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases.

necolas · 2023-03-30T20:53:25Z

I think it will be difficult to get attention from the maintainers without a) providing a test case, b) steps to reproduce the issue in the test case, and c) verifying the issue is still present after upgrading to the latest version of React Native

vrgimael · 2023-03-30T20:58:57Z

Hi @necolas thanks for the feedback, however you really should not close this issue..... other users have mentioned similar problems, please do not ignore this issue just because it happens intermittently.

a) As I said, the problem cannot be reliably reproduced at all
b) The problem happens intermittently
c) This has been happening through several previous versions of RN... I will upgrade again but this certainly is not the problem.

I provided as much information as I could possibly gather from this and hoped it could be helpful to others too.

necolas · 2023-03-30T21:02:39Z

Hey. I'm not ignoring it, I'm telling you what this issue needs before engineers at Meta can spent time looking into it.

github-actions · 2023-03-30T23:26:49Z

⚠️	Missing Reproducible Example
ℹ️	It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner.

etodanik · 2023-04-26T23:02:47Z

For what its' worth, I'm also experiencing it, and it's very hard to understand how to give a reproducible example - because it doesn't happen reliably. But in an intermittent fashion onPress just won't fire for a bunch of times in a row.

I am also using maps.

NiuGuohui · 2023-04-27T09:20:42Z

I can provide a case:

<View
      style={{ width: 100, height: 100, backgroundColor: '#F00' }}
      onTouchStart={() => {
        console.log('start');
      }}
    >
      <TouchableHighlight
        style={{ flex: 1 }}
        underlayColor="#000"
        onPress={() => {
          console.log(123);
        }}
      >
        <View style={{ width: '100%', height: '100%', flexDirection: 'row', alignItems: 'center' }}>
          <Text>12323</Text>
        </View>
      </TouchableHighlight>
    </View>

Try clicking on the right part of the red area.
UI responds but does not trigger onPress event.
His parent element View triggered the onTouchStart event.
I am using 0.72.0-rc.1 for Android.

It worked normally when I disabled the new architecture!

etodanik · 2023-04-27T14:26:33Z

@necolas looks like we have a reproducible example :)

vrgimael · 2023-04-27T20:12:49Z

Hmm I am not using the new architecture though, and this problem seems to have happened for a long time (before new architecture existed).

We tried this example on our project and it doesn't reproduce the issue unfortunately...

Any thoughts would be appreciated.

NiuGuohui · 2023-04-28T01:26:03Z

Hmm I am not using the new architecture though, and this problem seems to have happened for a long time (before new architecture existed).

We tried this example on our project and it doesn't reproduce the issue unfortunately...

Any thoughts would be appreciated.

Sorry, this is my problem.This is a bug in react-native-screens.

Nantris · 2023-04-28T02:08:53Z

This is a bug in react-native-screens.

@NiuGuohui can you please share a link to that issue (if there is one) for future readers?

NiuGuohui · 2023-04-28T03:47:39Z

This is a bug in react-native-screens.

@NiuGuohui can you please share a link to that issue (if there is one) for future readers?

In my case, I want to achieve a similar effect to iOS's UITableView (such as horizontally laid out tabs). When I use this pattern nested in a native-stack, I encounter a similar issue. I think this might be a minor issue with the react-native-screens library. see here
Here is my code (in a native-stack screen):

<View style={{ flexDirection: 'row', height: '100%' }}>
  // this is real tabBar component
  <View style={{ width: 60, height: '100%' }} />
  <Tab.Navigator
    initialRouteName="One"
    sceneContainerStyle={{ flex: 1 }}
    screenOptions={{ headerShown: false }}
   // mock a empty tabBar
    tabBar={props => null}
  >
    <Tab.Screen name="One" component={One} />
  </Tab.Navigator>
</View>

etodanik · 2023-05-04T14:46:35Z

I am using expo-router which I don't think is using react-native-screens and getting the exact same behavior. So it seems like a bug that transcends just one library?

@necolas would be very nice if someone from contributors acknowledges the existence of this, because it makes the app I'm working on have quite degraded UX. You've had a few reports here already?

vrgimael · 2023-05-30T10:34:17Z

We are experiencing this problem in some of our other apps too, this time with no map component mounted whatsoever (disproving my theory above).

User is unable to interact with any touchable component, but the app is clearly not frozen and scroll gestures work fine.

Closing and reopening the app mysteriously fixes the problem.

test.mp4

I'm surprised there aren't many more people complaining about this issue, it certainly happens in many other cases. I can only assume people reopen the app without thinking about it much.

Here are the dependencies for the project:

"dependencies": {
    "@codeleap/common": "*",
    "@codeleap/config": "*",
    "@codeleap/mobile": "*",
    "@faker-js/faker": "6.3.1",
    "@googlemaps/polyline-codec": "^1.0.28",
    "@gorhom/bottom-sheet": "^4.4.5",
    "@gorhom/portal": "1.0.14",
    "@invertase/react-native-apple-authentication": "^2.2.2",
    "@react-native-community/async-storage": "^1.12.1",
    "@react-native-community/netinfo": "8.3.1",
    "@react-native-community/push-notification-ios": "^1.10.1",
    "@react-native-firebase/analytics": "14.4.0",
    "@react-native-firebase/app": "14.4.0",
    "@react-native-firebase/auth": "14.4.0",
    "@react-native-firebase/crashlytics": "14.4.0",
    "@react-native-firebase/messaging": "14.4.0",
    "@react-native-google-signin/google-signin": "^8.0.0",
    "@react-navigation/bottom-tabs": "6.5.3",
    "@react-navigation/drawer": "6.5.7",
    "@react-navigation/native": "6.1.2",
    "@react-navigation/native-stack": "6.9.8",
    "@react-navigation/routers": "6.1.6",
    "@react-navigation/stack": "6.3.11",
    "@sentry/browser": "6.19.7",
    "@sentry/react-native": "3.4.3",
    "@supersami/rn-foreground-service": "^2.1.0",
    "@turf/turf": "^6.5.0",
    "expo": "^48.0.6",
    "expo-cli": "^5.2.0",
    "expo-file-system": "~15.2.2",
    "expo-linear-gradient": "^12.1.2",
    "expo-linking": "3.3.0",
    "expo-local-authentication": "^13.0.2",
    "expo-location": "^15.0.1",
    "expo-task-manager": "^11.0.1",
    "fs": "^0.0.1-security",
    "geolocation-utils": "^1.2.5",
    "global": "^4.4.0",
    "intl": "^1.2.5",
    "libphonenumber-js": "1.10.18",
    "lottie-ios": "3.4.0",
    "lottie-react-native": "5.1.4",
    "moment": "2.29.4",
    "moti": "^0.18.0",
    "npm-license-crawler": "^0.2.1",
    "patch-package": "6.5.1",
    "performance-now": "^2.1.0",
    "react": "18.1.0",
    "react-devtools": "^4.22.0",
    "react-devtools-core": "^4.23.0",
    "react-native": "0.70.6",
    "react-native-animatable": "^1.3.3",
    "react-native-background-timer": "^2.4.1",
    "react-native-base64": "^0.2.1",
    "react-native-battery-optimization-check": "^1.0.8",
    "react-native-blob-util": "^0.14.1",
    "react-native-calendars": "1.1293.0",
    "react-native-circular-progress": "^1.3.7",
    "react-native-circular-progress-indicator": "^2.0.6",
    "react-native-date-picker": "^4.2.6",
    "react-native-device-info": "10.3.0",
    "react-native-document-picker": "8.1.3",
    "react-native-exit-app": "^1.1.0",
    "react-native-fast-image": "8.6.3",
    "react-native-fbsdk-next": "10.1.0",
    "react-native-flipper": "^0.131.1",
    "react-native-geocoding": "^0.5.0",
    "react-native-gesture-handler": "^2.9.0",
    "react-native-gifted-chat": "^0.16.3",
    "react-native-google-places-autocomplete": "^2.5.1",
    "react-native-image-crop-picker": "^0.37.2",
    "react-native-image-viewing": "^0.2.2",
    "react-native-keyboard-aware-scroll-view": "^0.9.5",
    "react-native-maps": "^1.4.0",
    "react-native-mask-input": "1.2.2",
    "react-native-monorepo-tools": "1.2.1",
    "react-native-permissions": "3.6.1",
    "react-native-push-notification": "^8.1.1",
    "react-native-reanimated": "2.14.4",
    "react-native-render-html": "^6.3.4",
    "react-native-safe-area-context": "^3.3.2",
    "react-native-screens": "3.18.2",
    "react-native-splash-screen": "^3.3.0",
    "react-native-super-grid": "4.6.1",
    "react-native-svg": "12.5.0",
    "react-native-svg-app-icon": "^0.5.1",
    "react-native-system-navigation-bar": "1.0.5",
    "react-native-vector-icons": "^9.2.0",
    "react-native-webview": "11.26.0",
    "react-redux": "^7.2.6",
    "redux-flipper": "^2.0.1",
    "redux-middleware-flipper": "^1.0.9",
    "redux-persist": "^6.0.0",
    "rn-async-storage-flipper": "^0.0.10",
    "rn-sliding-up-panel": "^2.4.6",
    "yup": "^0.32.11"
  },

Thoughts?

mtjkln · 2023-06-05T06:03:11Z

Hello, Guys,

using React-Native 0.71.8

When using new architecture the touchable works sometimes and sometimes it wont. The moment I build using old architecture it works perfectly.

Please help us @necolas

necolas · 2023-06-05T18:19:08Z

I tried to help by pointing out that a reproducible example will help the maintainers (not me) more easily look for the root cause of the problem.

github-actions · 2023-06-06T12:17:55Z

⚠️	Missing Reproducible Example
ℹ️	It looks like your issue is missing a reproducible example. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template

devym-37 · 2024-04-09T07:28:35Z

@cortinico
We updated react-native-screens to the latest version, but the above issues still occur. This issue should be reopened.

freezing on click while changing tabs via bottom tab, scrolling is possible, but events on subsequent touches are unresponsive.
freezing occurs when launching the app and then launching the app again in the background or sleep.

devym-37 · 2024-04-09T07:34:50Z

@vrgimael Has this issue been resolved by any chance?

cortinico · 2024-04-09T09:42:09Z

We updated react-native-screens to the latest version, but the above issues still occur. This issue should be reopened.

@devym-37 please open a new issue + provide:

your react-native version
the react-native-screens version
a reproducer using the https://github.com/react-native-community/reproducer-react-native

amanShukla-amber · 2024-04-30T06:29:46Z

This was not meant as a complaint that the issue is not solved but the fact is that this issue was opened in regards to something that is not solved (again probably due to the randomness of the occurence) and hence, to me, it makes sense it should not be closed or considered as such.

We'll be closing this once software-mansion/react-native-screens#2028 is merged and shipped in a new version of react-native-screens. If there is another issue which is not fixed by the PR I linked, you should open a new issue, and provide a reproducer.

@cortinico
As the above fix for React native screens is pushed into version 3.30.1, Can't we directly upgrade the React-native-screens version above 3.30.1 in our app instead of upgrading the React Native version?
as we have upgraded the react-native-screens to the latest version with RN 0.71 but the issue is still there, do we have to upgrade React native version to 0.74+ to get this issue fixed?

WoLewicki · 2024-05-06T12:23:43Z

@amanShukla-amber you can try and apply only this PR to the current version of react-native-screens you have by using e.g. patch-package. From quickly looking at the code, it might just work on previous versions also. Be sure to apply software-mansion/react-native-screens#2107 too then as it is a needed follow-up for the issue.

spyshower · 2024-05-09T12:04:42Z

@vrgimael thank you for the detailed post man. We too have been struggling for months. Any chance you guys found out the issue?

emanu7478 · 2024-05-11T04:08:23Z

@vrgimael thank you for the detailed post man. We too have been struggling for months. Any chance you guys found out the issue?

"Hi @spyshower, We've been dealing with a similar issue for quite some time. Luckily, after thorough investigation, we managed to resolve it by upgrading the react-native-screen package to its latest release, version 3.31.1. Hopefully, this solution works for you too!"

peaktan · 2024-12-25T06:07:44Z

Hello, we have encountered this problem, could you tell me the latest version of the repair, see a fix to repair a similar problem before: #45865, don't know whether to fix the problem @vrgimael

sakibb7 · 2024-12-30T04:33:03Z

I'm using "react-native-screens": "~4.1.0" but still facing the same issue. onPress works but i need to click twice. This is very annoying. onPress works perfectly on android emulator but not on physical device.

cipolleschi · 2024-12-31T10:45:17Z

@sakibb7 the latest version of Screens is 4.4.0. Are you using RN Gesture Handler as well? If not, can you try to use it and report if the problem persists?

Atom1er · 2025-01-22T23:08:18Z

This issue should be re-opened, this is driving us crazy, it is random, we tried using different type of touchable to no luck. Was happening on an old version, so we updated to the latest and it still happens.

Bowlerr · 2025-01-22T23:11:22Z

@Atom1er have you checked for any memory leaks? It has been over a year but that ended up being a part of the issue I was having back then.

Touchables would stop being responsible after a while due to the memory leak

RohovDmytro · 2025-01-23T21:08:56Z

I am investigating very, very random stop on onPress for a long time. I had to invent the concept of hope to survive.

onPress => Taps => Stop working. Google Pixel 7 phone, no error, nothing sus in the logs.

I am using BaseButton (react-native-gesture-handler) + Text component. Replacing with a basic react-native Button component solves the issue.

RohovDmytro · 2025-01-23T21:19:43Z

Do anybody anyhow anyway anychance has an estimation of a real-life production impact of this issue? Is it in the ranges of 1%, 10%, *?

spyshower · 2025-01-23T21:22:09Z

Do anybody anyhow anyway anychance has an estimation of a real-life production impact of this issue? Is it in the ranges of 1%, 10%, *?

Im only replying because your comments made me laugh. If you ask in how many devices it happens, definitely <1%

Siti-Shaufi · 2025-01-24T00:28:00Z

Hi everyone,

Our team hasn’t come across these issues since we decided to revamp the UI/UX for the entire app. We’re still looking into the root cause, but we suspect it might be related to memory leaks. What’s weird is that while it happens randomly, it always affects the same button on real devices but doesn’t show up on emulators.

We also decide to just downgrade some of dependencies.

"react": "18.0.0",
"react-native": "0.69.12",
"react-native-screens": "^3.5.0",

spyshower · 2025-01-24T09:58:04Z

@Atom1er @Siti-Shaufi I am willing to help you out with this problem if you are interested. While we hadn't fixed the problem in the company I was working for at the moment, I do have some insights and potential solutions that might work.

RohovDmytro · 2025-01-24T12:08:22Z

I have some progress finding the cause.

At least SOME parts of the app were freezing due to key property. Basically:

Rendering an array of BaseButton each having key={Math.random()}
Quickly pressing works at first, then the app stops responding to presses

I was able to reliably reproduce this error by switching keys from random to constant values.

I have parts of the app where presses stops working where key value does not seem to be the issue. Will keep pushing (ha-ha).

martinnov92 · 2025-01-27T12:33:48Z

Similar issue is hapenning to me, but only when phone goes to sleeps for some time, then I wake the phone up and suddenly nothing works, except scrolling and after some the the app crashes. Even AppState change is not called...

spyshower · 2025-01-27T12:35:50Z

Similar issue is hapenning to me, but only when phone goes to sleeps for some time, then I wake the phone up and suddenly nothing works, except scrolling and after some the the app crashes. Even AppState change is not called...

Yep, exact same problem.

spyshower · 2025-01-27T12:43:17Z

Similar issue is hapenning to me, but only when phone goes to sleeps for some time, then I wake the phone up and suddenly nothing works, except scrolling and after some the the app crashes. Even AppState change is not called...

Yep, exact same problem.

Did you find any solution?

No man, read this thread. If someone wants to setup a chat/call so we can actually find out whats happening with this crazy issue instead of just reporting it, I will help.

amanShukla-amber · 2025-01-27T14:11:50Z

This was not meant as a complaint that the issue is not solved but the fact is that this issue was opened in regards to something that is not solved (again probably due to the randomness of the occurence) and hence, to me, it makes sense it should not be closed or considered as such.

We'll be closing this once software-mansion/react-native-screens#2028 is merged and shipped in a new version of react-native-screens. If there is another issue which is not fixed by the PR I linked, you should open a new issue, and provide a reproducer.

@cortinico As the above fix for React native screens is pushed into version 3.30.1, Can't we directly upgrade the React-native-screens version above 3.30.1 in our app instead of upgrading the React Native version? as we have upgraded the react-native-screens to the latest version with RN 0.71 but the issue is still there, do we have to upgrade React native version to 0.74+ to get this issue fixed?

We encountered a similar issue where touchables were not responding as expected. After extensive debugging, we discovered that the native thread was busy handling other tasks, which caused the press event callback to not propagate from the native side to the JS layer. As a result, the actions or code written in JS were not being executed.

To resolve this, we optimized our screen to reduce the workload on the native thread, and since then, we haven't observed this issue. This was tested on React Native version 0.71.

kkafar · 2025-01-27T18:52:00Z

I've been looking into the issue from react-native-screens perspective today.

I've tried both reproductions provided above:

and my own playground.

I've used Xiaomi Redmi Note 8 Pro with Android 11 (5 yo device) and failed to reproduce for ~20 min. In case anyone is able to reproduce it / record a video of the bug in your app / provide some other useful info - please do (together with versions of used packages).

vrgimael added the Needs: Triage 🔍 label Mar 29, 2023

github-actions bot added the Newer Patch Available label Mar 29, 2023

vrgimael mentioned this issue Mar 29, 2023

onPress not fire occasionally when pressing #34999

Closed

necolas mentioned this issue Mar 30, 2023

Touchable opacity not work randomly 1-5 days and it work later on iOS only #36063

Closed

necolas added Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. and removed Needs: Triage 🔍 labels Mar 30, 2023

github-actions bot added the Needs: Author Feedback label Mar 30, 2023

github-actions bot added Needs: Attention Issues where the author has responded to feedback. and removed Needs: Author Feedback labels Apr 27, 2023

necolas added Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules) Impact: Bug The issue represents a bug somewhere labels Jun 5, 2023

cortinico added Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. and removed Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. labels Jun 6, 2023

cortinico added the Resolution: Issue in another tool or repo An issue that was opened against React Native but in reality is affecting another tool or library label Mar 21, 2024

cortinico mentioned this issue Mar 21, 2024

Header height not getting calculated in pageY value for components in new architecture #43500

Closed

roryabraham mentioned this issue Apr 17, 2024

[$1000] Android - Unable to access popup menu while "New message" marker is visible Expensify/App#40108

Closed

6 tasks

DrZoidberg09 mentioned this issue May 21, 2024

Some touchable components are not working (Native Android devices only) #44643

Closed

HarshitMadhav mentioned this issue Jun 6, 2024

Pressable gets stuck under the new architecture #44610

Closed

peaktan mentioned this issue Dec 24, 2024

Do not destroy views when there is a touch going on for New Architecture #45865

Closed

cortinico mentioned this issue Jan 2, 2025

[New Arch][Android] Touchable components stop responding randomly #48387

Closed

Touchable components stop responding randomly #36710

Touchable components stop responding randomly #36710

Comments

vrgimael commented Mar 29, 2023 • edited Loading

Description

React Native Version

Output of npx react-native info

Steps to reproduce

Snack, code example, screenshot, or link to a repository

github-actions bot commented Mar 29, 2023

necolas commented Mar 30, 2023

vrgimael commented Mar 30, 2023

necolas commented Mar 30, 2023

github-actions bot commented Mar 30, 2023

etodanik commented Apr 26, 2023 • edited Loading

NiuGuohui commented Apr 27, 2023 • edited Loading

etodanik commented Apr 27, 2023

vrgimael commented Apr 27, 2023

NiuGuohui commented Apr 28, 2023

Nantris commented Apr 28, 2023

NiuGuohui commented Apr 28, 2023 • edited Loading

etodanik commented May 4, 2023

vrgimael commented May 30, 2023 • edited Loading

mtjkln commented Jun 5, 2023

necolas commented Jun 5, 2023

github-actions bot commented Jun 6, 2023

devym-37 commented Apr 9, 2024

devym-37 commented Apr 9, 2024

cortinico commented Apr 9, 2024

amanShukla-amber commented Apr 30, 2024 • edited Loading

WoLewicki commented May 6, 2024 • edited Loading

spyshower commented May 9, 2024

emanu7478 commented May 11, 2024

peaktan commented Dec 25, 2024

sakibb7 commented Dec 30, 2024

cipolleschi commented Dec 31, 2024

Atom1er commented Jan 22, 2025

Bowlerr commented Jan 22, 2025

RohovDmytro commented Jan 23, 2025 • edited Loading

RohovDmytro commented Jan 23, 2025

spyshower commented Jan 23, 2025

Siti-Shaufi commented Jan 24, 2025 • edited Loading

spyshower commented Jan 24, 2025

RohovDmytro commented Jan 24, 2025 • edited Loading

martinnov92 commented Jan 27, 2025

spyshower commented Jan 27, 2025

spyshower commented Jan 27, 2025

amanShukla-amber commented Jan 27, 2025

kkafar commented Jan 27, 2025

vrgimael commented Mar 29, 2023 •

edited

Loading

Output of `npx react-native info`

etodanik commented Apr 26, 2023 •

edited

Loading

NiuGuohui commented Apr 27, 2023 •

edited

Loading

NiuGuohui commented Apr 28, 2023 •

edited

Loading

vrgimael commented May 30, 2023 •

edited

Loading

amanShukla-amber commented Apr 30, 2024 •

edited

Loading

WoLewicki commented May 6, 2024 •

edited

Loading

RohovDmytro commented Jan 23, 2025 •

edited

Loading

Siti-Shaufi commented Jan 24, 2025 •

edited

Loading

RohovDmytro commented Jan 24, 2025 •

edited

Loading