A VS Code extension (TypeScript) that compares class structure between two git revisions and renders one UML class diagram of the difference. It is built for reviewing what an AI agent changed.
Green = added, red = removed, modified classes are marked, unchanged classes are neutral.
TypeScript sources are supported. Python support is in progress.
Commands
Git Diagram: Compare - pick a base and a target commit (or the working tree) and render the diff.
Git Diagram: Live (working tree) - compare a chosen commit with the working tree. The diagram updates on save, with a 500 ms debounce.
Git Diagram (dev): Render Fixture Diff - dev-only. Renders a fixture diff from the repo checkout (see docs/MANUAL-T4.3.md).
How it works
Git provides the file contents for each revision. Each file is parsed with tree-sitter (web-tree-sitter, WASM), and parse results are cached by blob id. A resolver builds one model per revision, the model is diffed, and the result is drawn in a webview with React Flow and elkjs.
Develop
npm install
npm run build # bundle the extension and webview
npm test # vitest unit tests
npm run test:integration # launches VS Code and runs integration tests
npm run test:vsix # build and check the packaged .vsix
To try the extension, run code --extensionDevelopmentPath . from the repo root.
Status
Compare, Live, and the TypeScript pipeline are implemented.
History mode is designed (docs/HISTORY-DESIGN.md) but not built.
A CI workflow exists (.github/workflows/ci.yml). Publisher id and Marketplace publishing are not set up.
Limitations
Class links are approximate. Tree-sitter sees names, not resolved types.
A rename shows as a removed class plus an added class.
