Debug NodeJS Like A Pro

NodeJS Debugging with Chrome

Anyone who is building an application find out that, what is starting as ‘small project’, becoming very quickly bigger and bigger monster. You can use console.log on small projects but as they are growing you will need better tools. In the arena of “JavaScript on the server” there weren’t many tools to debug your code effectively. However, with the power of open-source projects like: Node, Blink and others there are few powerful ways to debug you code like a pro.

First, for the one that are a bit confuse about NodeJS. Well, it’s not a “JavaScript web server” but an environment to run JavaScript on the server. It is using V8 engine so the performances are very compelling. After using NodeJS inside Compute engine I got few questions about the debugging options. In the past, developers needed to use console.log and similar ‘printing’ commands in order to understand what is going under the hood of their script. But as we mention, when you get out of the area of 100 lines script and your application contain different modules and many more lines of code. You need a debugger (and hopefully other tools like profiler) in your hands. Luckily, we can use Chrome (=Blink) dev tools for your NodeJS applications.
Here are the main steps and the ways to leverage your new ‘hammer’.

Installing

There is a very nice project that let you use the Chrome (read as Blink!) DevTools with a node module in order to have the powerful debugging options web developers got inside Chrome. Think on the ability to set a breakpoint and later going into functions and examine variables, objects on the fly. All you need to install is NodeJS (dah!) and since these days, NodeJS is coming with npm (=managing NodeJS modules) it’s one line of typing after you have node in order to install this module: node-inspector

$ npm install -g node-inspector

Debugging

Now, you should start your node application with the following command in order to enter the debugging mode:

$ node --debug yourApp.js

or, to pause your script on the first line:

$ node --debug-brk yourApp.js

After you enable the debugging you should follow these steps:

1. Start the inspector. I usually put it in the terminal (on the side to see the log massages)

   $ node-inspector &
   

2. Open your Chrome and type this:
   http://127.0.0.1:8080/debug?port=5858
   You wanna make sure these ports are not blocked before step #1.
3. You should see the customize DevTools in your tab. If you can’t see the javascript source from node just click the scripts tab. It would be a similar window to the picture below. Feel free to click on it in order to get the full size.
4. Select a script and set some breakpoints (far left line numbers).
5. Done! You can now debug your NodeJS application like a pro.

(!) Click on the image to see it in full size

If you wish to learn more on all the options you got in Chrome DevTools, this is a great resource: developers.google.com/chrome-developer-tools. You won’t have all these tabs in our case, but nevertheless, it’s moving in the right direction. For the specific case of javascript-debugging it’s much closer to what we gain from this hack.

Google Developers Live Show

Happy Hacking.