Remote native debugging Playground with web debugging doesn't work anymore

[kmelmon]

We added some support for remote debugging the Playground app, see:
https://github.com/microsoft/react-native-windows/wiki/VS-Remote-Debugging

However this technique doesn't work anymore. I debugged this and found two issues:

1. The privateNetworkClientServer capability isn't turned on in Package.appxmanifest
2. The client code is failing to connect due to using localhost:8081. It looks like we're missing the plumbing code that was originally added to HostingPane, which is no longer being used in Playground.

We should find a way to re-enable this. We should also think about how to enable remote debugging for CLI apps when we fix this - ideally whatever we do would also work for template apps.

[kmelmon]

See this PR which originally fixed Playground:
#3535

[kmelmon]

Also, update this wiki page when this is fixed:
https://github.com/microsoft/react-native-windows/wiki/VS-Remote-Debugging

[nasadigital]

I can pick this up.
As @kmelmon mentioned if privateNetworkClientServer is enabled and I add an option to specify the hostname and/or port (similar to how it's done in #5062), remote debugging works for me similarly to how it's outlined in the wiki.
This approach should work with template apps as well.

[nasadigital]

The PR only fixes remote debugging in the Playground app and doesn't address remote debugging with CLI or with Visual Studio for the template apps, so I'm reopening the issue.

[kmelmon]

@nasadigital thanks for the work done so far! Can you make sure this wiki page is up to date as you complete the work:
https://github.com/microsoft/react-native-windows/wiki/VS-Remote-Debugging

[chrisglein]

We expect that the parameter is there but the CLI needs to pass it through.

[NickGerleman]

@rectified95 did this PR fix the issue? #5062

[rectified95]

@NickGerleman Not sure I quite understand the issue here, but that PR basically passes the CLI argument to ReactApplication.cpp, where we set:
hostImpl->InstanceSettings().UseWebDebugger(true); hostImpl->InstanceSettings().UseDirectDebugger(false);

[kmelmon]

I looked at #5062, this isn't quite enough to fix the remaining issue being tracked here.

@rectified95 The overall issue being tracked here is to be able to launch the app from Visual Studio directly onto a VM rather than on the local machine, but also use web debugging. This requires the app to fetch the bundle from the dev machine rather than localhost:8081, as metro won't be running on the VM.

This was fixed for the Playground app in #5327.
However the fix for Playground was made directly in Playground code and won't be present in CLI-generated template apps.
What remains is to apply the fix from 5327 to CLI-generated template apps. It will likely require making a similar change to the template app code.

[acoates-ms]

I'm not convinced by the idea of the --remote-debugging CLI arg. It only works in the most basic of app setups and relies on specific app code. - It's also not an option that is part of the CLI on iOS or Android.

I think I'd prefer to add UI to the debug menu similar to what iOS at least has (haven't checked android), which allows you to configure what bundler settings you connect to on the instance directly at runtime.

[asklar]

This is possible today within the dev menu:

So closing this issue out :-)