VS Code debugger is inconsistent while hitting breakpoints - node.js

I want to set up my VS Code debugger to debug my Next.js app. My launch.json contains the below settings:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Launch Program",
"skipFiles": ["<node_internals>/**"],
"port": 9229,
"resolveSourceMapLocations": [
"${workspaceFolder}/**",
"!**/node_modules/**"
]
}
]
}
I also added the debug script to my packege.json:
"debug": "NODE_OPTIONS='--inspect' next dev"
First, I run npm run debug in my terminal, then I launch the debugger in the VS Code Run and Debug tab. The debugger is attached, but when I start adding breakpoints, some of them work properly (the dot indicating the breakpoint is red and the app stops when the breakpoint is hit), but most of them are ignored despite the red indicator. There're also some unbound breakpoints.
I spent a few days figuring this out with no effect. I really look forward to moving past console-logging for debugging purposes.
VS Code version: 1.57.0

Related

Visual Studio Code debugger attaches but does not stop node js process

I have a Node js application (running on Windows) which occasionally "hangs" - it gives no sign of progress. From Visual Studio Code, I attach the debugger by selecting the process ID. Evidence of successful attachment is given both from within VSC and standard out (console):
"Debugger listening on ws://x.y.z.1:9229/242f50ce-a43c-48dc-9926-23520ed10ed3
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached."
However, the process continues to run and clicking on the "pause" symbol in the debugger control bar un-ghosts momentarily but does not change to the "continue" symbol (other control symbols on the bar remain ghosted).
Launch configuration:
{
"launch": {
"configurations": [
{
"name": "Attach by Process ID",
"processId": "${command:PickProcess}",
"request": "attach",
//"skipFiles": [
// "<node_internals>/**"
//],
"type": "node"
},
{
"name": "Launch Program",
"program": "${workspaceFolder}/index.js",
"request": "launch",
"skipFiles": [
"<node_internals>/**"
],
"type": "node", "args": ["set", "31100-1", "subsets" ]
}
]
},
"workbench.colorTheme": "Default High Contrast"
}
On occasion when I attach and then detach ("Stop Debugging") the process seems to continue and behave normally (no longer hung), but I am not able to discover where and/or why it is hanging.
I should add that while this Node js program runs from both a windows power shell and a Cygwin tcsh, it is when running from the Cygwin that I am seeing this behavior (insufficient testing from power shell to say whether or not this ever occurs)
I can understand that the source might not be visible from VSC or that the callstack would be abbreviated/incomplete, but I would expect the process to stop. Perhaps it has and I am misinterpreting the VSC presentation.
Any discussion or suggestions are welcomed. I am both a Node js and VSC novice.

VSCode Debug TypeScript files inside symlink project

I am having a super annoying problem, that started unexpected.
I have two NodeJS projects, and both projects uses TypeScript and they are symlinked. I usually debug by just attaching to the running process.
When debugging with VSCode, if I put a breakpoint in the projectA it work just fine, and the breakpoint is bonded to the actual TS file I want.
But then, I need call projectB from my projectA, and here the debugger goes directly to the projectA/node_modules/projectB/dist/**.js files, and shows that my TS files are breakpoint set but not yet bound.
This is kind of unexpected, since it was working before, and the debugger went directly to the projectA/node_modules/projectB/src/**.ts files.
I am not sure what happened, but I don't recall changing anything, and I also can't make it work again.
If I try debugging with WebStorm (attaching, just like I do with VSCode) it works just fine, this is only happening with VSCode.
I even tried to install VSCode Insiders, but no luck.
Node version: 14.16.1
launch.json:
{
"version": "0.2.0",
"configurations": [
{
"name": "Attach",
"port": 9229,
"request": "attach",
"skipFiles": [
"<node_internals>/**"
],
"type": "node",
"runtimeArgs": ["--preserve-symlinks", "--preserve-symlinks-main"],
},
]
}
PS: Both projects has the sourceMaps: true defined in the tsconfig.json file

trying to debug electron app, and window not showing up

I am attempting to debug an electron app in vs code (the main process, not the renderer process). The project I am trying to debug is this repo:
https://github.com/hello-efficiency-inc/raven-reader
it works really nice, once you have it cloned, and the right things are installed. Then I can just run:
yarn electron:serve
And boom, it runs nicely.
But I would like to also debug this. So I look around a bit, and find that I should probably use this launch.json file in the .vscode directory:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Electron: Main",
"protocol": "inspector",
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
"runtimeArgs": ["--remote-debugging-port=9223", "."],
"windows": {
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
}
}
]
}
In my package.json, I have this line for finding the startfile:
"main": "./src/background.js",
So, I try to run by clicking the debug icon, and then green triangle where it says
run and debug | Electron:Main
Which gives me this in the call stack menu:
But nothing actually seems like it's running, I dont see any desktop window which I would like so I can actually debug, and I can't hit my breakpoints either
Best way to sort this is to install code runner extension in vscode

VS Code Debugger does not kill node process after stopping the debugger

I am working on a node.js application using express.js as a web framework listening on PORT 3000.
I am using VS Code v1.46.
My launch.json file is
{
// Use IntelliSense to learn about possible 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": "${workspaceFolder}\\WebApi\\index.js",
"restart": true,
"protocol": "inspector"
}
]
}
I am able to start the debugging session for the first time, but 2nd time onwards, I get error Error: listen EADDRINUSE: address already in use :::3000
This error is because VSCode didn't terminate the node.exe process created in 1st debugging session and so in the subsequent session node failed to start the express server on port 3000 as it is still in used.
Can anyone help me to configure VSCode to terminate node.exe process once I stop the debugger?
This issue started just last week for me, not sure why, maybe windows update.
Any way I found the following :
https://github.com/OmniSharp/omnisharp-vscode/issues/2387
where they say that if you add to launch.json
"console": "externalTerminal" or "console": 'integratedTerminal'
it will open a console for the process so that u can kill manually
It works fine with the Using the "preview" debug extension.
This is the launch.json for using that mode, just make sure that you put the correct command of your package.json.
{
"version": "0.2.0",
"configurations": [
{
"type": "node-terminal",
"name": "Run Script: start",
"request": "launch",
"command": "npm run start",
"cwd": "${workspaceFolder}"
}
]
}

VSCode Nodejs debugger does not save changes?

I am just starting to learn using the Nodejs debugger. It has been really helpful already but I spent a a lot of time changing a js file I was debugging but I did not know that the changes I made were not being implement right away.
Is this an expected behavior? Can I set the debugger up so that it restarts on each save and notices the new changes?
Edit 1 :
Here is my debuf config:
{
// Use IntelliSense to learn about possible 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",
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}\\app.js"
}
]
}
Normally, after every save, you have to restart your node program to see the changes. I'm sure there are other programs but one I use exclusively (I never use node alone) is nodemon. It's globally installed npm package program. Here is sample config for vs code debugger:
{
"type": "node",
"request": "launch",
"name": "Launch app - nodemon",
"runtimeExecutable": "nodemon",
"runtimeArgs": [
"--inspect=9250"
],
"program": "${workspaceRoot}/api/app",
"cwd": "${workspaceRoot}/api",
"autoAttachChildProcesses": true,
"restart": true
},
nodemon will monitor all the files and restart node every time it detects changes.
Add runtimeArgs to change debugger port.

Resources