Debugging typescript node project doesn't reach set breakpoints

While debugging a simple jest based unit test THE DEBUGGER CANNOT RELIABLY REACH BREAKPOINTS in the class being tested.
Additionally after the test is done running THE TEST RUNTIME DOES NOT STOP ENTIRELY.

To reproduce the behaviour try the following scenarios

PRE-REQ

  • npm install
  • npm run compile

SCENARIO 1)

  • Test file "httpRequestHandler.test.ts" has no breakpoints.
  • Class file "httpRequestHandler.ts" has breakpoints at statements "console.log..." (screenshot attached)
  • Run the configuration "happy flow POST" in Debug mode.
  • No breakpoints are hit. (Test fails but that is expected)

SCENARIO 2)

  • Test file "httpRequestHandler.test.ts" has breakpoint at statement "const response = await handler(mockRequestPromiseNativeWrapper.object);" (screenshot attached)
  • Class file "httpRequestHandler.ts" has breakpoints at statements "console.log..." (screenshot attached)
  • Run the configuration "happy flow POST" in Debug mode.
  • Breakpoint is hit in test file "httpRequestHandler.test.ts".
  • Press F8.
  • No breakpoints in class "httpRequestHandler.ts" are hit. (Test fails but that is expected)

SCENARIO 3)

  • Test file "httpRequestHandler.test.ts" has breakpoint at statement "const response = await handler(mockRequestPromiseNativeWrapper.object);" (screenshot attached)
  • Class file "httpRequestHandler.ts" has breakpoints at statements "console.log..." (screenshot attached)
  • Run the configuration "happy flow POST" in Debug mode.
  • Breakpoint is hit in test file "httpRequestHandler.test.ts".
  • Press F7.
  • Breakpoints in class "httpRequestHandler.ts" seem to be hit but not at the expected locations. It stops at arbitrary locations. (Test fails but that is expected)

GIT REPO FOR THE PROJECT

https://github.com/ArindamRayMukherjee/intellijTypeScriptDebug

TEST FILE BREAKPOINTS

BREAKPOINTS IN CLASS BEING TESTED

STRANGE DEBUG POINT BEING HIT

TEST RUN CONFIGURATION





 

6 comments
Comment actions Permalink

All breakpoints works for me using all 3 scenarios when using js pre-compiled with Gulp (npm run compile).

But when using your configuration ( ts compiled on-the-fly with ts-jest preprocessor), breakpoints in source file don't indeed work. The reason is that the file is instrumented for coverage - as a result generated code can't be mapped to source. Setting

"collectCoverage": false,

in intellijTypeScriptDebug\jest-unit.json solves the problem

1
Comment actions Permalink

Hi Elena,

Thanks for the quick reply.

I have a feeling we should consider one out of the two options

1) Make the debugging work with jest coverage turned on. I can imagine people might want to do both at the same time.

2) Or we choose to accept that debugging doesn't work with jest code coverage turned on and make it "well known".

What do you think are our options there?

 

 

0
Comment actions Permalink

>Make the debugging work with jest coverage turned on. I can imagine people might want to do both at the same time.

Debugging code instrumented for coverage is not possible, and this is not a WebStorm limitation. And yes, it's a well known problem

You have to either precompile your code with Gulp (built-in compiler, etc.) and choose the compiled js as a test file in Run configuration, or have different Jest configuration files for running with coverage and debugging

0
Comment actions Permalink

I've run into the same problem with a similar ts-jest setup. I've tried added "collectCoverage": false to my jest configuration (in package.json) and it doesn't make a difference. Breakpoints are never hit, and additionally I get no console.log reported anywhere in IDE. So its basically not usable. I can see console log output when run from the command line. Any suggestions?

0
Comment actions Permalink

Please can you share a sample project I can use to recreate the issue?

0
Comment actions Permalink

This was killing me!! Removing the coverage worked like a charm - thank you!

"collectCoverage": false,
0

Please sign in to leave a comment.