How to debug ts-node via "Attach to Node.js/Chrome"

I run node.js application in docker container and successfully connect to it from Phpstorm via Node Inspector for debug "Attach to Node.js/Chrome".

But when I set breackpoint on the local source file instead of this file is opened new virtual tab with the same content as target source file and debug cursor pointed to line with brackpoint that I had set in original file. Also in this new tab there is no any possibility to manipulate breackpoints and debug's flow (set and mute breackpoints etc.)

Is there is any way to achieve standard behavior ?

Screenshot of the tab with original source file

 

Screenshot of the tab with virtual tab


 

Phpstorm Debug  configuration


 

 

App is run by command

npm run start:debug

 

package.json (only "scripts" part)

{
"scripts": {
"start:debug": "nodemon --config nodemon-debug.json",
},
}

 

nodemon-debug.json

{
"watch": [
"src"
],
"ext": "ts",
"ignore": ["src/**/*.spec.ts"],
"exec": "node --inspect=0.0.0.0 --require ts-node/register --require tsconfig-paths/register src/main.ts"
}

 

tsconfig.json

{
"compilerOptions": {
"module": "commonjs",
"declaration": true,
"noImplicitAny": false,
"removeComments": true,
"noLib": false,
"allowSyntheticDefaultImports": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es6",
"lib": [
"dom",
"es2015",
"es2016",
"es2017",
"es2018",
"esnext"
],
"inlineSourceMap": true,
"outDir": "./dist",
"baseUrl": "./src"
},
"include": [
"src/**/*",
"ormconfig.ts"
],
"exclude": [
"node_modules",
"**/*.spec.ts"
]
}
1
11 comments

can't recreate when attaching to ts-node run locally:

must be specific to docker - mappings might be wrong. Please can you share a test project (with Dockerfile, etc.) we can use to recreate the issue?

1

BTW, does adding

"inlineSourceMap": true,

to tsconfig.json make any difference?

1
Avatar
Permanently deleted user

No different. I've also tried:

"inlineSources": true, 

and other different combinations but behavior is still the same

P.S.

I'm going to create test project and push it on GitHub

1

I see, thanks for update... Looking forward to the project:)

1
Avatar
Permanently deleted user

Test project to reproduce:

https://github.com/breitsmiley/tsnode-debug-fail

Just run 

docker-compose up

Debug settings

2

Thanks!

Debugging works as expected for me using your project...

I didn't manage to start it with your docker-compose, so I've changed it to a dockerfile:

FROM node:10.1.0-alpine

COPY ./app /app

WORKDIR /app

EXPOSE 9229
EXPOSE 9333
EXPOSE 3000

CMD ["npm", "run", "start"]



Also, I've replaved --inspect with --inspect-brk in nodemon-debug.json:

{
"watch": [
"src"
],
"ext": "ts",
"ignore": ["src/**/*.spec.ts"],
"exec": "node -r ts-node/register -r tsconfig-paths/register --inspect-brk=0.0.0.0:9333 src/main.ts"
}

My configurations:



1
Avatar
Permanently deleted user

Thank you!

I've successful reproduced your example. But despite the fact that in your case debug work properly we lost possibility changing code - watching files changing by nodemon loses its meaning because source code copy once into container when it is building.

In my case I mount source code from my host OS to the container. So I have possibility changing my code directly in Phphstorm and these changes immediately monitored by nodemon wich forces ts-node to rebuild project (there is no need to rebuild Docker container every time when code changes )

Also in your example there is additional layer of "Docker Image run configuration settings". Is this mandatory requirement to run docker containers in this way (via IDE) for correct working of debug? (Perhaps for correct mapping between local Phpstorm project files and container's filesystem)

P.S.

I noticed you use Windows. Probably this is reason that you didn't manage to start my project by docker-compose. Although this is rather strange. I use Ubuntu 16.04 and I'd additionally verified this project on PC of my colleague (also Ubuntu) before have published GitHub link here. Try run it just in Windows CLI directly without IDE and after this try to set up debug in IDE.

"docker-compose up" command successfuly starts container on Ubuntu, runs nodejs application and opens debug port. I have possibility to connect there by many tools - directly by Chrome, Visual studio Code, Phpstorm etc. And it really does turn out. I've started my investihation from Phpstom because this is my favorite IDE.

I will continue trying to make Phpstorm working as I would like. If I get something, I'll write a recipe here

 

 

1

Thanks, managed to make your docker-compose work on Linux.

The issue can be recreated using your project/steps, logged as https://youtrack.jetbrains.com/issue/WEB-34204. Please vote for it to be notified on any progress with this ticket

1
Avatar
Permanently deleted user

Thanks, this is good news

0

Dang, there must be a simpler way to debug ts node than this ((

0

Normally (when debugging locally) it's as simple as using the following Node.js configuration:

1

Please sign in to leave a comment.