Unable to direct debug JS (VS + Chakra + bundle) because of inaccessible source map

Problem Description

When using Visual Studio to Direct Debug an RNW app using Chakra, it works fine when using Metro because the bundle specifies a full source map URL (pointed at http://localhost:8081) that the VS debugger can load in order to get source-stepping and breakpoints.

However, when building an offline bundle file, the source map URL in the bundle file is set to the relative index.windows.bundle.map. So while VS can technically connect to the app with Direct Debugging, it fails to load the map, so you lose source-stepping and breakpoints.

The problem is two-fold:

1. The source map is generated, but is saved to $(ProjectDir)$(OutDir)\sourcesmaps\react, which is not included in the final appx
2. Even if the map was added to the appx, the bundle file would need to specify a fully-qualified path that the debugger can access.

Steps To Reproduce

1. Create a new RNW app.
2. Build and run the app with an offline bundle (yarn windows --no-packager --msbuildprops UseBundle=true)
3. Enable the Direct Debugger via the app's Developer Menu
4. Use Visual Studio and attach to the app's process with type: Script

Expected Results

Debugger attaches. I can set breakpoints and step through the source.

CLI version

npx react-native --version

Environment

info Fetching system and libraries information...
System:
    OS: Windows 10 10.0.25300
    CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz
    Memory: 1.33 GB / 15.84 GB
  Binaries:
    Node: 16.18.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.18 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
      Versions: 10.0.16299.0, 10.0.18362.0, 10.0.19041.0, 10.0.22000.0, 10.0.22621.0
  IDEs:
    Android Studio: Not Found
    Visual Studio: 16.11.33214.272 (Visual Studio Enterprise 2019), 17.4.33403.182 (Visual Studio Enterprise 2022)
  Languages:
    Java: Not Found
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.2.0 => 18.2.0
    react-native: 0.71.0 => 0.71.0
    react-native-windows: 0.71.0 => 0.71.0
  npmGlobalPackages:
    *react-native*: Not Found

Target Platform Version

10.0.19041

Target Device(s)

Desktop

Visual Studio Version

None

Build Configuration

DebugBundle

Snack, code example, screenshot, or link to a repository

No response

Reproduce with yarn windows --no-packager --msbuildprops UseBundle=true, then inspect the offline bundle, its index.windows.bundle.map reference, and the generated map under $(ProjectDir)$(OutDir)\sourcesmaps\react. Check how the appx and Direct Debugger access these artifacts; done means Visual Studio can attach with type Script, load the map, set breakpoints, and step through source.