Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

waiting for client connection #792

Open
god-zhang opened this issue Oct 4, 2023 · 12 comments
Open

waiting for client connection #792

god-zhang opened this issue Oct 4, 2023 · 12 comments

Comments

@god-zhang
Copy link

god-zhang commented Oct 4, 2023

It has always been 'waiting for client connection', Why?

I used Expo to create the project and started normally, but I have been unable to connect.
used Expo go, run to Android phone

Expo version: 49.0

@EmmyAina
Copy link

EmmyAina commented Oct 9, 2023

I followed the instructions on connecting to the React Native Debugger app, but Expo keeps opening Chrome dev tools by default

@Anisha12311
Copy link

I got the same issuse. when I try to connect the React Native Debugger, it opens a new Devtool by default.

@filipepratalima
Copy link

+1 here, tried many combinations and nothing

@ShiyuCheng2018
Copy link

same here

@arminhupka
Copy link

I have the same issue. Js engine changed to jsc and nothing. In on expo sdk49.

@marlo22
Copy link

marlo22 commented Nov 10, 2023

+1

@gkpo
Copy link

gkpo commented Nov 20, 2023

Same here. It's very frustrating.

When I do Device -> Shake, it opens the menu:

There's an option called "Open JS debugger". Which opens a chrome devtools instance and not React Native Debugger. There is no more option "Debug JS remotely". All the docs that I find are outdated in this regard.

At the very bottom of that menu there's a "Open React Native dev menu" option.
Then inside this menu there is Open Debugger, and Open React DevTools. None of those options seem to do anything, they both yield an error in the terminal:

info Opening flipper://null/Hermesdebuggerrn?device=React%20Native...
error Browser exited with error:, Error: invalid url, missing http/https protocol

This is probably the most confusing and least clear documentations I've seen in my life.

@AlecR
Copy link

AlecR commented Dec 2, 2023

I was able to get this working in my project following the approach in this package: https://github.com/gusgard/react-native-devsettings. I didn't want to add a new dependency to my application so I instead added this snippet:

import {DevSettings, NativeModules} from 'react-native';

const addDebugMenuItems = async () => {
  const message = {
    stop: '(*) Stop Debugging',
    debug: '(*) Debug JS Remotely',
  };

  DevSettings.addMenuItem(message.debug, () => {
    NativeModules.DevSettings.setIsDebuggingRemotely(true);
  });
  DevSettings.addMenuItem(message.stop, () => {
    NativeModules.DevSettings.setIsDebuggingRemotely(false);
  });
};

export const enableDebugging = async () => {
  setTimeout(addDebugMenuItems, 100);
};

Now I'm calling addDebugMenuItems on startup and clicking "Debug JS Remotely" in the dev menu enables me to use react-native-devtools

@Katerlad
Copy link

@AlecR did you ever get this working with Expo Go? or only in Dev Build?

I used your code above, and put it in my APP/_layout.tsx file, when using the new expo-router v2 since the project doesn't use a APP.tsx file, it uses a _layout.tsx under an APP directory.

It seems to add a new menu Item in the dev build but not expo go. Was hoping to get something working in expo go, but it seems I may be out of luck.

const addDebugMenuItems = async () => {
  const message = {
    stop: '(*) Stop Debugging',
    debug: '(*) Debug JS Remotely',
  };

  DevSettings.addMenuItem(message.debug, () => {
    NativeModules.DevSettings.setIsDebuggingRemotely(true);
  });
  DevSettings.addMenuItem(message.stop, () => {
    NativeModules.DevSettings.setIsDebuggingRemotely(false);
  });
};

export const enableDebugging = async () => {
  setTimeout(addDebugMenuItems, 100);
};

export default function Layout() {
  
enableDebugging();

return (
<Example>
</Example>
 )
 }

@Tuliany
Copy link

Tuliany commented Apr 25, 2024

I was able to get this working in my project following the approach in this package: https://github.com/gusgard/react-native-devsettings. I didn't want to add a new dependency to my application so I instead added this snippet:

import {DevSettings, NativeModules} from 'react-native';

const addDebugMenuItems = async () => {
  const message = {
    stop: '(*) Stop Debugging',
    debug: '(*) Debug JS Remotely',
  };

  DevSettings.addMenuItem(message.debug, () => {
    NativeModules.DevSettings.setIsDebuggingRemotely(true);
  });
  DevSettings.addMenuItem(message.stop, () => {
    NativeModules.DevSettings.setIsDebuggingRemotely(false);
  });
};

export const enableDebugging = async () => {
  setTimeout(addDebugMenuItems, 100);
};

Now I'm calling addDebugMenuItems on startup and clicking "Debug JS Remotely" in the dev menu enables me to use react-native-devtools

Installing the package an importing in App.tsx helped me 👍🏽

@god-zhang
Copy link
Author

enableDebugging

Yes, you're right. I tried it that way too, and it works perfectly. However, there's one condition: the project cannot run outside Expo Go; it needs to be run in development builds.

@roshanShendre13
Copy link

Hi,

I try to connect my app with RNDebugger. I am getting the following error
Simulator Screenshot - iPhone 15 Pro Max - 2024-05-10 at 08 54 07

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests