When I'm trying to use Remote JS Debugging in Google Chrome shows Cached Bundles. See the image below.
Remote Debugger UI Screenshot:
On my emulator its not connecting to remote debugger.
Android Emulator Screenshot
Is there anyone who encountered this problem?
I'm using React Native Version 0.47.
Thanks in advance.
If you use Chrome, clear cache from browser and reload app from react native. This fix my issue :)
Get rid of that final forward slash and it should kick you to the normal debug window. I'm running 64.0.3282.186 version of Chrome and this works for me. However, I know someone who says they get force redirected to the address with the forward slash, so I hope you're not in that boat.
To fix the error, you need to clear your cache in chrome and it will work again.
Close the packager and install the app again. This worked for me.
Related
With old Android versions, app is so slow working when debug js remotely is active. Is there a way to see the logs which we have on Chrome ?
If Chrome is the issue, you can use React Native Tools Extension on Visual Studio. That way you can simply use VS code itself for reading logs.
EDIT: If putting Remote Debugger ON the issue, go ahead and use react-native log-android or react-native log-ios . Click here for more information on accessing console logs
You can use the server terminal for that, all consoles are going to be availabe there for you and you wont need to enable "debug remotly"
I guess that I've tried every solution that exists on the internet about this issue, and nothing works, and I don't even know where to look anymore. It started to happen from nowhere and I can't even open the app settings shaking the phone, it's completely stuck on this screen.
I cleaned up NPM, Yarn, Expo's caches and disabled the Remote Dev Tools.
I would be so much thankful for any help.
In my case it was due to the a remote debugger.
I left the remote debugging on, put the mac in sleep and when I turned it on again the iOS Simulator remained stuck at bundling 100%, irrespective of what I've tried (kill simulator, expo r -c, Reload app, etc.)
However, I could have realized the root cause earlier because on the physical device it was working the entire time.
Hope this saves someone some time.
You could try reverting to your last known working commit, then incrementally adding back the changes until this happens again. This often is a result of delaying hiding the splash screen (perhaps via AppLoading or SplashScreen) and then not hiding it because of some error in the app code preventing the code to hide it from being called.
Try Disable Debug Remote JS in the IOS Simulator
by clicking ctrl + cmd +Z on Mac
It works for me.
Seems like something is wrong with the dependencies, just close down the react-native environment ( android studio) and your IDE, just closing and restarting may work if not, check for updates or delete and reinstall your dependencies ( expo i )
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
I am a newbie to React-native Development. I am able to run my app on android emulator by changing port to 8088 as my organization is using McAfee in port 8081. Everything is working fine but i am not able to debug my app in chrome. Whenever I press 'Debug JS remotely' I am getting unauthorised error in console and debugger-ui is not using react-native developer tools. I tried a lot and found some links to the problem.
This link addresses the problem but I am not getting how to pull the code from react-native master branch.
It has been two days and I am still struggling to find the solution. I will be thankful if someone helps me out there. Thanks in advance.
Remove "ALLOW-CONTROL-FLOW-ORIGIN" from chrome extention.
Uninstall build from device or Simulator/Emulator
Run Again
Hope it will be fixed.
I am trying to to debug the react native app, If I don't try to debug JS remotely then everything is fine, but when I try to debug JS remotely I do get this error.
I had this error too. The reason for me was the opened debugger tab in chrome from previous session. So when I closed it everything works fine now :)
try to change your URL of Chrome from http://localhost:8081/debugger-ui/ to http://192.168.XXXX.XXXX.xip.io:8081/debugger-ui/
source: https://github.com/facebook/react-native/issues/17618
I had same error, I just closed the browser and refreshed my simulator. It may open the browser window again with debugging window. But it takes care of the error. If not I suggest terminating your simulator and running the build commands again.
This can be solved by restarting JS debugging and closing existing debugger.
Close Chrome debugger session
On iOS, do:
CMD + CTRL + Z
Press Stop Remote JS Debugging
CMD + CTRL + Z Again
enable Remote JS Debugging
Almost the same on Android, but the difference is the keyboard command it is CMD + M on Mac or CTRL+M on Windows devices.
Close emulator.
Close node console which get opened after executing command react-native run-android.
Start emulator again.
Run project again.
Hope this help.
i just cleared my browser cache and my app cache and its working now
this error appears when you have
I installed chrome CORS extension and enabled the CORS then it worked, Even If I open chrome with disable security manually then also it didn't worked for me until I install the extension.
Aha! Found a better, less hacky solution. It seems when I upgraded Expo client on windows, it changed my default 'host'. Click the cog and change 'host' to 'LAN' to avoid CORS