Debugger not stopping at breakpoints

[StephaneBonilla]

Describe the bug Debugger is not stopping at breakpoints. I am using a workspace with 3 Angular projects.

To Reproduce Steps to reproduce the behavior: Just open some Typescript file , add a breakpoint and launch the debugger.

Log File I am getting the following error:

Could not read source map for http://localhost:4200/main.js: Unexpected 503 response from http://localhost:4200/main.js.map: connect ECONNREFUSED 127.0.0.1:4200
Could not read source map for http://localhost:4200/styles.js: Unexpected 503 response from http://localhost:4200/styles.js.map: connect ECONNREFUSED 127.0.0.1:4200
Could not read source map for http://localhost:4200/runtime.js: Unexpected 503 response from http://localhost:4200/runtime.js.map: connect ECONNREFUSED 127.0.0.1:4200
Could not read source map for http://localhost:4200/polyfills.js: Unexpected 503 response from http://localhost:4200/polyfills.js.map: connect ECONNREFUSED 127.0.0.1:4200
Could not read source map for http://localhost:4200/vendor.js: Unexpected 503 response from http://localhost:4200/vendor.js.map: connect ECONNREFUSED 127.0.0.1:4200

VS Code Version: 1.80.2 2ccd690cbff1569e4a83d7c43d45101f817401dc x64

Additional context Angular CLI: 14.2.12 Node: 18.16.1 (Unsupported) Package Manager: npm 9.8.0 OS: win32 x64

Angular: 14.3.0 ... animations, common, compiler, compiler-cli, core, forms ... language-service, platform-browser, platform-browser-dynamic ... router, service-worker

Package Version

@angular-devkit/architect 0.1402.12 @angular-devkit/build-angular 14.2.12 @angular-devkit/core 14.2.12 @angular-devkit/schematics 14.2.12 @angular/cli 14.2.12 @schematics/angular 14.2.12 rxjs 7.4.0 typescript 4.8.4

Launch.json:

{
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch Chrome",
      "request": "launch",
      "type": "chrome",
      "url": "http://localhost:4200",
      "webRoot": "${workspaceFolder}",
      "sourceMaps": true
    }
  ]
}

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2020",
    "module": "es2020",
    "lib": ["es2020", "dom"],
    "resolveJsonModule": true,
    "esModuleInterop": true
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInjectionParameters": false,
    "strictInputAccessModifiers": false,
    "strictTemplates": true
  }
}

[StephaneBonilla]

i tried this configuration:

  {
      "name": "Chrome debug",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:4200",
      "webRoot": "${workspaceFolder}",
      "sourceMaps": true,
      "resolveSourceMapLocations": ["${workspaceFolder}/**", "!**/node_modules/**"]
    },

that i have found in this article. And now i dont have any Could not read source map errors, but the breakpoints still not working.

[StephaneBonilla]

i tried adding the --host=127.0.0.1 to the script in package.json but it didnt worked.

[connor4312]

Please collect the logs using the instructions in the issue template

[StephaneBonilla]

there you have --file deleted--

[connor4312]

Please remove the resolveSourceMapLocations, and share the log at that point. That's preventing the debugger from trying to load sourcemaps that come from localhost

[StephaneBonilla]

there you have the new log with resolveSourceMapLocation off: -- file deleted --

[connor4312]

I think you have some kind of fun ipv6 case. We have a fallback for this case but I'm guessing dns.resolve() on Node is resolving to the wrong IP and we're doing the same request twice... I put in some fallback logic which will handle your case

[StephaneBonilla]

Good morning. In the second post of this thread, I posted a StackOverflow article where people commented that as of Node 18, IPv6 was used by default instead of IPv4. As a solution, they propose to change the ip settings in several ways to solve this problem. The problem is that all the projects I work on have some sort of CORS configuration that prevents any of those configurations from working as they are automatically rejected by endpoints. For this reason I have opened this thread, since I understand that as people migrate to Node 18 they will encounter this problem. Thank you so much.

[StephaneBonilla]

@connor4312 , the debugger still not stopping at breakpoints. There you have another log: vscode-debugadapter-b40327ff.json.gz

[connor4312]

You will want to swap over to the nightly extension to get this fix

[ktylhy]

@StephaneBonilla I had the same problem yesterday. Here is my solution, I hope it helps: https://github.com/microsoft/vscode-js-debug/issues/1778#issuecomment-1666574805

[StephaneAdeso]

i can't change the ip due to CORS configurations. i hope the next release will have the fix to make it work like before.