java.lang.NoClassDefFoundError: Failed resolution of: Lcom/facebook/drawee/backends/pipeline/info/ImagePerfDataListener;

[SitaMelark]

Description

Once my app is installed in the device i try opening it but it crashes. Used to work but recently i did a npm install, npm upgrade, npm update and installed the lastest react native version 0.73.0.
Already tried to reset cache and gradlew clean but didnt work.

Steps to reproduce

(Dont know how to reproduce, maybe by creating a project in react native 0.72.4 and trying to upgrade it)

React Native Version

0.73.0

Affected Platforms

Runtime - Android

Output of npx react-native info

info Fetching system and libraries information...
System:
  OS: Windows 10 10.0.19045
  CPU: (6) x64 Intel(R) Core(TM) i5-8400 CPU @ 2.80GHz
  Memory: 1.86 GB / 7.93 GB
Binaries:
  Node:
    version: 18.17.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn: Not Found
  npm:
    version: 9.6.7
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK:
    API Levels:
      - "33"
      - "34"
    Build Tools:
      - 30.0.3
      - 33.0.0
      - 33.0.1
      - 34.0.0
    System Images:
      - android-30 | Google Play Intel x86 Atom
      - android-34 | Google APIs Intel x86_64 Atom
      - android-34 | Google Play Intel x86_64 Atom
    Android NDK: Not Found
  Windows SDK: Not Found
IDEs:
  Android Studio: AI-223.8836.35.2231.10406996
  Visual Studio:
    - 17.8.34322.80 (Visual Studio Community 2022)
Languages:
  Java: 11.0.16.1
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: ^18.2.0
  react-native:
    installed: 0.73.0
    wanted: ^0.73.0
  react-native-windows: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Stacktrace or Logs

java.lang.NoClassDefFoundError: Failed resolution of: Lcom/facebook/drawee/backends/pipeline/info/ImagePerfDataListener;
 at com.gestorum.ReactNativeFlipper.initializeFlipper(ReactNativeFlipper.java:33)
 at com.gestorum.MainApplication.onCreate(MainApplication.java:60)
 at android.app.Instrumentation.callApplicationOnCreate(Instrumentation.java:1190)
 at android.app.ActivityThread.handleBindApplication(ActivityThread.java:6582)
 at android.app.ActivityThread.access$1400(ActivityThread.java:224)
 at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1887)
 at android.os.Handler.dispatchMessage(Handler.java:107)
 at android.os.Looper.loop(Looper.java:224)
 at android.app.ActivityThread.main(ActivityThread.java:7562)
 at java.lang.reflect.Method.invoke(Native Method)
 at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:539)
 at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:950)
Caused by: java.lang.ClassNotFoundException: Didn't find class "com.facebook.drawee.backends.pipeline.info.ImagePerfDataListener" on path: DexPathList[[zip file "/data/app/com.gestorum-SB2v2uWfMrjH0B3TmmtzKg==/base.apk"],nativeLibraryDirectories=[/data/app/com.gestorum-SB2v2uWfMrjH0B3TmmtzKg==/lib/arm64, /data/app/com.gestorum-SB2v2uWfMrjH0B3TmmtzKg==/base.apk!/lib/arm64-v8a, /system/lib64, /system/product/lib64]]
 at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:230)
 at java.lang.ClassLoader.loadClass(ClassLoader.java:379)
 at java.lang.ClassLoader.loadClass(ClassLoader.java:312)
 ... 12 more

Reproducer

.

Screenshots and Videos

No response

[github-actions]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template. A reproducer needs to be in a GitHub repository under your username.

[Muntader]

Hello, have you found a solution?

[parlet]

Problem

It looks like the ImagePerfDataListener has been moved.

facebook/fresco@ac00658: Move ImagePerfState and ImagePerfData to ui-common target:

- import com.facebook.drawee.backends.pipeline.info.ImagePerfDataListener;
+ import com.facebook.fresco.ui.common.ImagePerfDataListener;

The above change was merged into Fresco@v3.0.0, and RN v0.73 bumped Fresco to this version in commit 823839b.
I suspect that some necessary change was not made, hence the problem for upgrading users.

Solution/workaround

At the same time, ReactNativeFlipper.kt:14 mentions:

/**
 * Stub class that does nothing to ease the migration out of Flipper. Users should stop calling
 * `ReactNativeFlipper.initializeFlipper` in their `MainApplication.java` as this class will be
 * removed in React Native 0.75 or future versions.
 */

And indeed, if the ReactNativeFlipper.initializeFlipper() line in MainApplication.java is commented-out, the issue is resolved. 🎉

Alternatively, it's possible to keep Flipper without having to create a new project and transferring everything manually. One way to do this would be to check the changes from 0.72.7 to 0.73.1 using the upgrade helper, and manually merge the relevant parts, although this would be a very manual process.

Godspeed.

[cortinico]

java.lang.NoClassDefFoundError: Failed resolution of: Lcom/facebook/drawee/backends/pipeline/info/ImagePerfDataListener;
at com.gestorum.ReactNativeFlipper.initializeFlipper(ReactNativeFlipper.java:33)

The issue is caused by your update which is not done correctly.
Specifically once you update to React Native 0.73, you should remove your local ReactNativeFlipper file (which you still have as the package is com.gestorum. in the stacktrace).

See https://react-native-community.github.io/upgrade-helper/?from=0.72.8&to=0.73.1:

Please make sure you follow the upgrade helper correctly

[CyrusZei]

That worked like a charm, thx @cortinico

[SoyDiego]

Thanks @cortinico and @parlet for the solutions!!!! Works perfectly!

[Lanistar1]

The issue still persist even after using the upgrade helper

[bharathy-kannan]

How do I use flipper in react native if I remove it? I am on RN 0.75.3.

Thanks