How to debug Rocket.Chat/Apps-engine in an efficient way?

How to debug Rocket.Chat/Apps-engine in an efficient way?

Tutorial

  1. Start a RocketChat instance in debug mode with the command meteor npm run debug

  2. Open the link http://localhost:3000 (make sure the latest Google Chrome installed)

  3. Open Chrome Devtools (In Mac, the shortcut is Command+Option+I)

  4. Click the Node.js button at the top-left of the Chrome Devtools panel.

  5. The text in the Connsole tab should be like this:

    It indicates that Chrome Devtools has attached to RocketChat Node.js debugger successfully :)

  6. Use the shourtcut Command+P to navigate the file you'd like to add breakpoints (It even supports *.ts files amazingly).

  7. Perform some operations to wait for the execution stops at the breakpoint you added. Happy Debugging!

Possible Issues

No Node.js button

There is no Node.js button at the top-left of the Chrome Devtool panel.

  • Make sure you start Rocket.Chat instance in debug mode with the command meteor npm run debug first.

  • You might need to open the link about://inspect (You need to type it in the address bar manually) first.

    • Click the link Open dedicated DevTools for Node

    • Add a new connection localhost:9229 in the Connection tab
    • Restart Google Chrome to try it again