search

microsoft / react-native-windows

A framework for building native Windows apps with React.
https://microsoft.github.io/react-native-windows/
Other
16.34k stars 1.14k forks source link

Enable access to the developer menu through NativeModules.DevMenu from within the RNW app context #3822

Open SounD120 opened 4 years ago

SounD120 commented 4 years ago

Hello, I am from React Native Tools VS Code extension developement team. In the extension we have special command palette commands to reload the attached app and to show React Native Developer Menu in it. In RN Android we do that via adb commands, in iRN OS we do that via require('NativeModules').DevMenu.show() and require('NativeModules').DevMenu.reload() during debugging, but in React Native for Windows 0.60.0-vnext.105 there is no DevMenu in the NativeModules list.

React Native iOS React Native Windows
image image

So we'd like to ask if the team plans to implement access to the DevMenu from the NativeModules package, or maybe there are some other alternatives for programmatically accessing Developer Menu during debugging?

chrisglein commented 4 years ago

@SounD120 Thanks for looking into this! We do support the developer menu but it looks like we missed the native module access. We'll fill this gap.

elicwhite commented 4 years ago

I'd kind of expect this functionality in VSCode to be implemented with the metro websocket, rather than directly calling into the NativeModule in the app's JS Context...

I give some code pointers on how that works in this issue on the react-native-mac repo: https://github.com/microsoft/react-native-macos/issues/310

rectified95 commented 4 years ago

@TheSavior I've read your comment on the macOS issue. I understand Flipper handles the dev menu through Metro. Still, can you tell me why you'd object to exposing the it in NativeModule for the purposes of this task?

elicwhite commented 4 years ago

I think it’s fine to expose that native module since it exists in iOS. My comment was less about that and more a comment about the implementation chosen for the vscode plugin 😀

rectified95 commented 4 years ago

@SounD120 FYI I'm starting to look into this.

rectified95 commented 3 years ago

Half of the issue is now resolved - we've introduced the DevSettings module, which exposes the Reload() method. Still, one the scenarios in the VS Code extension is blocked - launching the DevMenu via the extension commands.

acoates-ms commented 3 years ago

As @rectified95 said, the native module exists now. I'm curious about the mechanism being used on iOS. Does that work when doing direct debugging with hermes?

Also windows supports the metro command too, so just hitting 'd' in the metro window will also cause RNW to show the debug menu. -- I suspect that flipper is using the metro command - as the show debug menu button in flipper works in RNW too.