Skip to content
This repository has been archived by the owner on May 15, 2019. It is now read-only.

Debugging with Chrome DevTools

Jason Dobry edited this page Mar 6, 2017 · 22 revisions

Table of Contents

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 processe, 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.

  1. Enable debugging:

     functions config set inspect true
    
  2. Restart the Emulator:

     functions restart
    

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

     Inspect mode is enabled for the Supervisor. Check the logs for the workers' debugger ports.
    
  3. Deploy your function, if you haven't already.

  4. Call your function to have it's worker created.

  5. Check the logs to see what port the debugger is listening on.

     Debugger (via --inspect) for /gcp-next-2017-agent/us-central1/helloPOST 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
    
  6. Open the printed chrome-devtools URI into a new tab in Chrome.

  7. Call your function to load its code into the debugger.

  8. Set breakpoints in your function code and call it again to debug.

Additional Chrome DevTools reading