Debugt
Documentation

Getting started

Debugt runs the services you are working on under VS Code's debugger, sends them a request, and shows every hop it made between them.

What you need

  • VS Code, with the debugger extension for your language (the ones you already use for F5).
  • A .vscode/launch.json that starts your service. If F5 works, you have one.

Nothing is added to your code or your repositories.

Install and open

  1. Install Debugt from the VS Code Marketplace.
  2. Open the folder that holds your service.
  3. Open the command palette and run Debugt: Open UI.

Debugt opens as a page in its own window, served from your machine at http://127.0.0.1:4400. Two other commands are there when you need them: Debugt: Copy UI URL and Debugt: Show Server Status.

The window, at a glance

  • Left pane — four sections: Projects (the folders you have open), Services (the launch configurations of the selected project), Request History (what you have sent) and Requests (what you have saved).
  • Canvas — the middle of the window: the services you are working on, drawn as nodes.
  • Request runner — below the canvas: where you write and send a request.
  • Header — the canvas picker, Override Libraries, and how many VS Code windows are connected.

Your first run

  1. Make a canvas. Click + New canvas in the header and give it a name.
  2. Put a service on it. Drag one from Services onto the canvas, or double-click it.
  3. Say what kind it is. Debugt asks once: an API, an Event service or a Consumer. For an API, give its Host — the address it answers on, such as http://localhost:3000.
  4. Run it. Click ▶ Run all in the canvas’s top-right corner. The node turns green when the service is up. Your breakpoints work as they do with F5.
  5. Add a request. Right-click the node and choose Add request. It opens in the runner.
  6. Send it. Write the path and body, then Send (or Ctrl/Cmd+Enter).

The trace opens over the runner: the tree of hops on the left, and for whichever hop you select, what was sent, what came back, and — under Execution — what that service’s code did.

Add a second service

Drag another service onto the canvas and run it. When the first calls the second, the call appears in the tree as a hop under the request that made it, without anything being configured: the tracer passes a header from one service to the next.

If the first service normally calls a remote copy of the second, draw a line from the first node to the second. That is a redirect: the call goes to the one on your machine instead. See Canvases and running services.

Where to go next