hediet/vscode-debug-visualizer
8,168 Stars·443 Forks·TypeScript·GPL-3.0·2 Aufrufemarketplace.visualstudio.com/items?itemName=hediet.debug-visualizer↗
Vscode Debug Visualizer
This is a visual debugging tool for VS Code that renders program variables and data structures as graphical diagrams during active debugging sessions. It functions as a programmable framework that converts internal runtime data and debug expressions into visual representations to assist in understanding program state.
The project distinguishes itself through a programmable extraction system that allows the injection of custom JavaScript scripts into the debuggee. These scripts define how project-specific data types are parsed and transformed into JSON formats compatible with the visualization engine. It also supports custom expression templates to wrap debug adapter queries, ensuring the returned data is correctly formatted for rendering.
The tool provides capabilities for transforming complex data structures, visualizing watched expressions, and mapping selected editor text to the active visualization view. These features enable real-time analysis of state transitions and logic errors through graphical diagrams rather than plain text.
Features
- Data Structure Visualizers - Renders variables and data structures as visual diagrams during debugging sessions to help understand program state.
- Visual Debugging Environments - Provides a graphical interface for state inspection and visualizing complex data structures during active debugging sessions.
- Custom Data Type Providers - Provides a framework for writing scripts to transform project-specific data types into renderable formats.
- Debug - Transforms internal runtime data structures into JSON formats compatible with visualization engines.
- Extractor Injection - Supports loading external JavaScript files into the debuggee to convert project-specific data types into JSON.
- Structured Data Extraction - Allows loading external JavaScript files into the debug session to define custom logic for converting data structures.
- JSON Record Extractors - Transforms raw debug session variables into structured JSON objects for graphical rendering.
- Data Transformation - Transforms complex data structures into formats that a visualization engine can process using built-in or custom extractors.
- Watch Expression Visualization - Renders the value of a watched expression as a visual representation instead of plain text while stepping through code.
- Runtime Debuggee Injection - Loads external JavaScript files into the debuggee to convert complex project-specific data types into visualizable formats.
- VS Code Extensions - Implements a VS Code extension that renders evaluated debug data as graphical diagrams in a webview panel.
- Debugging Visualizers - Implements a specialized VS Code extension that transforms runtime variables into visual diagrams for easier state analysis.
- Code Analysis and Debugging - Enables real-time evaluation of expressions and watched variables using visual aids to identify logic errors.
- Selection-to-Expression Mapping - Assigns the currently selected code snippet as the active expression for the visualization view.
- Expression Templates - Provides custom script templates for debug adapters to wrap expressions and ensure compatible JSON return strings.
- Expression Wrapping - Wraps user expressions in templates to ensure the debug adapter returns JSON strings compatible with rendering.
- Editor Selection Mapping - Links the current text selection in the editor to the active expression being evaluated for visualization.
- Extractor Registries - Provides a registry for managing external scripts that define how data structures are parsed for visualization.
- Extensible Data Extractors - Enables defining how specific data structures are extracted from debugging sessions across different runtime environments.
- Debugging und Tracing - Visualizes data during debugging in VS Code.
