Detox Hung on Splash Screen for React Native App - react-native

Trying to set up Detox for my react native app. It seems to hang on the splash screen. I've managed to run tests on a seperate app with no splash screen. On the splash screen app it simply hangs and it outputs :
detox[34248] ERROR: Error: Exceeded timeout of 30000ms while handling jest-circus "setup" event
detox[34248] INFO: Scratch Test is assigned to undefined
I recognize that a showing of 'undefined' is incorrect.
I see reference for the 'waitFor' function but the links to the documentation all seem to be broken and I can't find a reference to it in the docs.
I'm trying to understand how to go about debugging this or if the splash screen is at all responsible for the hanging / error.

Do you use the "react-native-splash-screen" library? That apparently has some issue working with Detox and once I removed that, I did not have the timeout error.

Another potential source of the hanging is an animation that runs in the background. Detox tries to synchronize correctly, but isn't always able to, per their docs: https://github.com/wix/Detox/blob/master/docs/Troubleshooting.Synchronization.md.
I found that by adding
// to allow for less flaky detox tests
console.disableYellowBox = true;
to my app.tsx I was able to remove some warnings that were interfering with Detox.

Related

Troubleshooting Maximum Stack Call Size Exceeded Error in Expo App

I'm getting the infamous Maximum Stack Call Size Exceeded error in Expo app.
I understand that it's caused by code that keeps calling itself, creating an infinite loop.
Does Expo or React Native provide more information about where this error is? I've already been through my code and didn't find anything. Something a bit more specific would be helpful in narrowing down the issue.
What's evn more interesting in this case is that I only get the error in the Expo Go app. When I run the app in Android Emulator, I don't get the error and the app works fine.
Any suggestions?
I found the culprit and it's totally unexpected.
I develop web front-end in React and mobile in React Native. One of the primary reasons is code sharing.
I have a file that contains all the action types I use in managing the state of my app. Technically not but kind of an enum file. They look like this:
export const SET_IS_AUTHENTICATED = 'SET_IS_AUTHENTICATED';
export const SET_USER_INFO = 'SET_USER_INFO';
In this file, I have exactly 486 action types and this is exactly what was creating the error.
I don't need all of these action types in my mobile app but I'd decided to keep things consistent and I thought this was totally harmless so I've been sharing this enum file in all my React and React Native apps.
Here are two interesting observations:
I just started developing with Expo. Prior to that I was using straight React Native -- created through React Native CLI and I NEVER got any errors for using this file.
Even more interesting is that the Android Emulator does NOT throw any errors in the same project. Only the Expo Go app throws this error.
This may even be by design and not necessarily an undesired side effect of the Expo Go app. Not sure. I'd love to know if others have had similar experiences with the Expo Go app.
This is probably not helpful, but when I upgraded from expo sdk 41 to 43 then I started getting this error. I made no code changes besides the upgrade and now when my app loads I get the error Unhandled promise rejection, [RangeError: Maximum call stack size exceeded.]. I get the error on expo go on both platforms

Infinite loop callbacks_poll React Native Debugger

I see this endless loop in the debugger network pane, both in Chrome and React Native Debugger using iOS Simulator and RN 0.49.5.
It basically shows and endlessly increasing number of network requests with the name callbacks_poll. I even see them when return null from my main App file. Tried clearing cache, resetting simulator, hard restart, etc. Any idea how to stop this?
I just came across to the same error, with a bit of search found that the reason was the realm library.
If you do use realm, you can follow up the github issue here: https://github.com/realm/realm-js/issues/1538

Is there a way to catch the react-native redbox error

When an redbox error happens, react-native app often stop responding to touches or behave weirdly.
This is much worse than the app crash because a release version won't show a redbox and users don't know what happened and why the app stop responding. They will delete your app if they cannot do anything with it.
You cannot always make sure there is no bug in your app. So when it happens, we should make sure our users could be remind to restart the app or they will fail to use it.
Catching the redbox error of react-native could let you pop a warning modal box and remind the user the app has encountered some error and then wholly quit the app to let the user restart it.
Found this question randomly while searching for something else, but in the hopes that it might help someone, have a look at the newly introduced componentDidCatch lifecycle method introduced in React 16 / React Native 0.50
More info here
This will show a fallback UI for the component tree the boundary encompasses.
A long time passed but this could help someone:
A react native module that lets you to register a global error handler
that can capture fatal/non fatal uncaught exceptions. The module helps
prevent abrupt crashing of RN Apps without a graceful message to the
user.
https://github.com/master-atul/react-native-exception-handler

React Native: Recurring Could Not Connect to Developtment Server error (timeout?)

I've been trying out React Native lately and I got everything setup right.
Im running my Android Virtual Device and my RN app is displaying and reloading just fine.
However, every after a certain amount of time, when i hit RR (refresh) i get this error:
The only way I can seem to recover from this is if I rerun React native command:
react-native run-android
After that, it's ok again..... until after a few minutes, I get that dreaded RED SCREEN OF DEATH again.
What could be causing this? Timeout of some sort?
TIA
There are some reasons for that.
You have problem on JS files you are using (you can see errors on
react packager)
You are closing the react packager terminal after run your app
It closes itself automatically with some terminal reasons
Do you get any error on react packager?

React native server stops transforming every time

React native was working perfectly till today. But, Suddenly I'm facing a weird error. Whenever I try to load js from the react native android app. I'm getting the following messages.. Transforming progress bar is stopping exactly in 96% every time.
Let me know, If you need any extra information.
Thanks,
In my case, This was due to a package called MaterialReactNative. If there is some problem in the package, this will be stopped in transforming. If you want to know which package is making this problem. You can start react native in verbose mode.
react-native start -vvv
I hope that this will help few people who are facing the same issue.