Debugging TypeScript Jest Tests With Visual Studio Code

Visual Studio Code is a powerful editor. With the right set of extensions, it can easily compete with full IDEs. It’s also my primary editor of choice for programming, learning, writing or playing with jupyter notebooks.

VSCode includes some great debugging features for JavaScript and TypeScript. You can also install custom debuggers for different languages. But sometimes setting all necessary options can be troublesome. Especially when you try to debug external tools like test runners.

Usually, I’m using Jest (with ts-jest) to run my tests. Because it took me some time to figure out how to debug unit tests written in TypeScript I decided to share my findings. The following is my configuration that got things working for Jest and TypeScript debugging with VSCode:

Dealing with Jest configuration

You have several options to configure Jest. Remember to adjust launch args accordingly by specifying your Jest configuration through "--config <path/to/jest.config.js|json>".

If you’ve defined Jest configuration in the package.json file of your project you can (and should) remove the "--config" and path arguments from your launch config.

That’s It!

I hope this article helps someone else.