One Plus Animation Error

[Hmoulvad]

Description

I am experiencing following issues with only One Plus Telephones. Does anyone have an idea what this might be?

I am having a hard to trying to figure out what causes this.

Can this have something to do with OnePlus Oxygen?

com.facebook.react.animated.FrameBasedAnimationDriver.runAnimationStep
FrameBasedAnimationDriver.java, line 73
java.lang.IllegalStateException: Calculated frame index should never be lower than 0

Stack Trace:

com.facebook.react.animated.FrameBasedAnimationDriver.runAnimationStep FrameBasedAnimationDriver.java:73
com.facebook.react.animated.NativeAnimatedNodesManager.runUpdates NativeAnimatedNodesManager.java:633
com.facebook.react.animated.NativeAnimatedModule$1.doFrameGuarded NativeAnimatedModule.java:263
com.facebook.react.uimanager.GuardedFrameCallback.doFrame GuardedFrameCallback.java:29
com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame ReactChoreographer.java:175
com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame ChoreographerCompat.java:85
android.view.Choreographer$CallbackRecord.run Choreographer.java:1386
android.view.Choreographer$CallbackRecord.run Choreographer.java:1396
android.view.Choreographer.doCallbacks Choreographer.java:1033
android.view.ChoreographerExtImpl.checkScrollOptSceneEnable ChoreographerExtImpl.java:397
android.view.Choreographer.doFrame Choreographer.java:900
android.view.Choreographer$FrameDisplayEventReceiver.run Choreographer.java:1371
android.os.Handler.handleCallback Handler.java:942
android.os.Handler.dispatchMessage Handler.java:99
android.os.Looper.loopOnce Looper.java:240
android.os.Looper.loop Looper.java:351
android.app.ActivityThread.main ActivityThread.java:8321
java.lang.reflect.Method.invoke Method.java
com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run RuntimeInit.java:584
com.android.internal.os.ZygoteInit.main ZygoteInit.java:1012

Version

0.70.6

Output of npx react-native info

System:
OS: macOS 13.1
CPU: (10) arm64 Apple M1 Pro
Memory: 1.25 GB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
Yarn: 1.22.19 - /opt/homebrew/bin/yarn
npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
Watchman: 2022.12.12.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: Not Found
IDEs:
Android Studio: 2021.3 AI-213.7172.25.2113.9123335
Xcode: 14.2/14C18 - /usr/bin/xcodebuild
Languages:
Java: 17.0.4 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 18.2.0 => 18.2.0
react-native: 0.70.6 => 0.70.6
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

When scrolling through lists this sometimes happens.

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

Can't share since this is for a firm.

[cortinico]

Can't share since this is for a firm.

We can't really investigate without a reproducer.

[github-actions]

⚠️	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.

[Sioxas]

Meet the same error on OnePlus pgp110(11)

[marioabreu]

I've just saw this in the following devices:

• OPPO CPH2145
• OnePlus 9 5G
• OnePlus 8T
• OPPO CPH2207
• OPPO Find X5 Pro

All of them are using Android 13

[BennyTian]

the same problems on OPPO with Android 13 devices .

[free46000]

I have the same problem, all on android 13 devices, is there a solution？

[BennyTian]

[BennyTian]

I have the same problem, all on android 13 devices, is there a solution？

[free46000]

I have found that, in fact, when the system doFrame callback, the frameTimeNanos parameter will appear that the time of the next frame is smaller than the time of the last frame
for example： lastFrameTimeNanos:10261742601187,frameTimeNanos:10261742589360

[RRaideRR]

As you said. Android 13 devices and OPPO devices. +1

[ankitzepto]

+1 , seeing the issue on Android 13 devices

[github-actions]

This issue is waiting for author's feedback since 24 days. Please provide the requested feedback or this will be closed in 7 days.

[Hmoulvad]

@cortinico still can't provide details on WHEN and WHY this is happening.

We can't just see it from the crashes coming from PlayStore. Do you have any suggestions on how to get a better stack trace for me to provide you?

I can tell you from all my logs from AppCenter and PlayStore that's only happening on OnePlus telephones using Android 13.

[cortinico]

As mentioned, without a clear repro, it's impossible for us to do anything here.

We can't just see it from the crashes coming from PlayStore. Do you have any suggestions on how to get a better stack trace for me to provide you?

I know this can be hard, but I suggest to get a OnePlus phone on Android 13, and try to reproduce locally. If you manage to isolate the crash we can look into fixing it somehow

[Hmoulvad]

@cortinico aight cool! I will do all in my power in order to reproduce this error ;-)

[bashen1]

same problem

[sarthakgdeveloper]

Hey, I have upgraded to RN 0.72.0, which is the latest version, but still seeing the same crash on oneplus and vivo devices, but as mentioned in #37487, it should be fixed in latest RN versions

[shikhar119911]

Any updates facing the same issue in RN 0.72.0

[cipolleschi]

The commit has not been picked for 0.72 yet, but it is listed in the commit to pick. It will be fixed in 0.72.2
Thanks for reporting this issue.

[manojalwisnz]

same issue : Oppo and OnePlus phones (Android 13)

com.facebook.react.animated.FrameBasedAnimationDriver.runAnimationStep
java.lang.IllegalStateException - Calculated frame index should never be lower than 0

[aditya-keri-betterhalf]

This patch from @hsource c05d822 might just work. We are seeings thousands of events from this single crash.

I would really appreciate it if someone can help me with the steps to include this patch in my current react-native version of 0.69.8. I understand I need to build this source for my app to pick up the changes I do locally in the file.
But I'm unsure as to what the exact steps would be.
All I need is to just simply include this patch : c05d822 in my current react native app.

Thanks in advance!

[sebas21]

Was it fixed in version 0.71.13?

Thanks in advance!

[BennyTian]

modify:

com.facebook.react.animated.FrameBasedAnimationDriver.java

line: 72

//throw new IllegalStateException("Calculated frame index should never be lower than 0");
return ;

use https://github.com/nekocode/JarFilterPlugin to replace class in jar.

[rupeshkk-iprogrammer]

@BennyTian can you please explain more about how we can use JarFilterPlugin

[BennyTian]

@BennyTian can you please explain more about how we can use JarFilterPlugin

my envs ( If your version is different from mine, you may need to modify it slightly ) :

react-native: 0.61.5 

com.android.tools.build:gradle:3.5.4

1: project -> build.gradle

dependencies {
        ...        
       classpath 'com.github.nekocode:JarFilterPlugin:1.2' //https://github.com/nekocode/JarFilterPlugin
}

2: app -> build.gradle

root node:

apply plugin: "jar-filter"

jarFilter {
    skipFiles = [
      'com/facebook/react/animated/FrameBasedAnimationDriver.class',
      'com/facebook/react/uimanager/ViewManagersPropertyCache.class',
      'com/facebook/react/uimanager/ViewManagersPropertyCache\\$(.*).class',
      'androidx/recyclerview/widget/RecyclerView.class',
      'androidx/recyclerview/widget/RecyclerView\\$(.*).class',
      'okhttp3/Dns.class',
      'okhttp3/Dns\\$(.*).class',
    ]
}

jarFilter is will replace class.

3. In your android project, create a new class that you want to replace. This class can be found in the RN source code ( or other source ), and then make changes yourself

After you have created classes in the same path in your android project and configured the classes you want to filter in jarFilter, gradle will compile the classes you created instead of the ones in the jar

[rupeshkk-iprogrammer]

ViewManagersPropertyCache

Thanks for the steps, i ll check

[Lunziyuan]

modify:

com.facebook.react.animated.FrameBasedAnimationDriver.java

line: 72

//throw new IllegalStateException("Calculated frame index should never be lower than 0");
return ;

use https://github.com/nekocode/JarFilterPlugin to replace class in jar.

can you tell me what's the difference with directly edit the file in node_modules ?

[imamrobani]

so what solution for this, can anyone tell me how to solve it?

[rupeshkk-iprogrammer]

I go through all the steps but it's not working.
can anyone find a solution on how to change in node_modules / java file?
we have a patch but after creating the release build we saw a patch (modified java ) file not working

[androidappteam]

@BennyTian JarFilterPlugin is not working R8 compression. Any suggestion

[saurabhkanswal]

I go through all the steps but it's not working. can anyone find a solution on how to change in node_modules / java file? we have a patch but after creating the release build we saw a patch (modified java ) file not working

Hey @rupeshkk-iprogrammer did you guys found a fix, we also made a patch
But looks like issue is not resolved.

[tabfed]

I go through all the steps but it's not working. can anyone find a solution on how to change in node_modules / java file? we have a patch but after creating the release build we saw a patch (modified java ) file not working

Hey @rupeshkk-iprogrammer did you guys found a fix, we also made a patch But looks like issue is not resolved.

me too

[rupeshkk-iprogrammer]

FrameBasedAnimation issue is resolved in RN 71.13

[saurabhkanswal]

Hey @aditya-keri-betterhalf
does the patch work for you ?
we also made a patch, but the issue is still coming.
we have used patch-package to make a patch.

our rn version is
"react-native": "0.69.7",

[tabfed]

How to solve the problem of not upgrading the version？