[React Native SDK 10.x] identify doesn't resolve only for Android in development mode because of RN's Flipper integration

[Bardiamist]

Migrated from launchdarkly-react-native-client-sdk@9.0.1 to @launchdarkly/react-native-client-sdk@10.0.0. Works on iOS but on Android launchDarkly.identify doesn't resolve/reject.

Repro:

const launchDarkly = new ReactNativeLDClient(config.launchDarklyKey, AutoEnvAttributes.Disabled);
await launchDarkly.identify({ kind: 'user', key: '123' });
console.log('identified'); // this console.log will never be called

[yusinto]

Android has an issue with Flipper blocking streaming network connections in debug mode. If you are running android in development mode, streaming connections and hence the identify call will be blocked. Please try running Android in release mode as documented in the example app readme in step 4.

# Note for android, there's an issue with Flipper interfering with streaming connections
# so please run the release build. There's no such issues with ios.

To be clear, you need to run expo run:android --variant release to fully exclude Flipper when running Android.

[Bardiamist]

Strange, launchdarkly-react-native-client-sdk@9.0.1 worked, can you implement same way until Flipper will be fully removed? Or is itpossble to remove Flipper now somehow for LaunchDarly fix?

Also please remove logs as info: [LaunchDarkly] Closed LaunchDarkly stream connection by default.

[yusinto]

To be clear this is not an issue with the React Native SDK. As workaround for Android:

• If you are using Expo, you'll need to do a native build in release expo run:android --variant release
• If you are using Expo and want to debug and hot reload, you'll need to do a native build in debug expo run:android --variant debug and then go to the android folder and manually find and remove all references to flipper. This is a reported issue in the Flipper repo.

If you are using the expo-go app on Android, there is no way to disable Flipper and so this is not an option. Please use one of the above two native build options.

In regards to the info log, this is a useful log to indicate the streaming connection status. It's only logged very infrequently on identifying so it should not be a problem to most people. However, if you want to stop this, you can choose to replace the default logger with a custom logger. Read more on how to do this at our docs site:

const options: LDOptions = {
  logger: new BasicLogger({
    level: 'warn', // change this to however suits you best
    destination: console.log,
  }),
};
const featureClient = new ReactNativeLDClient('mobile-key-123abc', AutoEnvAttributes.Enabled, options);

[Bardiamist]

I use bare React native 0.73.4

LaunchDarkly works if remove:

1. android/app/build.gradle: implementation("com.facebook.react:flipper-integration")
2. android/app/src/main/java/com/valr/app/MainApplication.kt: ReactNativeFlipper.initializeFlipper(this, reactNativeHost.reactInstanceManager)

Not sure why in 0.73 it wasn't removed https://reactnative.dev/blog/2023/12/06/0.73-debugging-improvements-stable-symlinks#deprecated-debugging-features

But I'll prefer don't remove it manually and wait for next React native version or LaunchDarkly.

[louis-launchdarkly]

I pinned the issue, updated the title, and added a summary for other developer's information.

Android has an issue with Flipper blocking streaming network connections in debug mode. The React Native 0.73 version and the current Expo still have the Flipper integration in debug by default. Please refer to @yusinto and @Bardiamist's comments above for work around.

[joeyhotz]

has anyone come up with a fix for this in an expo bare workflow?

I've written an expo config plugin to remove flipper from the android build with the steps above but it still doesn't seem to resolve when we try identify.

const {
  withAppBuildGradle,
  withMainApplication,
} = require('@expo/config-plugins');

// while react native is still including flipper by default for
// android dev builds, we need to remove it from the build.gradle and MainApplication.kt
// files to fix launch darkly streaming connection issues.
// it can be removed when react native removes flipper from the default android dev build
// more info here
// - https://github.com/launchdarkly/js-core/issues/375
// - https://reactnative.dev/blog/2023/12/06/0.73-debugging-improvements-stable-symlinks#flipper--react-native-integration

const withRemovedFlipperAndroid = (config) => {
  config = withAppBuildGradle(config, async (config) => {
    config.modResults.contents = config.modResults.contents.replace(
      'implementation("com.facebook.react:flipper-integration")',
      '',
    );
    return config;
  });

  config = withMainApplication(config, async (config) => {
    config.modResults.contents = config.modResults.contents.replace(
      'ReactNativeFlipper.initializeFlipper(this, reactNativeHost.reactInstanceManager)',
      '',
    );
    config.modResults.contents = config.modResults.contents.replace(
      'import com.facebook.react.flipper.ReactNativeFlipper',
      '',
    );
    return config;
  });

  return config;
};

module.exports = withRemovedFlipperAndroid;

[growabeard]

@yusinto can you possibly link an issue on Flipper's Github for this? I tried searching for "streaming" and "network" and didn't come up with much. I would think this is a bigger reported issue than just LaunchDarkly, since it affects all streaming.

[sli-rbi]

for anyone still having issue, check out this:

https://github.com/expo/expo/issues/27526

[louis-launchdarkly]

@sli-rbi - Thank you so much for linking to the expo issue! It seems quite a few developers on that issue were able to resolve their issue based on the instructions there.