react-native: Android App Crash with `Animated node with tag (child) [xxxx] does not exists`

We are also facing this issue throughout our ReactNative Android app. We deduced the screens in which the crash occurred, using Crashlytics and analytic events. The first goal was to zero-in on the component (in the screen) that caused the crash. To do this,

• I added an Android studio debug breakpoint in the connectAnimatedNode method of the NativeAnimatedNodesManager class in the react-native android package.
• I launched the crash causing screen with the debugger attached.
• Kept one component at a time and commented out all other components and repeated step 2 (the above step)
• After doing this exercise, I zeroed in on react-native SectionList calling this connectAnimatedNode code block. None of the other components contributed to this method call, only the SectionList did.
• So, it was clear that SectionList was causing this crash, albeit intermittent.
• Now, I commented out SectionList props one-by-one and repeated step 2.
• The crash causing property was found to be enableStickyHeader/stickyIndices. When I removed this property, this crash causing code block was never called.
• To fix this, we wrote our own custom sticky scroll view in reanimated, and it is under review currently.

This process of debugging can help you zero-in on the component/prop that causes this crash. And then take the next steps to solve it.

Hope this helps!

Has anyone managed to resolve this problem?

Any update guys ?? Going through a lot of crashes in a short span.

“Don’t use animations” is a ridiculous suggestion, animations are of paramount importance to UX.
Let’s think and try to find a solution instead.

Besides that, and as mentioned multiple times before, it’s not only *your* animations. It’s any animation by any library. Going that route requires you to find every reference of useNativeDriver in your node_modules and patch all your third-party libs.

It also affects the little things like navigation animations. It’s a very poor UX, I tried it (in production) and it does reduce the crash rate a lot, but the app feels very cheap & unprofessional.

@freeboub Yeah, I experimented with this patch as well but it seems unreliable. Sometimes it looks like it can recover from it and you see the soft crash passing in the logs and the app continues working - but often I see it just crashing further down the line with the same exception as you reported.

java.lang.IllegalArgumentException: Mapped property node does not exists

Wouldn’t recommend this patch as a workaround.

–

@cortinico The issue can be reproduced relatively easily with this project on this branch. While react-native-tvos is a fork and this specific example is a little more complex it is the fasted way I found to reproduce the issue, the same bug resides in react-native core, and code crashes somewhere in NativeAnimatedNodesManager.java.

To reproduce just run the example and switch between screens on the main navigation until it crashes. For me it takes about 5 - 10 times switching screens (while running on a real Android (12) TV device, the crappier the better).

I’m currently trying to create a reproducible example with a vanilla react-native project on Android but so far no luck.

@cortinico I’m gonna have a look this weekend to create a reproducible example for a vanilla react-native app

@wouterds @cortinico It is really hard to reproduce it in any simulators even we use a real device.

It happened if the device used falls into these criteria:

1. Android 12 Go Edition
2. Have 32bit type CPU
3. 1-2 GB ram (Low memory devices)

I reported it in React Navigation before and even the example app provided by React Navigation can replicate it easily in Android Go devices https://github.com/react-navigation/react-navigation/issues/11180

The production environment on Android devices will crash.

“react-native”: “0.71.16”

Fatal Exception: com.facebook.react.bridge.JSApplicationIllegalArgumentException: addAnimatedEventToView: Animated node with tag [11] does not exist
       at com.facebook.react.animated.NativeAnimatedNodesManager.addAnimatedEventToView(NativeAnimatedNodesManager.java:507)
       at com.facebook.react.animated.NativeAnimatedModule$21.execute(NativeAnimatedModule.java:924)
       at com.facebook.react.animated.NativeAnimatedModule$ConcurrentOperationQueue.executeBatch(NativeAnimatedModule.java:173)
       at com.facebook.react.animated.NativeAnimatedModule$3.execute(NativeAnimatedModule.java:359)
       at com.facebook.react.uimanager.UIViewOperationQueue$UIBlockOperation.execute(UIViewOperationQueue.java:579)
       at com.facebook.react.uimanager.UIViewOperationQueue$1.run(UIViewOperationQueue.java:915)
       at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(UIViewOperationQueue.java:1026)
       at com.facebook.react.uimanager.UIViewOperationQueue.access$2600(UIViewOperationQueue.java:47)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1086)
       at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
       at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:175)
       at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:85)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1226)
       at android.view.Choreographer.doCallbacks(Choreographer.java:1012)
       at android.view.Choreographer.doFrame(Choreographer.java:917)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1213)
       at android.os.Handler.handleCallback(Handler.java:938)
       at android.os.Handler.dispatchMessage(Handler.java:99)
       at android.os.Looper.loopOnce(Looper.java:233)
       at android.os.Looper.loop(Looper.java:334)
       at android.app.ActivityThread.main(ActivityThread.java:8513)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:582)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1068)

Thanks, @wouterds, for clarification.

@sebas21, I would suggest this: https://github.com/facebook/react-native/pull/37927 since many apps, including mine, are solve the crash totally as we can replicate it on a specific set of real devices, including TVOS. We used it already for one month on a production setup but we tweak it to only use the LinkedBlockingQueue in Android 12, and so far there has been no performance degradation. This is not a totally concrete solution, but it has completely mitigate any crashes related to the animated node.

ref: https://issuetracker.google.com/issues/261481042

Happening after upgrading to 0.71.7 from 0.66.3

Possible related fix #37927

We tried it. It worked, It’s probably an android bug，Refer to this: https://issuetracker.google.com/issues/261481042

These are the patches applied for RN 0.71.13

react-native-camera+4.2.1.patch react-native-reanimated+2.17.0.patch react-native+0.71.13.patch

any suggestion welcome!

@sebas21 This patches solve this issue completely?

I have been using the patch I have provided for 1 month now. I can assume it fixes the issue. We are 10 people working on android tv 12 ONLY (I don’t count customers) we don’t see the crash anymore and no ‘strange’ behavior happens. I can say it is safe.

Note: a similar patch shall be applied on react-native-reanimated

I also get this error in production. “react-native”: “0.73.6”

Fatal Exception: com.facebook.react.bridge.JSApplicationIllegalArgumentException: connectAnimatedNodes: Animated node with tag (child) [3851] does not exist
       at com.facebook.react.animated.NativeAnimatedNodesManager.connectAnimatedNodes(NativeAnimatedNodesManager.java:371)
       at com.facebook.react.animated.NativeAnimatedModule$16.execute(NativeAnimatedModule.java:777)
       at com.facebook.react.animated.NativeAnimatedModule$ConcurrentOperationQueue.executeBatch(NativeAnimatedModule.java:171)
       at com.facebook.react.animated.NativeAnimatedModule$3.execute(NativeAnimatedModule.java:365)
       at com.facebook.react.uimanager.UIViewOperationQueue$UIBlockOperation.execute(UIViewOperationQueue.java:579)
       at com.facebook.react.uimanager.UIViewOperationQueue$1.run(UIViewOperationQueue.java:926)
       at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(UIViewOperationQueue.java:1037)
       at com.facebook.react.uimanager.UIViewOperationQueue.-$$Nest$mflushPendingBatches()
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1097)
       at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
       at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:175)
       at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:85)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1036)
       at android.view.Choreographer.doCallbacks(Choreographer.java:846)
       at android.view.Choreographer.doFrame(Choreographer.java:776)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1023)
       at android.os.Handler.handleCallback(Handler.java:938)
       at android.os.Handler.dispatchMessage(Handler.java:99)
       at android.os.Looper.loopOnce(Looper.java:201)
       at android.os.Looper.loop(Looper.java:288)
       at android.app.ActivityThread.main(ActivityThread.java:7986)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:553)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1003)

I am going through the same situation, with over 42 thousand errors in a short period. @cipolleschi

Hi React Native Team, @shaik41 @rezaarifian @redpanda-bit We’re encountering a sporadic issue on "react-native": "^0.72.3" with the following error:

Fatal Exception: com.facebook.react.bridge.JSApplicationIllegalArgumentException: connectAnimatedNodes: Animated node with tag (child) [72] does not exist
       at com.facebook.react.animated.NativeAnimatedNodesManager.connectAnimatedNodes(NativeAnimatedNodesManager.java:53)
       at com.facebook.react.animated.NativeAnimatedModule$16.execute(NativeAnimatedModule.java:4)
       at com.facebook.react.animated.NativeAnimatedModule$ConcurrentOperationQueue.executeBatch(NativeAnimatedModule.java:22)
       at com.facebook.react.animated.NativeAnimatedModule$3.execute(NativeAnimatedModule.java:14)
       at com.facebook.react.uimanager.UIViewOperationQueue$UIBlockOperation.execute(UIViewOperationQueue.java:8)
       at com.facebook.react.uimanager.UIViewOperationQueue$1.run(UIViewOperationQueue.java:135)
       at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(UIViewOperationQueue.java:53)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:31)

This issue seems to occur randomly and is challenging to reproduce consistently, making it difficult to pinpoint the root cause. We’ve received suggestions from different developers:

1. Applying a patch may resolve the issue, but concerns about overall performance have been raised. https://github.com/facebook/react-native/issues/37267#issuecomment-1710155795
2. Seeking insights on when the React Native team plans to address this. can you suggest any working solutions?

@cortinico How do we move forward? Clearly, nobody is able to create a simple vanilla app to reproduce the issue. The next best thing we have, at this moment, is the example repository/branch linked in the original post. Isn’t that sufficient to get started? It’s reproducible within 20 seconds on those cheap $50 Android TV boxes from Amazon (running Android 12).

@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 enableSynchronizationForAnimated flag as originally suggested here?

Yea, doesn’t help.

@lucasoliveiracruz thats the patch mentioned in react-native pull request. yet take it with grain of salt better test because it replace the none-blocking Queue with a blocking one

diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/animated/NativeAnimatedModule.java b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/animated/NativeAnimatedModule.java
index 76749aa..018c06b 100644
--- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/animated/NativeAnimatedModule.java
+++ b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/animated/NativeAnimatedModule.java
@@ -37,7 +37,7 @@ import com.facebook.react.uimanager.common.ViewUtil;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.Queue;
-import java.util.concurrent.ConcurrentLinkedQueue;
+import java.util.concurrent.LinkedBlockingQueue;
 import java.util.concurrent.atomic.AtomicReference;
 
 /**
@@ -149,7 +149,7 @@ public class NativeAnimatedModule extends NativeAnimatedModuleSpec
   }
 
   private class ConcurrentOperationQueue {
-    private final Queue<UIThreadOperation> mQueue = new ConcurrentLinkedQueue<>();
+    private final Queue<UIThreadOperation> mQueue = new LinkedBlockingQueue<>();
     @Nullable private UIThreadOperation mPeekedOperation = null;
 
     @AnyThread

These are the patches applied for RN 0.71.13

react-native-camera+4.2.1.patch react-native-reanimated+2.17.0.patch react-native+0.71.13.patch

any suggestion welcome!

Friends, is there a temporary solution???, we are affecting too many users with this bug…

These are the devices that are affected

LOGS: com.facebook.react.bridge.JSApplicationIllegalArgumentException: connectAnimatedNodes: Animated node with tag (child) [119] does not exist at com.facebook.react.animated.l.h(Unknown Source:53) at com.facebook.react.animated.NativeAnimatedModule$f.a(Unknown Source:4) at com.facebook.react.animated.NativeAnimatedModule.executeAllOperations(Unknown Source:31) at com.facebook.react.animated.NativeAnimatedModule.access$400(Unknown Source:0) at com.facebook.react.animated.NativeAnimatedModule$p.a(Unknown Source:8) at com.facebook.react.uimanager.x0$t.d(Unknown Source:8) at com.facebook.react.uimanager.x0$a.run(Unknown Source:135) at com.facebook.react.uimanager.x0.U(Unknown Source:53) at com.facebook.react.uimanager.x0.s(Unknown Source:0) at com.facebook.react.uimanager.x0$j.c(Unknown Source:31) at com.facebook.react.uimanager.f.a(Unknown Source:0) at com.facebook.react.modules.core.g$d.a(Unknown Source:46) at com.facebook.react.modules.core.a$a$a.doFrame(Unknown Source:2) at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1103) at android.view.Choreographer.doCallbacks(Choreographer.java:896) at android.view.Choreographer.doFrame(Choreographer.java:810) at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1090) at android.os.Handler.handleCallback(Handler.java:938) at android.os.Handler.dispatchMessage(Handler.java:99) at android.os.Looper.loopOnce(Looper.java:201) at android.os.Looper.loop(Looper.java:288) at android.app.ActivityThread.main(ActivityThread.java:7881) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:568) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1045)

java.lang.IllegalArgumentException: Invalid parent node provided at com.facebook.react.animated.i.c(Unknown Source:12) at com.facebook.react.animated.b.f(Unknown Source:5) at com.facebook.react.animated.l.k(Unknown Source:22) at com.facebook.react.animated.NativeAnimatedModule$g.a(Unknown Source:4) at com.facebook.react.animated.NativeAnimatedModule.executeAllOperations(Unknown Source:31) at com.facebook.react.animated.NativeAnimatedModule.access$400(Unknown Source:0) at com.facebook.react.animated.NativeAnimatedModule$p.a(Unknown Source:8) at com.facebook.react.uimanager.x0$t.d(Unknown Source:8) at com.facebook.react.uimanager.x0$a.run(Unknown Source:135) at com.facebook.react.uimanager.x0.U(Unknown Source:53) at com.facebook.react.uimanager.x0.s(Unknown Source:0) at com.facebook.react.uimanager.x0$j.c(Unknown Source:31) at com.facebook.react.uimanager.f.a(Unknown Source:0) at com.facebook.react.modules.core.g$d.a(Unknown Source:46) at com.facebook.react.modules.core.a$a$a.doFrame(Unknown Source:2) at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1103) at android.view.Choreographer.doCallbacks(Choreographer.java:896) at android.view.Choreographer.doFrame(Choreographer.java:810) at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1090) at android.os.Handler.handleCallback(Handler.java:938) at android.os.Handler.dispatchMessage(Handler.java:99) at android.os.Looper.loopOnce(Looper.java:201) at android.os.Looper.loop(Looper.java:288) at android.app.ActivityThread.main(ActivityThread.java:7886) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:568) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1045)

first of all, Thanks

@sebas21 There were two temporary solutions provided above 1 and 2 with number 2 having a promising follow up.

if none of those work I would change the UI to not use the animation causing the crash – some users might prefer not to be distracted by motion anyway.

@freeboub @coolguy001tv @yrichard Feel free to try to create a reproducible example, I have this but so far I haven’t found a way to consistently and quickly reproduce it on Android 12 devices react-native-animated-nodes-crash-example.

As mentioned in https://github.com/facebook/react-native/issues/37267#issue-1697375660 there is a reproducible example on the react-native-tvos fork (that *is* relatively easy to reproduce on an Android 12 device), but as I understood from @cortinico that is not good enough as reproducible example.

It’s not a SOLUTION, so we are still waiting …

For context, I’m also still waiting for a reproducer from someone.

Animated component of React Native

https://github.com/react-navigation/react-navigation/issues/11890#issuecomment-2090294675

My project also encountered so many crash issues from it every day. When will React Native officially fix it? com.facebook.react.bridge.JSApplicationIllegalArgumentException: connectAnimatedNodeToView: Animated node with tag [5] does not exist at com.facebook.react.animated.NativeAnimatedNodesManager.connectAnimatedNodeToView(Unknown Source:148) at com.facebook.react.animated.NativeAnimatedModule$17.execute(Unknown Source:4) at com.facebook.react.animated.NativeAnimatedModule.executeAllOperations(Unknown Source:31) at com.facebook.react.animated.NativeAnimatedModule.access$400(Unknown Source:0) at com.facebook.react.animated.NativeAnimatedModule$3.execute(Unknown Source:8) at com.facebook.react.uimanager.UIViewOperationQueue$UIBlockOperation.execute(Unknown Source:8) at com.facebook.react.uimanager.UIViewOperationQueue$1.run(Unknown Source:135) at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(Unknown Source:53) at com.facebook.react.uimanager.UIViewOperationQueue.access$2600(Unknown Source:0) at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(Unknown Source:31) at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(Unknown Source:0) at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(Unknown Source:46) at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(Unknown Source:2) at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1238) at android.view.Choreographer.doCallbacks(Choreographer.java:1012) at android.view.Choreographer.doFrame(Choreographer.java:917) at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1225) at android.os.Handler.handleCallback(Handler.java:938) at android.os.Handler.dispatchMessage(Handler.java:99) at android.os.Looper.loopOnce(Looper.java:233) at android.os.Looper.loop(Looper.java:334) at android.app.ActivityThread.main(ActivityThread.java:8513) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:582) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1068)

Has anyone managed to resolve this problem?

I have tried multiple patches, like here https://github.com/react-native-tvos/react-native-tvos/pull/657

But, I notice a slow UI, which clearly affects the UX in my preliminary tests, although I have no more unexpected crashes, I feel that it should be something that is verified from the RN library itself, and if it is possible that it was backward compatible with previous versions by RN

This patch fixes the issue: #37267 (comment) But you need to apply it manually and build from source.

Be aware that this can change performance significantly; someone already mentioned that, but the fix changes the queue from a concurrent one to a blocking one. Therefore, if you apply that patch, you will affect all users’ performance, while you might fix those having the crash on Android 12. I’m waiting for a better fix; if I ever apply the above, I would do the queue change only for Android 12 users, IMHO.

no friend, the patch only implement LinkedBlockingQueue on android version 12. Other than that it is not affected. reffer patch on this

Isn’t that just a crash avoidance? What is the desired type of fix here?

Returning early to avoid throwing or disabling all native animations are indeed not fixes addressing the underlying issue.

@yrichard Would you mind sharing the commit or code changes that you did as a patch fix…

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.

@wouterds can we get this repro on a vanilla React Native App on 0.71?

Has anyone managed to resolve this problem? Users: 6.3k Events: 21k

My analysis data shows that all issues occur on Android 12.

react-native: 0.66.4

Solution：

export const USE_NATIVE_DRIVER = Platform.select({
  ios: true,
  android: Platform.constants?.Release !== '12',
  default: true,
});

const { current: opacity } = useRef(
    Animated.timing(initValue, {
      toValue: 1,
      duration: 1000,
      easing: Easing.linear,
      useNativeDriver: USE_NATIVE_DRIVER,
    }),
  )

@sebas21, I’d like to apply your solution to patch my application. Could you please share if you’ve noticed any improvement in your production app after applying these patches? Has the problem been resolved for you?

I’m still experiencing a significant number of errors daily, specifically on Android 12 devices like:

• SM-A032M (84% of crashes)
• Moto e22 (8%)
• Redmi A1 (2%)
• Redmi 12C

Additionally, I attempted to reproduce the crash using an Android 12 emulator, but unfortunately, I wasn’t able to replicate it 😕.

@sebas21, ¿tienes un parche para “react-native”: “0.70.8”?

Lo intento, pero la clase pública MountItemDispatcher, en react-native/ReactAndroid/src/main/java/com/facebook/react/fabric/mounting/MountItemDispatcher.java

Es tan diferente en esas versiones.

@wesvh Friend no, but you can take the file as a reference or already where they cited the change https://github.com/facebook/react-native/pull/37927

@saghul Yes you will have to rebuild the AARs

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.

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.

@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.