React-native: Application Reload Hang while JS Remote Debug is active (Android)

[bgiavotto]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

1. react-native -v:0.47x
2. node -v:8.2.1
3. npm -v:3.109
4. yarn --version: 0.27.5

Then, specify:

• Target Platform:iOS, Android

• Development Operating System: Windows

• Build tools: issue is not specific

Steps to Reproduce

(Write your steps here:)

1. Create a simple react native application using react-native Init Prj and run an android emulator
2. switch to Prj folder then launch react-native-cli run-android
3. After the build is completed the app start in emulator, if remote js debug is not enabled enable it
4. force a reload via the menu or via hot reload
5. Application try to reload, then hang up and freeze.

Expected Behavior

(Write what you thought would happen.)

Reload should work fine and debug may stay connected

Actual Behavior

(Write what happened. Add screenshots!)

Reproducible Demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

This issue is around from almost two years the first one i've noticed was referring to react 0.27.
I think it's is a real showstopper because it limits severely the debugging and hot features of react native.
if this is a no-issue but instead related to some mistake in react configuration i think should be well documented somewhere

[pewh]

+1 also face same issue

[bgiavotto]

i think it's a very old bug that is around and never fixed. searching through the internet and on git hub i've found that most of the time the issue is closed without any real solution or workaround. Actually it does appear that the reason of the hang is unknown.
Nor it is easy to find what part to 'blame' for the bug

[StarHosea]

+1

[agat]

For me on Mac is same bug too.

[Gremlin80]

it does appear that after the debugger reconnect, something hang. Something there are also two connect events.
I guess that the debugger interaction is with the node.js debugger.
is the code that work with node js debugger a javascript or platform-native ?

[TheBoz]

+1, same issue, a real stumbling block to debugging complex applications. Are there any good alternatives?

[Gremlin80]

what is unclear to me is if there is someone of reactnative taking care of serious issue or if it is all thanks of comunity effort. Afterword, it has been a while that the issue is around, no one noticed?

[elizamaria]

I'm also having this issue only after I updated RN to 0.47

[Gremlin80]

the issue was opened more than one month ago and still no feedback from react..... is this project alive?

[raduflp]

it seems somewhat related to console.log performance,
in my case disabling redux-logger greatly reduces the number of reload hangs when console is open, although it doesn't eliminate the problem.

[rimzici]

Same issue.
With the Remote Debugger on, JS is not reloading. On switching the debugger off it works fine.

Ubuntu
Android
react : 16.0.0
react-native: 0.50.1

[Balamir]

Same issue but if I change the browser then it works.

[rimzici]

In my case the issue appeared after the react native upgrade.(0.42 -> 0.50)
And after a lot of hassle, identified, for me, it has something to do with redux-persist.

https://github.com/rt2zz/redux-persist/issues/582

The callback was never getting called on debugging, again it is not the case always.
I tried reducing the complexity of the app, by replacing all the nested navigators with a single screen and leaving all other redux store configurations as such. This time works fine, but after if kept on reloading for a few times once in a while it gets stuck!

Still not sure what exactly is the issue!

[GmeduoyeClaymore]

If the rest of the threads reporting the same issue are anything to go by the guys from React are going to wait an appropriate amount of time and then close this thread because it hasn't had any activity for a while. Please stop doing that guys. The issue is easily reproducible with your own example projects. You don't have to infer from the absence of activity on a thread that the issue has magically gone away ... You can actually check ;)

[dannycochran]

@javache -- I think you fixed a similar bug for iOS (https://github.com/facebook/react-native/commit/64825389dfb4e01d5b30cd63b0b41937a9bb431d).

Any thoughts on what could be going wrong with the Android bridge?

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[GmeduoyeClaymore]

Seems better if you build your RN from master.

On Sat, 27 Jan 2018 at 21:17, stale[bot] [e-mail] wrote:

This issue has been automatically marked as stale because it has not had
recent activity. It will be closed if no further activity occurs. Maybe the
issue has been fixed in a recent release, or perhaps it is not affecting a
lot of people. If you think this issue should definitely remain open,
please let us know why. Thank you for your contributions.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/15476#issuecomment-361015891,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AeYN61sIs8w5i-S4yGH0_xAzM1JiVQO3ks5tO5J2gaJpZM4O1f-v
.

>

Gbemiga Meduoye
Managing Director
[image: Claymore Minds] http://www.claymoreminds.com/
[email protected] [e-mail]
[phone] www.claymoreminds.com

[susanxia1006]

+1

[jcodlingcc]

This is an ongoing issue on an otherwise great platform. Facebook doesn't have this issue in house? I'm sure if they did it would be fixed quickly.

[kitdesai]

@jcodlingcc they must be spending all their time on ios! haha

i've been having the same issue.. my workaround is to force quit the app and launch it again, then it seems to work. defeats the purpose of a reload option, but at least it's not stuck hanging..

[0xc0d3r]

+1. We are facing the same issue in both Android and iOS. Any updates on this?

[gianpaj]

I have redux-persist and upgrading it to version 5.7.0 (link) fixed the issue.

[jcodlingcc]

That is probably my issue as we are still a full release behind in our redux-persist package.

Thanks @gianpaj

[react-native-bot]

Thanks for posting this! It looks like you may not be using the latest version of React Native, v0.53.0, released on January 2018. Can you make sure this issue can still be reproduced in the latest version?

I am going to close this, but please feel free to open a new issue if you are able to confirm that this is still a problem in v0.53.0 or newer.

_{How to Contribute • What to Expect from Maintainers}

[lorencs]

Having the same issue with RN 0.54, redux-persist 5.9.1. Have tried removing redux-persist, and it still hangs with remote debugging on.

[lorencs]

Apparently also enabling hot reloading fixes the issue caused by enabling remote debugging as suggested here https://github.com/wix/react-native-navigation/issues/963#issuecomment-291143390.

[itinance]

For me this happens on RN 0.53.0 if i load the bundle per fix IP from my Machine. It doesnt matter here if i want to load the bundle onto iOS simulator or on real iOS-Device (while the latter was the reason for using real IP-adresses).

This way the bundle can be loaded completely at least onto iOS-Simulator:

jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];

But this way will hang at 100%:

jsCodeLocation = [NSURL URLWithString:@"http://192.168.178.68:8081/index.ios.bundle?platform=ios&dev=true&minify=false"];

(the IP-address itself is not the issue here, i have double checked it and for the first 99% the packager works fine)

Btw, to download the whole bundle via a web browser or in terminal with "curl" or "wget" will NOT stop at 100%.

[vincenzovitale]

This should be reopened and fixed in at least a couple of previous version of react native.
The framework is constantly breaking compatibility or deprecating methods so upgrading is not a breeze. Issues like this affect so much productivity and they are so annoying, above all if used to the fast Instant Run capabilities of Android Studio

[juanlet]

same bug on ubuntu 16.04 here...v 0.49 of RN and node 8.9.1...works with non debug mode but white screen if I turn on debug

[joshsiegl1]

I'm seeing the same issue, RN 0.54.0, Expo version 26.0.0, app hangs at 100%. Disabling remote debugging allows me to launch the app. I can see logs into the XDE client but that's about it. Very frustrating as I relied pretty heavily on the remote debugging feature in the previous version, only after the upgrade am I seeing this issue.

[napatwongchr]

I have the same issue. I've set up project by native method.
"react": "16.3.1",
"react-native": "0.55.0"

[dajaffe]

+1...

[ramonsenadev]

Same here... 0.54.2

[noumantahir]

same issue on ios when running on real device...react-native - 0.52

[PandaGeek1024]

For me, Chrome developer tool stop working on android because it is getting this issue "origin is not allowed by access-control-allow". You wouldnt see it on chrome but when you debug on safari you will see it.

The way to fix it is to open chrome with this command in terminal:
open -a Google\ Chrome --args --disable-web-security
And then reconnect for debugging, things works again.
For safari, under Develop menu, select disable cross origin restriction.

[SSTPIERRE2]

I don't have this issue on iOS at all with RN 0.51.0, only on Android.

[putuyoga]

i got this issue too

[smilenkovic]

+1

[johnecon]

+1

[jkyletreman]

+1

[idegeus]

+1

[ThomasFindlay]

+1

[putuyoga]

In my case, It is caused by AsyncStorage on Android is quite broken on recent version of React Native when debugger is activated. Alas, this API is used by redux persist and some of our service.

The only solution is we need to override the usage of AsyncStorage by create our own custom storage service on android (but use it only on development mode, to prevent break on production).

anyone interested the code, check it here:
https://gist.github.com/putuyoga/abdc0e8c1ddd0c9ba05d721a148ba657

further reference:
https://github.com/facebook/react-native/issues/12830
https://github.com/facebook/react-native/issues/18372
https://github.com/facebook/react-native/issues/7605

[ghost]

+1

[seco35]

Same here with react-native 0.57.1
and IOS 12

[FrankVio]

+1

[CapitanRedBeard]

I got this working for me downloading and simply using react-native-debugger.
Which leads me to believe it's related to the Chrome CORS issue that has been mentioned.

I would suggest moving all discussion over to one of these threads: #18006 || #17970

[SilverBboy]

In my case the reason behind this was that the debugger page was left open from previous sessions. Closing the tab completely and then opening the debugger in a new tab solved the issue.

[rozzy]

In my case the reason behind this was that the debugger page was left open from previous sessions. Closing the tab completely and then opening the debugger in a new tab solved the issue.

Worked for me too 👍

[sultan2Dilawar]

+1