microsoft / microsoft/vscode-js-debug

Debugger Unable to Map Breakpoints When Using Proxied Domains

Open
#2,203 1 comment 0 reactions 1 assignee View on GitHub

@connor4312 is already working on this.

Since Apr 12, 2025.

bug
Dominant language
TypeScript
Stars
2k
Forks
373
Avg merge
1d 9m
Merged PRs (30d)
6

Description

Describe the bug

I'm experiencing an issue with VSCode's debugging capabilities when using a proxied domain that points to a local development server. While the page loads correctly through the proxy, VSCode is unable to map breakpoints to the source files.

To Reproduce

I have a local development server running on localhost:3000 and I've set up a proxy to map an external domain (https://www.mydomain.com) to this local server. The source files and sourcemaps are all generated and available locally at paths like: /Users/personal/Desktop/rsbuild-vue2-test/src/App.vue

My launch.json configuration:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Debug Page",
      "presentation": {
        "group": "creation"
      },
      "url": "https://www.mydomain.com",
      "suppressMultipleSessionWarning": false,
      "webRoot": "${workspaceFolder}",
      "sourceMaps": true,
      "disableNetworkCache": true,
      "pathMapping": {
        "/": "${webRoot}/"
      },
      "sourceMapPathOverrides": {
        "${webRoot}/src/*": "${webRoot}/src/*",
        "${webRoot}/*": "${webRoot}/*",
        "*": "${webRoot}/*"
      },
      "outFiles": [
        "${workspaceFolder}/**/*.(m|c|)js",
        "!**/node_modules/**"
      ],
      "runtimeArgs": [
        "--proxy-server=http://127.0.0.1:8899",
        "--disable-web-security",
        "--allow-insecure-localhost"
      ],
      "skipFiles": ["**/node_modules/**"]
    }
  ]
}

The problem is when I access my web app through the proxied domain, the debugger is unable to map breakpoints to the source files. The page loads correctly, but breakpoints set in VSCode are never hit.

The sourcemaps are correctly generated with local file paths:

"sources": ["/Users/personal/Desktop/rsbuild-vue2-test/src/App.vue?vue&type=style&index=0&id=7ba5bd90&scoped=true&lang=css"]

However, when accessing through the proxied domain (https://www.mydomain.com, which is actually my local page), VSCode seems unable to resolve these local file paths in the sourcemaps. Meanwhile if the browser accesses the local domain name without proxy, sourcemap and breakpoints work normally.

Expected Behavior

VSCode should be able to map breakpoints correctly even when the application is accessed through a proxied domain, as long as the sourcemaps correctly reference the local file system paths.

Actual Behavior

Breakpoints are never hit when debugging through the proxied domain. The same setup works correctly when accessing directly through localhost:3000.

  • The breakpoint diagnosis of the local service is like this:
Image

It seems that the resources are loaded normally, and the debugger works normally as well.

  • The breakpoint diagnosis of the proxied remote domain is like this:
Image Image

Only the entry file of the main resource is loaded, but it seems that the sources array of the sourcemap is not processed

Log File

vscode-debugadapter-83148277.json

VS Code Version

Version: 1.99.2 (Universal)
Commit: 4949701c880d4bdb949e3c0e6b400288da7f474b
Date: 2025-04-10T01:21:25.295Z (2 days ago)
Electron: 34.3.2
ElectronBuildId: 11161073
Chromium: 132.0.6834.210
Node.js: 20.18.3
V8: 13.2.152.41-electron.0
OS: Darwin arm64 23.6.0

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.