GollyJer commented 2 years ago

Edit By Maintainer: Please see the upstream Hermes + Windows Issue If you are running into this bug, please include your Expo SDK version (which tells us what React Native version you are using) and include your Podfile from running expo prebuild so that we can provide additional information to the Flipper team. :heart:

(Original report below)

I'm curious if anyone has gotten the Hermes plugin to work.

React DevTools works great but I get this when trying to pull up Hermes (which our app is using).

And this is all that's logged.

Is the Hermes plugin even expected to work?

Thanks!

jakobo commented 2 years ago

EDIT You can find the current recommended practices here: https://github.com/jakobo/expo-community-flipper/issues/4#issuecomment-1085343485

If you're on windows, it looks a lot like https://github.com/facebook/flipper/issues/1520. Can you try launching with your host in localhost mode? expo start --host localhost?

If you're not in Windows, can you pass along the RN version and your plugin config?

GollyJer commented 2 years ago

Hi @jakobo. Thanks for the help!

Not sure if I got closer or further away. 😀 Yes, I'm on Windows. I launched expo start --host localhost with my physical Android phone connected to the computer with USB Debugging enabled.

Flipper now shows the app & phone correctly but none of the plugins enable and I get more items in the log.

The RSockets warning particularly sticks out as websockets seems to be most peoples issue in the thread you linked.

GollyJer commented 2 years ago

P.S. - What hardware setup do you use? If you're using Mac and an iPhone I can take the time to switch over knowing it will work.

I recently got a 16' Macbook M1 Pro to play with but keep coming back to my Windows machine because of the OLED display. 😀

I'd love to get Windows debugging working but I'd like get this memory leak in the app debugged even more. 😝

jakobo commented 2 years ago

EDIT You can find the current recommended practices here: https://github.com/jakobo/expo-community-flipper/issues/4#issuecomment-1085343485

My current setup is Windows 10 + WSL, with Android Emulator and iOS Device (SDK 44). However, I'm not currently running Hermes. This is most likely an issue with networking to WSL and networking at this point. I did a writeup about the networking woes here: https://codedrift.com/thunked/running-expo-in-windows-subsystem-for-linux-wsl2

The tl;dr of the piece is go get WSLHostPatcher https://github.com/CzBiX/WSLHostPatcher which will allow your WSL instances to listen to the parent host IP. You can then launch with expo start --host 0.0.0.0 to listen on all interfaces.

gloredo commented 2 years ago

Same problem here, when using --localhost the only difference is that the following screen appears but the error persists

7553676ea31012a9faebc436df384d873479f9b6

package.json

"expo": "^44.0.6",
"expo-community-flipper": "^44.0.1",
"react-devtools-core": "^4.23.0",
"react-native-flipper": "^0.137.0",

environment

Windows 10 Pro 19043.1526
Flipper Version 0.137.0

GollyJer commented 2 years ago

@gloredo Yeah, I've given up at this point. I'm stuck with console logs for now.

jakobo commented 2 years ago

EDIT You can find the current recommended practices here: https://github.com/jakobo/expo-community-flipper/issues/4#issuecomment-1085343485

Getting some more bandwidth to dig into what's going on here. Do you mind sharing the Podfile (with redactions if needed) generated in ios/ when you run expo build? All the plugin does is modify the Podfile which shouldn't cause an issue with Hermes.

Specifically, we should see:

:hermes_enabled => true which was set by expo with Hermes enabled
# Flipper support successfully added via expo config plugin which are lines added by this plugin

If we have those lines, then we should see if v8 can connect to Hermes outside of Flipper. Instructions. If we can connect using Chrome, then it is likely something about our Podfile setup that's needed for WSL compatibility. If we can't connect, then it's very likely a networking issue caused by WSL running in a NAT instead of a proper bridged network.

GollyJer commented 2 years ago

Hey @jakobo. Thanks for the response. I won't have time to dig into this until the end of the week but just wanted to point out one thing. I'm running in native Windows 11 not WSL. Not sure if @gloredo is the same, but this would at least eliminate local networking between WSL and Windows native as a potential problem.

jakobo commented 2 years ago

EDIT You can find the current recommended practices here: https://github.com/jakobo/expo-community-flipper/issues/4#issuecomment-1085343485

That's helpful information! Since all we're doing is modifying the Podfile, I think trying to connect the chrome debugger to hermes will be a good next step as it takes Flipper out of the picture completely and we can figure out if this is a windows networking issue or a Flipper/RN issue.

obasille commented 2 years ago

Hi, I have the same issue.

I on Win 10 Pro, Android simulator, Expo 44, Flipper client 140.

In Chrome I have this:

If I select any of them, it opens the DevTools but I get this error in the console:

DevTools failed to load source map

Something is working though, because if I pause the debugger the application stay frozen until I resume script execution.

jakobo commented 2 years ago

EDIT You can find the current recommended practices here: https://github.com/jakobo/expo-community-flipper/issues/4#issuecomment-1085343485

@obasille I believe that's unrelated. The error in console is probably because in Chrome you've got automatic sourcemaps turned on. (Developer Tools => Settings => Sources => (uncheck) Enable JavaScript Sourcemaps. For the thread, how are you starting your expo app? And are you passing --host 0.0.0.0 as an argument?

obasille commented 2 years ago

Thanks! I'm running with expo run:android

I'm not sure I understand about --host 0.0.0.0, are you talking about starting Chrome with this argument? (it doesn't seem to a valid argument for expo run and expo start).

jakobo commented 2 years ago

Sorry, the --host 0.0.0.0 is a pure metro solution (pulled from my wrong package.json) but stems from the same networking error. Windows isn't always good about forwarding everything along to WSL for the linux-on-windows crowd, and it seems to be equally bad with websockets and IPv4/6. Here's what I'd recommend. (I'll also update previous threads for newcomers to point to this comment)

WSL Users

You need to install and run WSLHostPatcher, as Windows is awful at forwarding everything along to the WSL instance. This app uses the Windows Detours framework to enable WSL listening on 0.0.0.0 (the everything interface). You can also manually forward things with network scripts, but it's a massive headache.

The majority of connection problems related to WSL come from expo (and react-native) binding to the local IP. When using localhost, it's unreachable from windows. When using lan, it binds to the wrong side of the NAT bridge that WSL uses. HostPatcher lets WSL use the system's localhost, allowing --host localhost to work as expected during expo start.

Non WSL Windows Users

There appears to be a few related issues for Flipper in Windows 10 and 11, which I've linked below for visibility.

https://github.com/facebook/flipper/issues/1520 using --host localhost to force an IP4 websocket URL
https://github.com/facebook/flipper/issues/3433 open issue, similar to the problem we're discussing here
https://github.com/facebook/flipper/issues/1291#issuecomment-789756412 (expo does not expose --host 0.0.0.0 for the react native bundler, but we can still look at http://localhost:8081/json and verify webSocketDebuggerUrl is a reachable URL

If we've exhausted these, we should either open or 👍🏻 a related issue in the Flipper repository. I'm also happy to modify the README about potential issues when using Win 10/11.

obasille commented 2 years ago

Thank you @jakobo!

itsramiel commented 2 years ago

Thank you @jakobo!

were you able to make it work on windows?

obasille commented 2 years ago

Nope (without using WSL)

mitramejia commented 2 years ago

Also not connecting on:

Mac
SDK 44
Hermes enabled
iOS simulator

jakobo commented 2 years ago

@mitramejia do you mind sharing your Podfile after running expo prebuild locally? Doing so will help me understand how Flipper is being configured on your system and identify if this is a Flipper issue or an expo plugin issue. Thanks.

Nantris commented 2 years ago

Same issue on Windows 7/SDK 45/Android.

jakobo commented 2 years ago

@Slapbox, as mentioned above, can you share your Podfile after running expo prebuild locally? Right now, we need to figure out if this is a Flipper or plugin issue. Thanks!

edit with SDK 45 out now, I've added an explicit note to the readme about windows + hermes. Advanced thanks to those who also reported it upstream on the fbflipper thread: https://github.com/facebook/flipper/issues/3433

jakobo commented 2 years ago

For others in this thread, SDK 46 now has a better way to initialize flipper in the Podfile, and some daring souls have figured out how to launch Flipper so it can find metro (!!!) and find Hermes (!!!x2). #19 for details. I'm going to close this as fixed, but lets open a new issue if in SDK 46 people are having issues w/ the Hermes configuration.

jakobo commented 1 year ago

Just crediting folks for their hard work on this.

@all-contributors please add @GollyJer for bugs (and thank you for helping work through these issues)

allcontributors[bot] commented 1 year ago

@jakobo

I've put up a pull request to add @GollyJer! :tada:

jakobo / expo-community-flipper

Hermes debugger can't connect in Windows 10/11 #4

WSL Users

Non WSL Windows Users