Debugging with Chrome DevTools

Table of Contents

• The Chrome DevTools Debugger
• Debugging functions
• Additional Chrome DevTools reading

The Chrome DevTools Debugger

The Chrome DevTools are a set of web authoring and debugging tools built into Google Chrome. As of Node.js v6.3.1 you can use the DevTools to debug and profile your Node.js code.

Debugging functions

Each deployed function has its own worker process, separate from the main Emulator process. This is more secure and safer for the Emulator and simulates production, but it means there's a different debugger running for each deployed function.

For more information on the newer Node.js --inspect flag, see V8 Inspector Integration for Node.js.

1. Before you can debug a function, you need to deploy it:

   functions deploy helloWorld --trigger-http
   

   See Deploying functions.

2. To inspect a function using the newer Node.js --inspect method, run the following:

   functions inspect helloWorld
   

   You should see something like the following printed to the console:

   Debugger for helloWorld listening on port 9229.
   

   You can also configure the Debugger's port and/or force the function to pause execution until you attach to the Debugger. Run functions inspect --help for details.

3. Check the logs to see the chrome-devtools uri to paste into a new Chrome tab. The logs should show something like this:

   Debugger (via --inspect) for /YOUR_PROJECT_ID/us-central1/helloWorld listening on port 9229.
   Debugger listening on port 9229.
   Warning: This is an experimental feature and could change at any time.
   To start debugging, open the following URL in Chrome:
       chrome-devtools://devtools/remote/serve_file/@60cd6e859b9f557d2312f5bf532f6aec5f284980/inspector.html?experiments=true&v8only=true&ws=localhost:9229/f836e979-c48f-4329-b2aa-81f31599a287
   

4. Open the printed chrome-devtools URI into a new tab in Chrome.

5. If your function's code hasn't been loaded into Chrome Devtools yet, call your function to load its code.

6. Set a breakpoint in your function's code.

7. Call your function again to start debugging, seen below:

   

8. You can disconnect from the debugger by closing the Chrome tab.

9. To take your function out of debug mode, run the following:

   functions reset helloWorld
   

   or to restart the function and keep its debugging settings, run the following:

   functions reset helloWorld --keep
   

   Run functions reset --help for details.

Additional Chrome DevTools reading

• https://nodejs.org/api/debugger.html#debugger_v8_inspector_integration_for_node_js
• https://medium.com/@paul_irish/debugging-node-js-nightlies-with-chrome-devtools-7c4a1b95ae27
• https://mattdesl.svbtle.com/debugging-nodejs-in-chrome-devtools
• https://blog.hospodarets.com/nodejs-debugging-in-chrome-devtools