Debugging mocha tests with babel in Visual Studio Code

Question

I am trying to debug tests written in es6 in Visual Studio Code, but the line numbering is wrong: breakpoints work and I can go through the code, but the highlighted line is on the wrong line.

The code that I see in Visual Studio code is es6 source code, not es5 babel configured for output. Line numbering seems to match what I imagine how es5 code looks.

Here is my Visual Studio code configuration, note that I set sourceMaps to true and outDir to null as recommended in this question , but it still doesn't work:

{ "version": "0.1.0", // List of configurations. Add new configurations or edit existing ones. // ONLY "node" and "mono" are supported, change "type" to switch. "configurations": [ { // Name of configuration; appears in the launch configuration drop down menu. "name": "Debug mocha", // Type of configuration. Possible values: "node", "mono". "type": "node", // Workspace relative or absolute path to the program. "program": "${workspaceRoot}\\node_modules\\mocha\\bin\\_mocha", // Automatically stop program after launch. "stopOnEntry": false, // Command line arguments passed to the program. "args": [ "test/.setup.js", "--reporter", "list", "--compilers", "js:babel/register", "--recursive", "./src/**/*.spec.js", "./src/**/*.integrationSpec.js", "./test/**/*.spec.js" ], // Ensure use sourcemaps generated by babel "sourceMaps": true, // Workspace relative or absolute path to the working directory of the program being debugged. Default is the current workspace. "cwd": "${workspaceRoot}", // Workspace relative or absolute path to the runtime executable to be used. Default is the runtime executable on the PATH. "runtimeExecutable": null, "runtimeArgs": [ "--nolazy" ], // Environment variables passed to the program. "env": { "NODE_PATH": "${workspaceRoot}\\src;${workspaceRoot}\\src\\framework\\core\\PageBuilder;${workspaceRoot}\\test\\testUtilities", "NODE_ENV": "test" }, "externalConsole": false, "outDir": null } ] } 

I am using Visual Studio Code version 0.10.11. Node version 5.7.0 Mocha version 2.3.3

Answer 1

The following "launch.json" works for me with mocha and babel:

 { "type": "node", "request": "launch", "name": "Debug Mocha", "cwd": "${workspaceFolder}", "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/mocha", "runtimeArgs": [ "--require", "babel-polyfill", "--require", "@babel/register", "--recursive", "${workspaceFolder}/tests" ], "internalConsoleOptions": "openOnSessionStart" } 

To fix problems with stops on the wrong lines, open the ".babelrc" file and add "sourceMaps" and "retainLines", mine looks like this:

 { "presets": ["@babel/preset-env"], "sourceMaps": "inline", "retainLines": true, }