react-native
react-native copied to clipboard
facebook
Android App Crash with `Animated node with tag (child) [xxxx] does not exists`
I was able to create a reproducible example in a test build where I added 20 swimlanes of which 2 out of 3 randomly animate, the screen is quite heavy but if you navigate a few times the app eventually crashes quite quickly with little effort.
Mostly with this exception:
04-27 13:20:21.717 27102 27102 E AndroidRuntime: FATAL EXCEPTION: main
04-27 13:20:21.717 27102 27102 E AndroidRuntime: Process: io.evix.reactnativetvexample, PID: 27102
04-27 13:20:21.717 27102 27102 E AndroidRuntime: com.facebook.react.bridge.JSApplicationIllegalArgumentException: connectAnimatedNodes: Animated node with tag (child) [5998] does not exist
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedNodesManager.connectAnimatedNodes(NativeAnimatedNodesManager.java:346)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedModule$16.execute(NativeAnimatedModule.java:751)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedModule$ConcurrentOperationQueue.executeBatch(NativeAnimatedModule.java:147)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedModule$3.execute(NativeAnimatedModule.java:332)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.uimanager.UIViewOperationQueue$UIBlockOperation.execute(UIViewOperationQueue.java:579)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.uimanager.UIViewOperationQueue$1.run(UIViewOperationQueue.java:915)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(UIViewOperationQueue.java:1026)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.uimanager.UIViewOperationQueue.access$2600(UIViewOperationQueue.java:47)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1086)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:175)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:85)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1035)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.view.Choreographer.doCallbacks(Choreographer.java:845)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.view.Choreographer.doFrame(Choreographer.java:775)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1022)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.os.Handler.handleCallback(Handler.java:938)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.os.Handler.dispatchMessage(Handler.java:99)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.os.Looper.loopOnce(Looper.java:201)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.os.Looper.loop(Looper.java:288)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at android.app.ActivityThread.main(ActivityThread.java:7839)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at java.lang.reflect.Method.invoke(Native Method)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:548)
04-27 13:20:21.717 27102 27102 E AndroidRuntime: at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1006)
But sometimes also with this one:
04-27 13:18:32.957 26938 26938 E AndroidRuntime: FATAL EXCEPTION: main
04-27 13:18:32.957 26938 26938 E AndroidRuntime: Process: io.evix.reactnativetvexample, PID: 26938
04-27 13:18:32.957 26938 26938 E AndroidRuntime: java.lang.RuntimeException: java.lang.IllegalArgumentException: Mapped property node does not exists
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedModule$1.doFrameGuarded(NativeAnimatedModule.java:230)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:175)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:85)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1035)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.view.Choreographer.doCallbacks(Choreographer.java:845)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.view.Choreographer.doFrame(Choreographer.java:775)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1022)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.os.Handler.handleCallback(Handler.java:938)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.os.Handler.dispatchMessage(Handler.java:99)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.os.Looper.loopOnce(Looper.java:201)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.os.Looper.loop(Looper.java:288)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at android.app.ActivityThread.main(ActivityThread.java:7839)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at java.lang.reflect.Method.invoke(Native Method)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:548)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1006)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: Caused by: java.lang.IllegalArgumentException: Mapped property node does not exists
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.animated.PropsAnimatedNode.updateView(PropsAnimatedNode.java:100)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedNodesManager.updateNodes(NativeAnimatedNodesManager.java:690)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedNodesManager.runUpdates(NativeAnimatedNodesManager.java:597)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: at com.facebook.react.animated.NativeAnimatedModule$1.doFrameGuarded(NativeAnimatedModule.java:214)
04-27 13:18:32.957 26938 26938 E AndroidRuntime: ... 15 more
Both seem to originate from NativeAnimatedNodesManager.java.
https://user-images.githubusercontent.com/1210628/234848355-ed5b4d7c-8d4d-43fe-bba7-286567cbc70b.mp4
A reproducible example can be found here: https://github.com/wouterds/react-native-tv-example/tree/bug/animation-crash
I can't attach the .apk because it's above the limits of GitHub file upload, but crashlog, video & apk can be found here: https://drops.evix.io/rn-crash-connectAnimatedNodes/
Originally posted by @wouterds in https://github.com/facebook/react-native/issues/33686#issuecomment-1525541443
@cortinico I'm gonna have a look this weekend to create a reproducible example for a vanilla react-native app
Hello, is there a solution for this. I have also encountered many times @wouterds
@hangjunping there is no solution as far as I know (and it is imo a bug inside react-native). I still have to create that reproducible demo in a vanilla react native project though. But feel free to create one if you can quickly and easily reproduce it on a simple demo project.
Hello! I'm facing the same issue on Android 12. So far, I've encountered the problem on the following devices: Motorola, Samsung, and Xiaomi. My application is experiencing several errors daily related to this issue.
Hello, is there a solve for this crash at the moment, or is it something we've to live with..
Please, i'm getting many firebase crashes on Android 12 and can't reproduce. It started after an OS update without any app update. Any idea?
@wouterds Does this crash still occur if you add the enableSynchronizationForAnimated flag as originally suggested here?
@wilav-dev
Please, i'm getting many firebase crashes on Android 12 and can't reproduce. It started after an OS update without any app update. Any idea?
It only happens on Android 12 as far as I can see, we also discovered it that way.
@nemzutkovic
@wouterds Does this crash still occur if you add the
enableSynchronizationForAnimatedflag as originally suggested here?
Yea, doesn't help.
it's so frustrated to suddenly have many crashes without uploading a new app version. i can't find solutions, and it's not an option to upgrade all my apps to a new RN version right now.
@skantus one question here? wont that cause performance issues going forward since the animations will now run on the JS thread, and the delta in frame calculation values will now keep getting sent over the bridge?
@skantus one question here? wont that cause performance issues going forward since the animations will now run on the JS thread, and the delta in frame calculation values will now keep getting sent over the bridge?
To date, I haven't encountered any performance issues.
Setting useNativeDriver: false is not a solution + you would need to patch *all* your sub packages, not just your code. It is very visible on budget Android devices, even on simple navigation transitions.
I tried it previously and would not recommend it, although it does reduce crash rate if you are ok with a significant worse UX.
Certainly, in the case of highly intricate animations, there may be an impact on performance. However, rather than emphasizing the potential performance issues, it is advisable to prioritize stability and prevent crashes as a short-term solution. It is worth noting that I am eagerly anticipating a resolution from the RN team to address this matter.
Possible related fix #37927
We tried it. It worked, It's probably an android bug，Refer to this: https://issuetracker.google.com/issues/261481042
@free46000 When you say it worked, does it mean you stopped getting the crash entirely?? Also since it tweaks the internal implementation of animations, were there cases where you observed frame drops drop in UI FPS, or ANRs increased ?
Like a lot of people, we're seeing our react-native 0.70.5 apps crashing on Android 12 devices. Until there's an official fix, I'm about to release a new version of our apps, patching react-native's NativeAnimatedNodesManager.java to "log and return" rather than throwing exceptions. I know it's a bad idea. It's been a pain to setup with CircleCi/Crashlytics. Our limited internal automation tests show that the crashes aren't occurring anymore, so I'll do a slow roll out in the coming weeks and I will update this thread with the results.
Like a lot of people, we're seeing our react-native 0.70.5 apps crashing on Android 12 devices. Until there's an official fix, I'm about to release a new version of our apps, patching react-native's NativeAnimatedNodesManager.java to "log and return" rather than throwing exceptions. I know it's a bad idea. It's been a pain to setup with CircleCi/Crashlytics. Our limited internal automation tests show that the crashes aren't occurring anymore, so I'll do a slow roll out in the coming weeks and I will update this thread with the results.
@yrichard I tried that but that caused code crashing in other places for me, but maybe I was just too sloppy with patching NativeAnimatedNodesManager.java. Do you mind sharing what you commented out exactly?
@yrichard Would you mind sharing the commit or code changes that you did as a patch fix..
Possible related fix #37927
We tried it. It worked, It's probably an android bug，Refer to this: https://issuetracker.google.com/issues/261481042
How did you apply this patch ?
Thanks
@free46000 When you say it worked, does it mean you stopped getting the crash entirely?? Also since it tweaks the internal implementation of animations, were there cases where you observed frame drops drop in UI FPS, or ANRs increased ?
Yes, there was no performance testing because only the implementation of the queue was changed
Possible related fix #37927
We tried it. It worked, It's probably an android bug，Refer to this: https://issuetracker.google.com/issues/261481042
How did you apply this patch ?
Thanks
We are directly modified source code
@wouterds Here's the patch I created via patch-package.
react-native+0.70.5.patch
You need to make sure you can build React Native with your app first, so I'd suggest adding a Log.d statement in NativeAnimatedNodesManager's constructor, then check that you can build and see the log prior to apply the patch.
Edit: Looks like the patch avoids some crashes but that eventually the app crashes somewhere else.
You'd still need to rebuild RN to get the updated AAR right? That's the only annoying part of needing to patch the Android side IMHO.
@cortinico could this be released as a feature flag the same as the previous fix was? I would like to test this in our app but only for certain devices. This is our largest crash on android and is caused only by a handful of phones.
We are on RN 70 and have a blocker to get to 71.
Thanks again for all the help
@cortinico could this be released as a feature flag the same as the previous fix was?
Can we get this as a PR so we can do a pass on it?
Do you need this PR updated with a flag?
https://github.com/facebook/react-native/pull/37927
Nope I meant @yrichard fix. The problem is that those are all best-guess fix and without a repro this is impossible to effectively fix