Debugging Jovo Skills in VS Code

I’ve been wanting to try out the Jovo webhook for a while because of the slick debugging view that it provides, but I also need to set breakpoints in my code and I’d rather not use Chrome DevTools. They’re nice, but if I’m developing in VS Code, that’s where I want to set breakpoints too.

It turns out getting this to work isn’t that difficult, it just took a little bit of time reading through the VS Code launch.json documentation.

Setting the launch program to jovo and passing the run and --inspect args is the obvious choice:

However, since the run command launches all of your code as a child process the debugger will never connect to it. In fact, I never got the server to start.

The actual server never starts

If I manually execute jovo run --inspect then attach VS Code to the process everything worked fine, but I’m too lazy. I just want to press F5 and have everything work!

Reading through the launch.json documentation, I came across the autoAttachChildProcesses property (more info here: https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_automatically-attach-debugger-to-nodejs-subprocesses). As the name implies, it causes VS Code to automatically attach to any child processes that are spawned — in this case the jovo server.

Not much has changed here…

Turns out this is all that’s needed to get everything working.

Now when I press F5 everything works!

Hopefully this article saves you some time on google, stack overflow, or reading through the VS Code documentation 😒. If you know any other tricks for debugging Jovo skills, please share them in the comments.