As a first time user of each of these technologies, I struggled with getting everything working correctly.
The main challenge was understanding how to debug Jest tests using VS Code's debugger. On the other hand, debugging Typescript code outside of tests was easy to set up.
The TSLint and Jest extensions are incredibly useful, since they provide live feedback
This version does not allow debugging of Jest tests because of [jestjs/jest#1652 issue) in node.
This is the version I've regressed to in order to make debugging a Jest test work properly.
- TSLint
(vnext) by
egamma
- This makes TSLint errors appear inline and in the Problems panel automatically.
- Unfortunately, this version does not yet support the
tslint.autoFixOnSave
VS Code user setting that automatically applies TSLint fixes on save. I like that feature.
- Jest
by Orta
- This runs Jest tests automatically in the background whenever code is updated.
- tslint-language-service
- This is some kind of black magic that makes the TSLint extension work properly.
- I had to use this because TSLint's
no-unsafe-any
rule seemed to be broken without it.
-
Setting a breakpoint doesn't work. You have to add a
debugger;
statement. And this only works with node v6. Node v8.0.0 has a bug (see above) that prevents even this from working. -
You have to build the project before running the
Debug Jest Tests
task (inlaunch.json
.) The only reason this seems like a pain is that the normal workflow in VS Code, with the Jest extention, has the tests run automatically.- To build the project quickly, type
Ctrl+Shift+B
- To launch the debug task, click on VS Code's debugger icon on the left icon bar, then select the task from the drop-down menu which appears at the top of the left panel.
- To build the project quickly, type
-
Interestingly, if you don't build the project, the tests will still be transpiled into Javascript by the jest transform script, and you'll be able to step through the javascript version of the test.
-
For some reason you can only step through Javascript versions of the tests, but if you set a breakpoint in the Typescript code of a module called by the test, VS Code will let you step through the Typescript code