๐Ÿ“ฆ hediet / vscode-realtime-debugging

An extension for VS Code that visualizes how a program is being executed in real time.

โ˜… 279 stars โ‘‚ 18 forks ๐Ÿ‘ 279 watching โš–๏ธ GNU General Public License v3.0
๐Ÿ“ฅ Clone https://github.com/hediet/vscode-realtime-debugging.git
HTTPS git clone https://github.com/hediet/vscode-realtime-debugging.git
SSH git clone git@github.com:hediet/vscode-realtime-debugging.git
CLI gh repo clone hediet/vscode-realtime-debugging
Henning Dieterichs Henning Dieterichs Adds caveats section. 6b9cb42 5 years ago ๐Ÿ“ History
๐Ÿ“‚ master View all commits โ†’
๐Ÿ“ .vscode
๐Ÿ“ demo
๐Ÿ“ docs
๐Ÿ“ src
๐Ÿ“„ .gitignore
๐Ÿ“„ .prettierrc.json
๐Ÿ“„ .vscodeignore
๐Ÿ“„ CHANGELOG.md
๐Ÿ“„ LICENSE.md
๐Ÿ“„ package.json
๐Ÿ“„ README.md
๐Ÿ“„ tsconfig.json
๐Ÿ“„ tslint.json
๐Ÿ“„ yarn.lock
๐Ÿ“„ README.md

Real-Time Debugging

Features

  • Highlights statements that write to stdout when they are executed.
  • Statements that have a Logpoint on them write to stdout when they are executed ;)
  • Shows the text that was written to stdout next to the statement.
  • Theoretically supports every debugger and language out there (there is nothing in the implementation specific to JavaScript).

Demo NodeJS

Demo Web

Logpoints

If you are familiar with logpoints, you will never ever need console.log for debugging again! I highly recommend binding the command Debug: Add Logpoint... to a shortcut that is easy to reach (I put it on Shift+F2).

With logpoints you don't need to restart a program when you want to visualize its execution.

Caveats

Does not work when debugging VS Code extension, since they don't write to stdout (console.log is patched and the output event is not sent by the debug adapter).