Hiding ErrorBoundary Red Screen in React Native dev mode - react-native

So ErrorBoundaries are a pretty cool thing and all,
but in Development, they show a red (dismissible) Error Screen by default which always needs to be dismissed, before the Fallback-Component is revealed.
This is fine since it doesn't happen in release builds, yet incredibly annoying for testing error states.
Is there a way to disable the red screen in React Native?
All suggested answers in this thread haven't worked for me.
Would be very thankful for any help!
Thanks a lot!

Related

React Navigation Stack Navigator does not update ui on iOS

When screen height changes (In the case of my project because a custom bottom tab is removed for certain screens), the Stack Navigator height does not update to occupy the entire screen anymore for some reason.
The same scenario works just fine on Android and on the Web for some reason, on iOS, when a view that was occupying some portion of the screen is removed after the stack screen was already being rendered, the Stack does not change its height.
Please take a look at this minimal expo snack example that demonstrates the issue and compare going to the 2nd screen on iOS emulator versus going to the 2nd screen on Android for example.
Expo Snack
Adding a key={currentScreenName} to Stack.Navigator fixes the issue but that is not really a viable solution since it will cause a re-render and the screen will flicker when transitioning between the pages.
I know that using a bottom tab this way is not really ideal but I was wondering if someone might have any good suggestions as to how this can be addressed.
Thank you.
Quick note, this seems to be working just fine with #react-navigation/stack but not with #react-navigation/native-stack

Unknown and empty white page suddenly appears from bottom while typing

A lot of iOS users (mainly iOS 15, but iOS 14 also) started to report a strange behaviour: while they're typing in the login screen or signup screen, the app became blank.
Watching the videos provided, it seems that a white "something" (like a modal, but not a modal) comes from the bottom at any time they are writing inside text input and cover the full app, so the only thing the user can do it's to kill the app.
It's impossible for us to recreate this behaviour (both on simulator than real devices).
Any idea or any known issue?
react-native version: 0.63.4
Found:
It's a well-known bug of KeyboardAvoidingView on iOS when user enables "Prefer Cross-Fade Transitions". They just forgot to solve it or, at least, add a warn on KeyboardAvoidingView documentation.
https://github.com/facebook/react-native/issues/29974
(thank you Wilson!)

How to remove white flashes on react-native app on Android?

When my app is launching I can see a brief white flash when screens are changing. I have a dark theme app so it's pretty annoying to see those flashes.
I have found react-native-flash-screen module which could help me (install, link, edit MainActivity.java, import to App.js) but after installing of it my app goes to loop of rebooting.
Does someone know how to prevent white flashes, probably, on another way?
it's hard question because I have not seen your code
but
wrap your app container with a view and style that backgroundColor to black
this might help your

REACT NATIVE: Modal temporary closes (flickers) when app is minimized by Menu Button

Using the react native's official Modal component
Is there any way to prevent the behavior when the modal is open, if i press the menu button of the mobile (built-in one) the modal flickers and closes temporary exposing the background view. Please see the attached url of the GIF for clarification . I am also not sure whether its a default behavior in react native or not.
https://imgur.com/LeTtNj5
Thanks in advance
This isn't so much a solution as much as it's guidance. You haven't really given enough detail to help you out properly. Best if you can share the code or setup a reduced test case at https://snack.expo.io that we can fiddle with.
That said, I'm not totally sure. This is an interesting problem, and I'm curious if you'll find a possible solution and it may depend on your implementation details. For instance, is the modal part of the navigation stack (react-navigation?) or is it an imported component? Either way, I would begin by playing with componentWillUnmount. Does it get called? If so, perhaps you can insert some black magic there to minimize the effect, but you'd first need to isolate what specifically is going on before you can hope to solve it.

running react native in xcode, my error screen is white. Cannot see the error messages

When I am running react native in xcode, my error screen is white. See screenshot. If I highlight one of the rows, I can then see the text. But this seems pretty odd. Any ideas what would have caused this? Wasnt always the case.
I recently had the same issue, and I used git bisect to find the commit where the problem was introduced. In my case I found that when we changed our launch screen from being a .XIB (LaunchScreen.xib) to a Storyboard (LaunchScreen.storyboard) it caused my error screen to look like yours, so reverting those changes fixed it for me.