09 - How to debug node.js with the Chrome Developer Tools

Transcript

0:00 In this episode we'll demonstrate how to connect your note app or note script to the Chrome devtools. Let's see what we got here. We've got a file called Test Js. Which is just a bunch of functions. We got to function, one calling function, to which caused friction, three that cost function, for which does not exist, so expect that to throw an exception, a strainer on that

0:23 reference air for is not defined as expected. In this case, it's really simple, we know what the problem is, but there's many cases where you running a node app, and it's a lot more complicated, but this simple use cases great because we can still recall the toy, so how do we connect this to the Chrome devtools? If we go over here to chrome, You see this icon here, but it's currently grayed out if we run the script again, but pass the dash Dash Inspect, Just be Rk flag inspect. And break, It's going to start the debugger and pause the script. So now if we go over here, we see this is now green. That means that there's a connection there waiting for us, So let's click on this and because we use the dash dash inspect Dash beer K flag, it signaled to node to establish a connection to the Chrome devtools, and at the very beginning to stop if you're not familiar with the Chrome debugger. I have an episode for that which I'll link to in the show notes. You can do all the normal things you can do in a browser. There's a few small differences, but for the most part it's very similar, so we can step over here, so the first thing that happens is we call one step into one. See the local scope, currently numbers undefined as defined in node. This refers to the global object which is global.

1:56 Which in the browser as window? When the browser, you have the window object? Which is the global object, and in node you have global, so you can inspect was wonderful things here than if we just hit resume here. It'll pause. I left this debugger statement in here, so it paused on this line and we have our call stack. You may notice that there's other things that we don't recognize. These are internal modules that are part of node. So if you want to learn more about how node loads modules, Howard runs code. It might be an interesting exercise to step through these and here the left. If we open these, you can see our file here, but if would open up no domain here, you have a lot of the internal modules like the Fs module, which is responsible for file operations like reading and writing to files so. Interesting if you want to learn some more

2:54 cars, you could step through all that. If you wanted to, But that's all we're doing today. So

2:59 here it is we step over here for

3:05 four is not defined. Clearly. We need to add the four function or remove it. So let me go back to the code. I'll just call it the South. Now we let this play. Then it's just done because it ran to the end of the script. And it's done, but here you see waiting for the debugger to disconnect, so it's waiting for you to either sever the connection with Control C, or you can close this debugger window, which is narrowly said to now run the script again,

3:37 No heirs, Fantastic it Summary if we start a node script, where a node application, and pass the dash dash, inspect Dash beer K flag, Then this button here turns green. And by clicking it, it is douses a connection between node and the chrome devtools, till then break at the very beginning and will allow you to step through the code and inspect. It is incredibly useful. That's it.