How to debug unit tests written in Typescript with Mocha from Visual Studio Code

I write a Typescript library. The unit tests are also written in Typescript using Mocha framework. I'd like to execute the unit tests directly without compiling into javascript. This works with this command:

./node_modules/mocha/bin/mocha  ./test/*.test.ts  --require ts-node/register

I try to debug the unit test from Visual Studio Code with the following launch settings:

{
    "type": "node",
    "request": "launch",
    "name": "Mocha Tests",
    "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
    "args": [
        "--require",
        "ts-node/register",
        "${workspaceRoot}/test/*.test.ts"
    ],
    "internalConsoleOptions": "openOnSessionStart"
}

This way I can debug Mocha itself from VS Code, but not the unit tests. Mocha spawns separate processes for the tests and the debugger can not automatically attach to the child processes.

What is the right way to debug Typescript unit tests from Visual Studio Code?

Upvotes: 12

Answers (4)

Alferd Nobel

Reputation: 3979

On my VsCode v1.43 running on Mac, I used the below configuration. Also I use npm test goals in my package.json to invoke the tests, so you can see thats passed as arguments here, along with other custom test arguments.

{
            "type": "node",
            "request": "launch",
            "name": "Mocha_TypeScript_Debugger",
            "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
            "runtimeExecutable": "/usr/local/bin/node",
            "args": [
                "--require", "ts-node/register",
                "npm",
                "test",
                "--timeout", 
                "130000",
                "${workspaceFolder}/src/**/${fileBasenameNoExtension}.ts",
                "yourCustomArgs",
                "{\"dc\":\"dubaDc\",\"comp\":\"dummy\", \"login\":\"dubakur\", \"id\":\"adkd\"}"
            ],
            "internalConsoleOptions": "openOnSessionStart",
             "openDebug": "openOnDebugBreak",
             "sourceMaps": true,
            "outFiles": [
                "${workspaceFolder}/lib/**/*.js"
            ]
}

Upvotes: 0

morpheus

Reputation: 20382

updating this thread to the config that worked for us (note to self).

the --compilers option in https://stackoverflow.com/a/44999572/147530 is deprecated
ts:ts-node/register gives error
adding "${relativeFile}" also gives error Unexpected token / in JSON at position 6 as the "${relativeFile}" resolves to .vscode/launch.json .

updated config

{            
            "name": "mocha tests",
            "type": "node",
            "protocol": "inspector",
            "request": "launch",
            "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
            "stopOnEntry": false,
            "args": [ "-r", "ts-node/register", "${workspaceRoot}/test/**/*.spec.ts", "--no-timeouts"],
            "cwd": "${workspaceRoot}"
}

Upvotes: 11

px1mp

Reputation: 5372

If anybody finds it useful, the following launch.json configuration snippet is working for me without any workaround:

    {
    "name": "mocha tests",
    "type": "node",
    "protocol" : "inspector",
    "request": "launch",
    "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
    "stopOnEntry": false,
    "args": [ "--compilers", "ts:ts-node/register", "--no-timeouts", "${relativeFile}"],
    "cwd": "${workspaceRoot}"
    }

Works fine for me with node v7.10.0, typescript 2.4.0 and Visual Studio Code 1.13.1 . Both mocha and typescript are installed locally under node_modules.

Upvotes: 5

Vereb

Reputation: 14736

tl;dr: use Nodejs debugger command

I found a solution/workaround for my problem although I am not 100% satisfied with it.

By giving the --require ts-node/register switch to Mocha we basically inject the ts-node/register.js library into our test environment. This library wraps require calls and when a .ts file is loaded it compiles the typescript code on demand.

To test how ts-node/register works I wrote a simple Nodejs example without Mocha. There is a debug_test.js file and a debug_test.ts file in the example. I start the debug_test.js and it loads debug_test.ts .

I start the example by a simple 'Node.js: Launch Program' configuration from Vissual Studio Code.

When I put a breakpoint to debug_test.ts:2 the problem is the same to my original problem - it doesn't break.

But, if I use Nodejs debugger command it breaks and I can debug my application.

When I put a breakpoint on the debugger command, Visual Studio Code recognizes the call stack, the debug console is usable, although I don't see the local variables on the UI.

It seems to be a VS Code bug or improvement opportunity, but for now this solution works with Mocha with my original launch configuration too.

Upvotes: 1

How to debug unit tests written in Typescript with Mocha from Visual Studio Code

Answers (4)

Related Questions