VSCode Manual

Setup and diagnostics workflow.

Use this page to prepare input files and run the extension workflow in a reproducible way.

Core Concepts

Input Contract

Schematic file is required for circuit rendering.
Diagnostics file is optional and overlays issue context.

Navigation Loop

Refresh after artifact updates to avoid stale issue markers.
Use next/previous issue commands for deterministic review.

Capability Snapshot

Can

Render circuit graphs from `schematic.json` and sync them with the `Ranvier Circuit Nodes` panel.
Jump to source locations from selected circuit nodes when mappings are available.
Highlight mapped circuit nodes from the active editor file/line context.
Project `diagnostics.json` results into webview, sidebar, and VSCode Problems.
Reveal the mapped circuit node from the current editor line via command palette.
Navigate next/previous node-linked issues with commands and default shortcuts.
Provide localized EN/KO UX and keybinding override templates for team adoption.
Auto-connect to Inspector servers and visualize per-node metrics with real-time heatmap overlays (traffic/latency/errors/none).
Monitor Inspector lifecycle events in the event stream panel with node/type/text filters.
Visually alert on stalled nodes exceeding thresholds with pulsing glow animations.
Insert 6 Rust code snippets (rvtransition, rvroute, rvaxon, rvbus, rvtest) for rapid Ranvier development.
Browse and run any example from catalog.json via the integrated terminal (`ranvier.runExample` command).
Test API endpoints through the Circuit-Aware API Explorer sidebar — auto-discover routes from Inspector, compose requests with headers/params/body/auth tabs, view response with status/duration/circuit trace, and navigate offline with cached schemas.
Manage request collections in `.ranvier/collections/` with save, duplicate, rename, delete, filter, sort, and group-by operations. Auto-save execution history with configurable retention policy.
Generate empty body templates and faker-filled sample data from JSON Schema (server-first via Inspector, client-side fallback). Save named presets per request and interpolate `{{variable}}` from `.ranvier/environments/` files.
Export collections to `.ranvier-bundle.json` or single requests to `.ranvier-request.json` with secret redaction (auto-detect sensitive patterns). Import with conflict detection and resolution dialog.
Execute batch requests with sequential progress tracking, assertion evaluation (10 operators, JSON path targets), body validation against JSON Schema, and JUnit-compatible result summary. Keyboard chord shortcuts (Ctrl+R prefix) for send, template, and faker actions.
Test WebSocket endpoints with bidirectional message log, connect/disconnect lifecycle, auto-reconnect, subprotocol headers, and message filtering (text/JSON, keyword search).
Test SSE endpoints with event stream log (type, data, id, retry), event-type filtering, Last-Event-ID reconnection support, and session history.
Consolidate auxiliary extension tools (Circuit, Toolbox, Features, API) into a unified, tabbed sidebar view powered by Svelte 5 for fast and seamless context switching.
Ensure stable rendering and avoid runtime/CSP conflicts during Vite/Svelte 5 initialization across API Explorer, Toolbox, and Feature Hub panels.

Cannot yet

Quickstart

ranvier schematic hello-world --output schematic.json
code --install-extension cellaxon.ranvier-vscode

Required Files

Required: <workspace-root>/schematic.json
Optional: <workspace-root>/diagnostics.json

Primary Workflow

Open circuit view from command palette.
Refresh diagnostics overlay after artifact updates.
Move between node issues with next/previous commands.

Verification Commands

Open circuit view command Command Palette > Ranvier: Open Circuit View
Refresh diagnostics command Command Palette > Ranvier: Refresh Diagnostics
Issue navigation commands Command Palette > Ranvier: Go To Next Node Issue / Ranvier: Go To Previous Node Issue
Server connection + heatmap mode toggle Connect to Inspector server > Toggle heatmap modes in Circuit View
Event stream panel filtering Circuit View > Events panel > Filter by node/type/text
Stall node visual alert Stall threshold exceeded > Node shows pulsing glow

Sample Reproduction Page

Reproduction steps are available at /manual/samples/vscode.
For latest capability status and artifact versions, check /status.