Visual studio 2015 typescript debugger breakpoint is not work as expected when enabling inlineSourceMap in tsconfig.json

[halajohn]

TypeScript Version:

1.8.10

Visual studio Version:

2015 community version update 2
typescript tools for visual studio 1.8.29.0

Code

any typescript code

Expected behavior:

Visual studio typescript debugger could correctly setup breakpoint red point at the line I double clicked.

Actual behavior:

When enable inlineSourceMap: true in tsconfig.json, when setting a breakpoint in VS editor, it can map that source line number from .ts file to the corresponding line number in the .js file, however, the breakpoint red point in the VS editor is shown on the line number in the .js file, rather than the line number on the .ts file. Therefore, if I double click on line 100 in one .ts file, the breakpoint red point would be shown on maybe line 90 of that .ts file, corresponding to what the mapped line number is in the corresponding .js file.

If I disable inlineSourceMap: true, and enable sourceMap: true in tsconfig.json, everything would be just fine.

I've noticed that there is a previous issue similar to this: #4360, and that issue is closed. Is my configuration wrong or missing something? Thanks.

My tsconfig.json:

{
  "compileOnSave": true,
  "compilerOptions": {
    "module": "commonjs",
    "target": "ES5",

    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "removeComments": false,
    "preserveConstEnums": true,
    "forceConsistentCasingInFileNames": true,
    "noEmitOnError": true,

    // "sourceMap": true,
    "inlineSourceMap": true,

    "inlineSources": true
  }
}

[mhegazy]

Is this running on node? if not what loader/bundler are you using? can you share your project? this does not repro for me with a vanilla project.

[halajohn]

The simplest sample I tried is (one file only):

console.log("1");
// space
console.log("2");
// space
console.log("3");
// space
console.log("4");
// space
console.log("5");
// space
console.log("6");
// space
console.log("7");

if sourceMap: true, and run the VS debugger, when stop on a breakpoint, the VS editor would show the the content of the ts file where the breakpoint reside. but if inlineSourceMap: true, the VS editor would show the content of the js file where the breakpoint reside. And if you set a breakpoint on console.log("7"), inlineSourceMap: true would make the VS debugger not stop on that breakpoint.

You mention that it could not be reproducible in your VS 2015 environment, and I think it is highly possible that it might be some environment settings issue. And I finally found one possible setting that could cause this strange behavior. I install the "NTVS" (Nodejs Tools for Visual Studio) v.1.1.1 for VS 2015, and I remember the version of the nodejs in it would be 0.1x, therefore, I modify the following VS settings to enable VS to find the latest nodejs I installed in my computer (version 4.4.3, I think this would be the most stable version currently).

Tools --> Options --> Projects and Solutions --> External Web Tools --> and I add the folder where I installed node.js v4.4.3 in it. (i.e., c:\program files\nodejs)

If I unselect the path I added for node.js 4.4.3, the breakpoint I set on line console.log("7"); would be hit in the VS debugger (however, the content of the VS editor when the breakpoint is hit is still of the js file). And if I add the path of node.js 4.4.3 back to the External Web Tools, the strange behavior appears.

[mhegazy]

so this is an NTVS project? is this correct?

[mhegazy]

@mousetraps i know you have been looking into this on the ntvs side, any thoughts?

[halajohn]

Yes. this is an NTVS project.

[mhegazy]

there are actually two debuggers, one for node (NTVS projects), and one for IE/Edge (web site projects). @mousetraps was looking into unifying the source map loading logic for both. but this issue should be filed on https://github.com/Microsoft/nodejstools

[halajohn]

ok. I'll post this to that project. Thx.