Mocha breakpoints using Visual Studio Code

Question

Is it possible to add breakpoints to ones Mocha tests using Visual Studio Code?

Normally when debugging code one need to configure the launch.json, setting the prog

Answer 1

1. Go to Debug > Add Configuration... menu
2. Select Node.js environment
3. Select Mocha Tests option from the appeared drop-down list
4. Type the path of your test file as the last item of the args property
5. Add a breakpoint
6. Click on Debug icon
7. Select Mocha Tests as a configuration
8. Press Start debugging button
9. :-)

Answer 2

I've figured out a way to do this which I classify as a workaround. I expect the Visual Studio Code team to provide a more definitive solution for this but meanwhile this what I've done:

1. I've created a ./settings/mocha.js file which runs mocha programatically passing arguments as a list of files to be run. You can see the full file here;

2. I've created a launch config which will run the ./settings/mocha.js as the program and passes the files/file patterns we need to test as arguments:

   {
       "name": "Unit tests",
       "type": "node",
       "program": ".settings/mocha.js",
       "stopOnEntry": true,
       "args": ["test/unit/*.js", "test/unit/**/*.js"],
       "cwd": ".",
       "runtimeExecutable": null,
       "env": { }
   }
   

   Full launch.json example

So this is the equivalent of doing mocha test/unit/*.js test/unit/**/*.js and now we can use breakpoints in our mocha tests.

Answer 3

This is working fro me on a Windows 7 machine. I do have mocha installed globally, but this configuration is pointing to the project install to avoid the need for a user profile path (which btw, I tried used %USERPROFILE% variable with no success). I'm able to set breakpoints in my mocha tests now. Yay!

{
        "name": "Mocha Tests",
        "type": "node",
        "request": "launch",
        "stopOnEntry": false,
        "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
        "cwd": "${workspaceRoot}",
        "args": ["./test/**/*.js"],
        "runtimeExecutable": null,
        "envFile": "${workspaceRoot}/.env"
    }

Answer 4

When using TypeScript, the following configuration works for me in Visual Studio Code 0.8.0 (tsc 1.5.3)

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "outDir": "build",
        "declaration": false
    },
    "files": [
        "./src/index.ts",
        "./src/test/appTests.ts"
    ]
}

The important things to note here is that source maps are generated and that the output directory for the js is set to build

launch.json

    {
        "name": "Attach",
        "type": "node",
        // TCP/IP address. Default is "localhost".
        "address": "localhost",
        // Port to attach to.
        "port": 5858,
        "sourceMaps": true,
        "outDir": "build"
    }

Please note that sourceMaps is set to true and that the outDir is set to build

to debug

1. Stick breakpoints in index.ts any other imported typescript file
2. Open a terminal and run : mocha --debug-brk ./build/test/appTests.js
3. From VSC, run the 'Attach' launch configuration

Answer 5

For anyone using Windows. If you have installed mocha globally then setting program to the following path worked for me (swap in your username).

"program": "C:\\Users\\myname\\AppData\\Roaming\\npm\\node_modules\\mocha\\bin\\_mocha"

Answer 6

Did you know, that you just go into your launch config, put your cursor after or between your other configs and press ctrl-space to get a current, valid mocha config auto-generated?

Which works perfectly fine for me. Including stopping at breakpoints. ( I also had a prior, now outdated one, that did no longer for various setting-related reasons. )

As of VSCode 1.21.1 (March 2018) this yields:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Mocha (Test single file)",
      "type": "node",
      "request": "launch",
      "runtimeArgs": [
        "${workspaceRoot}/node_modules/.bin/mocha",
        "--inspect-brk",
        "${relativeFile}",
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "port": 9229
    }
}

On a side-note: debug-brk is deprectated (for anyone with Node >= Version 8 at least).