Debug using nodemon + babel-node in VSCode using WSL - node.js

I'm trying to debug my node + babel project with VScode without success.
I read a lot of answers no one fixed my problem.
How should launch.json look alike?
I want to be able to attach the debugger to a running process and launch the program.
Package.json
"build-babel": "npx babel src -d dist",
"start": "node dist/server.js",
"dev-start": "nodemon --inspect-brk --exec babel-node ./src/server.js",
First try from:
Can Visual Studio Code be configured to launch with nodemon
launch.json
{
"type": "node",
"request": "launch",
"name": "Nodemon",
"runtimeExecutable": "${workspaceRoot}/node_modules/nodemon/bin/nodemon.js",
"args": [
"${workspaceRoot}/src/server.js"
],
"restart": true,
"protocol": "inspector",
"stopOnEntry": true,
},
{
"type": "node",
"request": "attach",
"name": "Attach to app",
"port": 9229,
"address": "localhost",
"sourceMaps": true,
"smartStep": true,
"restart": true
},
update
I also tried this:
{
"type": "node",
"request": "launch",
"name": "nodemon",
"runtimeExecutable": "${workspaceFolder}/node_modules/nodemon/bin/nodemon.js",
"program": "${workspaceFolder}/src/server.js",
"restart": true,
"console": "integratedTerminal",
"port": 9229,
"args": ["--exec", "babel-node", "--babel-preset-es2015"],
"internalConsoleOptions": "neverOpen"
}
run it when there is a server process running from a terminal: attached but the breakpoints don't got hit "set but not yet bound"
The launch process result error:
Cannot connect to runtime process- reason: connot connect to the target: connect econnrefused 127.0.0.1:9229
Thank you

Related

Debugging Jest tests in VSCode does nothing

I'm trying to get debugging working with my NodeJS Jest tests in VSCode. I can run the tests without debugging fine, but trying extensions or debug options does nothing - meaning the tests don't run at all. I have a couple of breakpoints set - one is in a test, and the other is in the service file I'm trying to test.
Here's what I've tried:
My current launch.json file (I've tried other configurations that I've since removed):
{
"type": "node",
"request": "launch",
"name": "Jest Current File",
"program": "${workspaceFolder}/node_modules/.bin/jest",
"args": [
"--runTestsByPath",
"${relativeFile}",
"--config",
"jest.config.js"
],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"disableOptimisticBPs": true,
"windows": {
"program": "${workspaceFolder}/node_modules/jest/bin/jest",
}
},
{
"name": "Jest", // This is the configuration name you will see in debug sidebar
"type": "node",
"request": "launch",
"port": 5858,
"address": "localhost",
"stopOnEntry": false,
"runtimeExecutable": null,
"env": {
"NODE_ENV": "development"
},
"console": "integratedTerminal",
"runtimeArgs": [
"--inspect-brk", // node v8 use debug-brk if older version of node
"${workspaceRoot}/node_modules/jest/bin/jest",
"--watch",
"--bail",
"--runInBand"
],
"cwd": "${workspaceRoot}"
}
When clicking the green Play button (while the test file is open in the editor) for either of these under the "Run and Debug" tab, it looks like the debug options pop up for about a second, then they disappear and nothing happens.
In my package.json file, my test script looks as follows:
"test": "jest --watch --verbose"
and I've tried running npm test in a Javascript Debug Terminal. This runs the tests, but does not stop at the breakpoints I've set.
I've also tried a few extensions, such as "Jest", "Jest Runner" and "Jest Run It" - all having the same result of nothing happening when trying to run debug.
I'm running on a Windows 10 machine with my terminals in WSL Ubuntu.
Any help would be greatly appreciated. Thanks!
I would suggest you follow the following setup:
launch.json
{
"name": "Jest file",
"type": "pwa-node",
"request": "launch",
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/jest",
"args": [
"${fileBasenameNoExtension}",
"--runInBand",
"--watch",
"--coverage=false",
"--no-cache"
],
"cwd": "${workspaceRoot}",
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"sourceMaps": true,
"windows": {
"program": "${workspaceFolder}/node_modules/jest/bin/jest"
}
},
Verify these libraries on package.json
"dependencies": {
"#types/jest": "^26.0.24",
"jest": "^27.0.6",
"ts-node-dev": "^1.1.8",
"typescript": "^4.3.5",
"ts-jest": "^27.0.3",
"ts-node": "^10.2.1"
}
The proposed configuration should let you debug your jest files

How to debug Typescript code in Visual Studio Code with ts-node-dev and correct line numbers

I have a Typescript project that is launched as follows:
ts-node-dev --preserve-symlinks --inspect=0.0.0.0 -- src/server.ts
I can debug it with Visual Studio Code, but the debugger breaks at the wrong lines. The only reasonable explanation I can think of, is that ts-node-dev does not point the debugger to the source maps (which are there).
How can I correctly debug Typescript code executed by ts-node-dev?
Configuration for debugging in vs code with ts-node-dev to attach and launch debugger:
package.json:
{
"scripts": {
"dev:debug": "ts-node-dev --transpile-only --respawn --inspect=4321 --project tsconfig.dev.json src/server.ts",
"dev": "ts-node-dev --transpile-only --respawn --project tsconfig.dev.json src/server.ts",
}
}
launch.json:
{
"version": "0.1.0",
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach to dev:debug",
"protocol": "inspector",
"port": 4321,
"restart": true,
"cwd": "${workspaceRoot}"
},
{
"type": "node",
"request": "launch",
"name": "Debug",
"protocol": "inspector",
"cwd": "${workspaceRoot}",
"runtimeExecutable": "npm",
"runtimeArgs": ["run-script", "dev"]
}
]
}
I had the same question, which brought me to this (old) post. I found the solution to my problem at https://gist.github.com/cecilemuller/2963155d0f249c1544289b78a1cdd695 so am posting it here in case anyone else finds themselves here!
This VS Code configuration allowed me to stop at breakpoints on the correct lines in my TypeScript code:
{
"version": "0.2.0",
"configurations": [
{
"name": "Example",
"type": "node",
"request": "launch",
"runtimeExecutable": "node",
"runtimeArgs": ["--nolazy", "-r", "ts-node/register/transpile-only"],
"args": ["src/script.ts", "--example", "hello"],
"cwd": "${workspaceRoot}",
"internalConsoleOptions": "openOnSessionStart",
"skipFiles": ["<node_internals>/**", "node_modules/**"]
}
]
}
This is what worked for me. attach type debugger was not working for me but launch type is working fine. Breakpoints works as well even though sometimes it goes to the ts-node-dev source files and I guess we can't do anything about it.
It runs tsnd which is just the alias for ts-node-dev.
{
"version": "0.2.0",
"configurations": [
{
"type": "pwa-node",
"name": "launch",
"request": "launch",
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/tsnd",
"program": "${file}",
"args": [
"--transpile-only",
"--respawn",
"--project",
"tsconfig.dev.json",
],
"skipFiles": [
"<node_internals>/**"
],
},
}
"program" could be changed to run a specific file by replacing ${file} with that filename but with the above config, it will run the opened file with the debugger.

debugging typescript in vscode with autorestart

I am setting up a typescript project with node.
I can debug my main.ts file in vs code with this launch.json configuration:
{
"type": "node",
"request": "launch",
"name": "Lancer le programme",
"program": "${workspaceRoot}/src/main.ts",
"outFiles": [
"${workspaceRoot}/dist/**/*.js"
]
}
This works fine but there is no auto restart when I edit main.ts
To implement auto restart, I launch in my project directory tsc --watch, and then this lauch configuration:
{
"type": "node",
"request": "launch",
"name": "nodemon",
"runtimeExecutable": "nodemon",
"runtimeArgs": [
"--debug=5858"
],
"program": "${workspaceRoot}/src/main.ts",
"outFiles": [
"${workspaceRoot}/dist/**/*.js"
],
"restart": true,
"port": 5858,
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"sourceMaps": true
},
The above configuration does autorestart when I edit source files, but the vscode debugger doesn't break anymore...
Has anyone achieved : debugging typscript in vscode with autorestart ?
This is my launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "nodemon",
"runtimeExecutable": "${workspaceFolder}/node_modules/nodemon/bin/nodemon.js",
"program": "${workspaceFolder}/build/index.js",
"restart": true,
"runtimeArgs": [
"--debug=5858",
"--inspect-brk"
],
"port": 5858,
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen"
}
]
}
Note that the prop program must indicate compiled js file. In your case it is ${workspaceRoot}/src/main.ts, but should be ${workspaceRoot}/*compile directory eg. build*/main.js.
Also make sure the typescript recompiles the files to the target directory.

How can I make VSCode run a node app like "npm start"?

I have a node app with the package.json like so:
{
"name": "myexpressapp",
"version": "0.0.99",
"scripts": {
"start": "node ./bin/www" },
//etc
}
and in app.js I have
console.log ("Running version: "+process.env.npm_package_version);
When I run npm start in the command prompt this logs
Running version: 0.0.99
When I start (press F5) in VS Code this logs
Running version: undefined
What change do I need to make to launch.json to start the app in VS Code as if I had entered npm start in the command prompt?
I can now get it to run (but not debug) using the following launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch via NPM#3",
"runtimeExecutable": "npm",
"windows": {
"runtimeExecutable": "npm.cmd"
},
"runtimeArgs": [
"start"
],
"port": 5858,
"cwd": "${workspaceRoot}"
},
{
"type": "node",
"request": "launch",
"name": "Launch Program#1",
"program": "app.js",
"cwd": "${workspaceRoot}"
}
]
}

visual studio code debuggin mocha is ignoring breakpoints

I am trying to debug mocha unit test in visual studio code. I followed this question and got this run configuration:
{
"name": "Run mocha",
"type": "node",
"program": "/usr/bin/mocha",
"stopOnEntry": false,
"args": ["testUtils.js"],
"cwd": "${workspaceRoot}",
"runtimeExecutable": null,
"env": { "NODE_ENV": "development"}
},
It works. But it does not stop at breakpoints! If I run the file with a normal launch configuration, breakpoints are not ignored.
Any Idea what could be the reason for this?
This works for me, you need to point to _mocha. Using just mocha does not allow attaching breakpoints.
{
"name": "Debug mocha",
"type": "node",
"request": "launch",
"runtimeArgs": ["C:\\Users\\CS\\AppData\\Roaming\\npm\\node_modules\\mocha\\bin\\_mocha"],
"program": "${workspaceRoot}\\test.js",
"stopOnEntry": false,
"args": [
],
"cwd": "${workspaceRoot}",
"runtimeExecutable": null,
"env": {
"NODE_ENV": "development"
}
}
If you include the port and the "--debug-brk" argument, you should be able to debug mocha unit tests. I have the following setup in my launch.json file. I included the "--recursive" argument as well so mocha would run all tests in subfolders as well. With this configuration file, I just set my VS Code debugger to use the "Debug Mocha Test" configuration and I'm able to hit breakpoints in any of my test files.
{
// Use IntelliSense to learn about possible Node.js debug attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceRoot}/server.js",
"cwd": "${workspaceRoot}"
},
{
"type": "node",
"request": "attach",
"name": "Attach to Process",
"port": 5858
},
{
"type": "node",
"request": "launch",
"name": "Debug Mocha Test",
"port": 5858,
"runtimeArgs": ["${workspaceRoot}/node_modules/mocha/bin/mocha"],
"cwd": "${workspaceRoot}",
"args": ["--recursive", "--debug-brk"]
}
]
}
You can verify the port mocha will use for debugging by running mocha --debug-brk

Resources