facebook / flipper

A desktop debugging platform for mobile developers.
https://fbflipper.com/
MIT License
13.37k stars 952 forks source link

Tabs Network/LeakCanary are always empty on Flipper 0.237.0 #5644

Open Flocurry opened 4 months ago

Flocurry commented 4 months ago

🐛 Bug Report

I've installed flipper-server@0.237.0 (because it's the latest version where the plugin react-devtools works) on my Windows laptop. I've configured Flipper and everything is fine. My app which run on my device is detected by Flipper.

I've configured on my app flipper-network-plugin/flipper-leakcanary2-plugin I've added in my build.graddle file these lines :

FLIPPER_VERSION = '0.237.0'

implementation 'com.squareup.okhttp3:okhttp:4.9.1' implementation 'com.squareup.leakcanary:leakcanary-android:2.7'

// Flipper debugImplementation "com.facebook.flipper:flipper:$FLIPPER_VERSION" debugImplementation "com.facebook.flipper:flipper-network-plugin:$FLIPPER_VERSION" debugImplementation "com.facebook.flipper:flipper-leakcanary2-plugin:$FLIPPER_VERSION"

I've created a ReactNativeflipper.java file

package ;

import android.content.Context; import com.facebook.flipper.android.AndroidFlipperClient; import com.facebook.flipper.android.utils.FlipperUtils; import com.facebook.flipper.core.FlipperClient; import com.facebook.flipper.plugins.inspector.DescriptorMapping; import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin; import com.facebook.react.ReactInstanceManager; import okhttp3.OkHttpClient; import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor; import com.facebook.flipper.plugins.network.NetworkFlipperPlugin; import com.facebook.flipper.plugins.leakcanary2.LeakCanary2FlipperPlugin; import android.util.Log;

public class ReactNativeFlipper { public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) { if (FlipperUtils.shouldEnableFlipper(context)) { final FlipperClient client = AndroidFlipperClient.getInstance(context);

  // Add plugin InspectorFlipperPlugin
  client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));

  // Create the NetworkFlipperPlugin
  NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
  if (networkFlipperPlugin != null) {
      // Configure OkHttpClient with NetworkFlipperPlugin
      OkHttpClient okHttpClient = new OkHttpClient.Builder()
              .addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin))
              .build();

      // Add NetworkFlipperPlugin configured with OkHttpClient
      client.addPlugin(networkFlipperPlugin);
  } else {
      Log.e("ReactNativeFlipper", "networkFlipperPlugin is null");
  }
  client.addPlugin(new LeakCanary2FlipperPlugin());
  // Start Flipper
  client.start();
}

} }

And this is my onCreate function in the MainApplication.kt file :

override fun onCreate() { super.onCreate() SoLoader.init(this, false)

if (BuildConfig.DEBUG) {
    val reactInstanceManager = reactNativeHost.reactInstanceManager
    ReactNativeFlipper.initializeFlipper(this, reactInstanceManager)
}

}

I use axios in my app to make http request

On my device, I saw the LeakCanary log but nothing on Flipper. The Network tab on Flipper is empty, even if axios request are called

Environment

Flipper@0.237.0 Android 14 Lenovo Tab M10 axios@1.7.2