Hermes enabled bundle causes white screen when installed from Google Play

[desmondmc]

Compiling a release with Hermes enabled causes a white screen after downloading from Google Play.

Literally everything else works fine, it only breaks after being uploaded to Google Play.

• Debug builds work.
• ./gradlew installRelease works.
• Even extracting the apks from the .aab using bundletool and installing them with adb on a device works.

I know that Hermes is running because global.HermesInternal != null, not to mention it's lightning fast 💨.

React Native version: 0.65.0
System:
OS: macOS 10.14.6
CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz
Memory: 22.53 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 11.6.0 - /usr/local/bin/node
Yarn: 1.12.3 - /usr/local/bin/yarn
npm: 6.8.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.4, macOS 10.14, tvOS 12.4, watchOS 5.3
Android SDK:
API Levels: 23, 26, 27, 28, 29
Build Tools: 27.0.3, 28.0.3
System Images: android-26 | Google Play Intel x86 Atom, android-27 | Google Play Intel x86 Atom, android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.5 AI-191.8026.42.35.5791312
Xcode: 10.3/10G8 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.6 => 16.8.6
react-native: 0.60.5 => 0.60.5
npmGlobalPackages:
react-native-cli: 2.0.1

Steps To Reproduce

1. Compile and package release build with Hermes enabled
2. Upload it to Google Play (Alpha or Beta)
3. Once the app is available download and install the version from Google Play
4. Launch the app -> White Screen

Describe what you expected to happen:

I expect bundles compiled with Hermes enabled to behave the same after being uploaded to Google Play.

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

• My build.gradle
• Device logs from adb logcat when launching the Play Store version of the app: hermes-prod-logs.txt

[anurag060]

Facing the same issue @desmondmc. Recently upgraded my project from 0.57.8 to 0.60.5. Also enabled def enableSeparateBuildPerCPUArchitecture = true and def enableProguardInReleaseBuilds = true. Can you please write here if you find a solution

[anurag060]

@desmondmc try uploading the apks instead of the app bundle. In my case, uploading the app bundle to the play store showed a white blank screen on start up. But, uploading all the apks generated(with def enableSeparateBuildPerCPUArchitecture = true) did the trick. Give it a try.

[herio]

Facing the same problem only when upload the bundleRelease to play store, assembleRelease is OK.
"react-native": "0.60.5",
"hermes-engine": "0.1.1",

[githubdoramon]

A (terrible) workaround is to first run assembleRelease (so the js bundle is generated), and then run bundleRelease.

I don't think this is related to Hermes though, since even when I disabled it I still have the same problem with bundling the app

[desmondmc]

Just tested with react-native 0.61.1. Still broken 😢

[panvourtsis]

same issue with @herio any test locally on debug or release is working. Only version returning the white screen is from the bundleRelease to play store

react-native: 0.60.4

[LydGol90]

I am getting the same issue, also only when I upload bundle to play store with Hermes enabled. assembleRelease works fine and all works fine with Hermes disabled. RN version 0.61.1

[radko93]

Please upvote the first post, don't post +1 or same issue. You can subscribe to this issue on the right side.

[RichardLindhout]

[Alaa-Ben]

Hey guys !

For me, it turned out it was a problem of SoLoader, which was fixed in 0.8.0. React Native 0.61.1 doesn't use this version yet, so the solution was to set it up manually by adding the following to app/build.gradle:

configurations.all {
     resolutionStrategy {
       force "com.facebook.soloader:soloader:0.8.0"
     }
}

I hope it works for you too :)

[radko93]

@Alaa-Ben cool. I will se if I can submit this as a PR.

[Alaa-Ben]

@radko93 Bumping SoLoader to 0.8.0 in the gradle properties should do the trick. Shoud I open a PR ?

[radko93]

@Alaa-Ben feel free, this should look like this 07d1075

[RichardLindhout]

@Alaa-Ben Have you enabled hermes?

App crashes in the pre-launch rapport of the Google Play.

com.facebook.react.common.JavascriptException: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
This error is located at:
    in c
    in RCTView
    in Portal.Host
    in c
    in c
    in n
    in _
    in f
    in p
    in GestureHandlerRootView
    in y
    in v
    in RCTView
    in RCTView
    in h, js engine: hermes, stack:

[Alaa-Ben]

@RichardLindhout Yes, Hermes is enabled. I had 2 issues (only when downloading from GooglePlay) before forcing Soloader to 0.8.0. Either:

1. White screen / crashes after splash screen.
2. App works but launches as debug (warning toasts, shaking device would make the debug menu appear, ...) even though it's supposed to be a release build (built with bundleRelease).

[RichardLindhout]

I have this know, maybe this can not work.

configurations.all {
    resolutionStrategy { force "com.facebook.soloader:soloader:0.8.0" }
    resolutionStrategy.eachDependency { DependencyResolveDetails details ->
        def requested = details.requested
        if (requested.group == 'com.android.support' && requested.name != 'multidex') {
            details.useVersion "${rootProject.ext.supportLibVersion}"
        }
    }
}

[radko93]

I can confirm that the solution from @Alaa-Ben worked for me when deploying to Google Play.

[desmondmc]

Can also confirm that @Alaa-Ben's solution worked for me. Nice work 👍

[SuhairZain]

We've been getting crash reports on our production app after upgrade to RN 0.61.5. Happens only to a minority of users, and we're unable to reproduce it on any of our test devices. We've released versions with hermes both disabled and enabled and we got the error libhermes.so could not be found on all of these. Also tried forcing the SoLoader version at 0.8.0. Same issue. Is anyone else facing the same?

What we've tried so far:

1. Hermes disabled (where we started).
2. Hermes enabled.
3. Hermes disabled and SoLoader forced at 0.8.0.
4. Hermes enabled and SoLoader forced at 0.8.0.

When we tried running a fresh RN app on an emulator, the app crashed immediately. It doesn't seem to be the same issue, but could be related. #28308

[benjipott]

Seems to be only google play test devices that throw this error. No worries

[SuhairZain]

@benjipott Is there a way to know if the device is a google play test device?

[mtiziano]

still throwing this error

[wibb36]

Still the same issue with RN 0.62.1

[Lipo11]

I'm on the 0.62.2 version and this bug has been fixed!

[radko93]

I can also confirm that is fixed now without any workarounds.

[elmotan95]

0.62.2 still have this issue when run on bluestack with release variant.

[tuanth89]

@RichardLindhout Which crash report module are you using ? Can you give me name of this crash report ? Thanks

[RichardLindhout]

This was done by testing in Google Play store. I use RNN and we switched back to APK to work around this issue. Are you using React Native Navigation too?

[tuanth89]

This was done by testing in Google Play store. I use RNN and we switched back to APK to work around this issue. Are you using React Native Navigation too?

Thank for reply. i use React Navigaiton. I want to know when app crash and trace log from it, like your screenshoot.

[mym0404]

Now, React Native 0.63 is using SO_LOADER 0.8.2. Then can we bundle application as aab without any further configurations?

[radko93]

@mym0404 yes, it should work directly.

[mrousavy]

I'm on 0.63.2 and this issue is still not fixed for me! Cannot run the Android App in Debug or Release with Hermes enabled or disabled on my Emulator!

[desmondmc]

Closing this issue as the original bug as described has been fixed.

[goul4rt]

@Alaa-Ben Was trying to solve this issue for past 2 days until I met your comment. Thank you very much!! I have found one problem though. Indeed bundleRelease now works in google playstore when I enable SoLoader(0.8.0), it is debug mode(i.e. just react-native run-android) that doesn't work anymore. App crashes on start. So at the moment, I have to comment out

configurations.all {
     resolutionStrategy {
       force "com.facebook.soloader:soloader:0.8.0"
     }
}

on android/app/build.gradle when I use debug mode to develop, and enable that part again for bundleReleases. Am I the only one with this issue??

This solution works with real devices but breaks react-native run-android on emulators, the app's crashing after open with errors like this:

java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libyoga.so caused by: APK was built for a different platform

Fixed
According to master branch of react-native https://github.com/facebook/react-native/blob/master/ReactAndroid/gradle.properties you need to change SoLoader version to 0.8.2

    configurations.all {
        resolutionStrategy {
            force "com.facebook.soloader:soloader:0.8.2"
        }
    }

Using this, all work fine in React-Native 0.60.6.

[Joshmatjjen]

@SnowLew App Still Crashes on Startup React native After installed from Play Store

"react-native": "^0.63.3",

project.ext.react = [
    entryFile: "index.js",
    enableHermes: true,  // clean and rebuild if changing
]

configurations.all {
        resolutionStrategy {
            force "com.facebook.soloader:soloader:0.8.2"
        } 
}

[lukebrandonfarrell]

This still occurs with React Native and Hermes, can we re-open the issue?

[goul4rt]

@SnowLew App Still Crashes on Startup React native After installed from Play Store

"react-native": "^0.63.3",

project.ext.react = [
    entryFile: "index.js",
    enableHermes: true,  // clean and rebuild if changing
]

configurations.all {
        resolutionStrategy {
            force "com.facebook.soloader:soloader:0.8.2"
        } 
}

I've try without hermes and works fine, but with hermes this issue continue.

[troZee]

In my case I needed to add hermes path for each android flavour

    if (enableHermes) {
        def hermesPath = "../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
        qaImplementation files(hermesPath + "hermes-release.aar")
        stageImplementation files(hermesPath + "hermes-release.aar")
        prodImplementation files(hermesPath + "hermes-release.aar")
    } else {
        implementation jscFlavor
    }

[ThinkSalat]

I'm on react-native 0.63.4 and this is still happening for me when I have hermes enabled. Soon as the app opens up, flashes a white screen and closes. It happens when I do gradlew assembleRelease and install to an emulator, as well as an .aab uploaded to the play store.

Is there any way to tell which Hermes version you're using?

[andre-krueger]

AAB will be required to use in some months and it seems that JSC is more or less abandonware (it also causes a lot of crashes, which were fixed the moment we switched to Hermes).

Please fix this issue.