React Native TypeError: Cannot read property 'indexOf' of undefined, js engine: hermes - react-native

I am working on a react-native project. I have been running the application on Android and iOS devices for the past 6 months. I haven't faced any problems till now. But suddenly today, while I am trying to run the application I am getting a compile error with the description. TypeError: Cannot read property 'indexOf' of undefined, js engine: hermes. I tried to debug the issue and found that there is an issue while connecting to the remote debugger. But the strange thing here is even I haven't selected the remote debugging option from either of emulator or simulator.
So, I have enabled the remote debugging option from the emulator to get a quick fix. It is working fine. But why is it connected to the remote debugger even after the fresh installation? And the quick fix comes with its own issues. The application is functioning a bit lag and inconsistent. I suspect there is an issue with the metro bundler. I have removed the cache using rm -rf /tmp/metro-* command, cleaned gradle using ./gradlew clean command, and cleaned iOS build by deleting derived Data. But still, the issue persists.
Is there any other step am I missing here? If it is the issue with the metro bundler, is there any way to reset it completely? Please check the attached image for more information.

The reason for this issue in my case is not with the metro bundler or its cache but with one of the third-party dependency named auth0-js(In your case it would be different). It is adding some global or window properties which are causing the above-mentioned issue. I have removed it and replaced with the library which is closed to react-native ecosystem which eventually resolved the issue.

Related

Blank screen when building React Native app in release mode of android

I am building a React Native app and it works fine in debug mode, but when I try to build it in release mode, it shows a blank screen. I have tried several things to troubleshoot the issue, such as updating my dependencies and checking for any syntax errors, but I haven't been able to find the cause of the problem. I am not seeing any error messages, and the app seems to be working as expected in debug mode.
I am not sure what is causing the issue in release mode, and I would appreciate any help or suggestions.
Here is what I have tried so far:
I have checked that my React Native dependencies are up-to-date and correctly configured.
I have ensured that the bundle is being correctly packaged in the binary APK.
I have verified that there are no syntax errors in my code.
Use this error handler https://github.com/a7ul/react-native-exception-handler to catch problems in production. It supports both JS and Native side errors

Unable to load script. Make sure you're either running a Metro server (run 'react-native start') or that your bundle index.android.bundle is packaged

So this has been asked before but I'm asking it again because nothing has worked, I've read through all of the similar posts I could find and all but one has semi fixed the problem.
https://medium.com/#adityasingh_32512/solved-unable-to-load-script-from-assets-index-android-bundle-bdc5e3a3d5ff
This medium article is the only solution that i can find that will get debug builds running again but that is only because it is pre packaging the javascript bundle and not really fixing the problem of the app not connecting to the metro server, once the debug build is running via this method I'm unable to shake the device and get the debug menu to show up.
I've been developing this app for probably 10 months, live for 3-4 months, and can usually trudge through these errors that pop up but this one is tricky.
I've been using cleartextTrafficPermitted="true", tried implementing a custom network security config android:networkSecurityConfig="#xml/network_security_config", tried a different physical device, cleared the metro cache, deleted .gradle/ build folders, cleaned, rebuilt.. All with the same end result of the app crashing on boot and the same error in logcat Unable to load script. Make sure you're either running a Metro server (run 'react-native start') or that your bundle 'index.android.bundle' is packaged correctly for release.
Release builds work but that's because its not trying to connect to the metro server, pretty stumped on this one.
Answering this for others that might find it useful. Still not sure what I did wrong but in the process of setting up a CI/CD pipeline for the app I re cloned the project and magically android debug builds started working again. No changes to the code, the android project must have gotten corrupted somehow so recloning allowed android studio to start from square one. Weird one.

"Unable to resolve module" debuggerWorker errors in recent react-native releases

I keep my project(s) relatively up to date with the latest RN releases. This error seems to be coming up more and more lately.
Error: Unable to resolve module `./debugger-ui/debuggerWorker.d9da4ed7` from ``:
None of these files exist:
* debugger-ui/debuggerWorker.d9da4ed7(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
Really makes it hard when trying to debug issues and a debugger statement does noting and errors are not reported to the browser tab where the console output goes.
I've already tried wiping node_modules. Is this a known issue with a concrete fix available?
Got stuck with this exact issue for hours. Just found that this occurs only on device where app is already installed with debug mode enabled.
I fixed it by:
uninstalling manually app from device (cmd+H to display simulator home) then long click on app icon and click on cross to delete app => this forces disabling debug mode,
then run app again from xcode.
Enabling debug mode after that works normally.
I had to come across a similar issue after updating #react-native-community/cli-debugger-ui to 4.2.1. Tried out several methods, nothing worked. Reverting #react-native-community/cli-debugger-ui back to 3.0.0 resolved the issue for me.
I closed the app (pressing home twice and swiping up), then started it again from the simulator and it worked.
Happens to me recently using expo and android.
The solution was to clear all Expo Go data:
Long press the Expo go icon
Then select App info
At the bottom of the screen, press Clear Data
And press Clear all data
Relaunch expo go and the react native app

Unable to find module for EventDispatcher React Native

On starting application using react-native run-ios its showing error on simulator Unable to find module for EventDispatcher
Stop remote JS debugging and then reload the app
It will give you the appropriate error message, most likely missing some render on one of your components. That fixed it for me.
So this issue happened to me after I upgraded to RN 0.59.x.
I was getting this error when live reload was enabled or if i tried to refresh screen on iOS by pressing CMD+R.
Related issues:
Unable to find module for UIManager
Unable to find module for
DevLoadingView
Unable to find module for EventDispatcher
Here's how I solved it:
Edit your AppDelegate.m file and add the following code before the #end
#if RCT_DEV
- (BOOL)bridge:(RCTBridge *)bridge didNotFindModule:(NSString *)moduleName {
return YES;
}
#endif
This will fix the issue.
Link to the fix on github.
Related discussion on github.
Live reload and debug mode all should work without problems now.
This seems to be an issue when using the remote debugger with certain RN versions above 0.58. Using react-native-debugger should solve the issue as it supports RN versions above already.
It can be downloaded from the following link:
https://github.com/jhen0409/react-native-debugger/releases
I've started receiving this error after upgrading RN from v0.57.3 to v0.58.6.
Running packager with yarn start -reset-cache / react-native start --reset-cache fixed the issue for me.
What worked for me was simply stopping remote debugging as mentioned by #Hackman,
THEN killing the browser debugger, cleaning Xcode and rebuilding.
Couldn't tell you why, but the issue went away.
I'm using detox, what worked for me was switching the build command from
-configuration Debug
to
-configuration Release
It will no longer fetch from metro bundler and instead use the js bundle from the build. When I'm coding the tests, I build with debug since I'm fine with occasionally seeing the error, since I like the connivence of not having to constantly build and letting metro bundler do it for me.

React-Native Fresh Install Compile Error

I've created a few react-native projects, and since updating to Sierra OSX and Xcode 8, upon opening each project, I get the error:
Application AppName has not been registered. This is either to due to a require() error during initialisation or a failure to call AppRegistry.registerComponent.
I've gone back to basics, uninstalled and reinstalled node, reinstalled latest react-native, created a fresh init, and still get the error. I've looked up and removed the custom-compiler-flags, as suggested here.
This is a real problem, if anyone has any insights I would be very appreciative!
I was having this error last night! All I did was to remove the node_modules, install then again and run the app again, it worked. – Crysfel