Coding Agent Trajectory Visualizer

Ever wanted to recover a prompt that got pushed out of a long multi-turn conversation, or see exactly how Claude Code turns your request into the context it sends to Anthropic?

Coding Agent Trajectory Visualizer is a VS Code extension for reviewing coding-agent interaction history directly inside VS Code. It lets you browse past sessions, inspect conversations between you and the agent, follow tool usage and subagent activity, view saved project context, and export recorded data for later analysis.

Website: wuwendyy.github.io/coding-agent-trajectory-visualizer · Marketplace: yiyang-wu.trajectory-visualizer

Read the full usage guide on Notion, or after installing run Trajectory: Open Usage Guide from the command palette (Ctrl+Shift+P / Cmd+Shift+P) to view the bundled markdown version. Run Trajectory: Open Printable Guide (PDF) to open the printable PDF handout in your system PDF viewer.

What You Can Inspect

• Past sessions - Browse Claude Code and Codex sessions from the VS Code sidebar, grouped by project or working directory. Renamed sessions (via /rename) show their custom names.
• Conversation timeline - Review user prompts, assistant messages, tool calls, tool results, and thinking blocks when they are present in the saved trajectory. Intermediate steps are grouped into a collapsible "Agent process" section per turn, so final responses stay in focus. Long prompts and responses open in a full-screen reader. Context compactions show their before/after token counts and the readable replacement summary when the provider stores one; encrypted summaries are labeled instead of appearing empty.
• Live sessions - The open session view refreshes automatically while Claude Code is running; no manual refresh needed. Your scroll position, active tab, and expanded turns are preserved across refreshes.
• Multi-day sessions - Sessions that span several days get day separators, a compact Show/Jump date selector, and idle-gap markers between turns. The selector lists every active date without laying every date out across the page.
• Subagent activity - Follow linked agent or task calls so nested work is easier to understand.
• Project context - View saved context files and session metadata that help explain what the agent saw.
• Session memory - A dedicated Memory tab shows the provider-specific instructions and memory available to that session: CLAUDE.md / AGENTS.md files, Claude Code auto-memory, Codex local memory when enabled, and shared Markdown actually read by the session.
• Session harness - Claude Code and Codex sessions share the same switchable Overview, Skills, Hooks, MCP, and Subagents sections. The Overview Memory card opens the dedicated session Memory tab, avoiding a duplicate intermediate view. Long Harness lists use page-level scrolling and ten-item pagination instead of nested scroll frames.
• Agent Setup library - A separate window inventories Memory, Skills, Hooks, and MCP in switchable, independently scrolling sections. Memory is grouped by compressed paths, starts collapsed, and includes a Collapse all control. Long file previews open in the same full-screen reader. Skills use the same user, workspace, system, and enabled-plugin discovery as the session view.
• Cross-session search - Search any text (prompts, responses, tool output) across all recorded sessions and jump straight to the matching session.
• Usage dashboard - A prompt-activity calendar (including sessions that span multiple days), seven-level achievements, a nonlinear base-four Runtime Rank built from recorded agent work time, Claude Code and Codex longest completed-turn records, model response-time statistics (overall, per model, per effort level), true TTFT from captured calls, your own habits (time between turns, prompt lengths, prompts by hour, streaks), and a frequent-word cloud (your prompts, model responses, or both). Computed entirely from local files; no API calls, no cost. See docs/metrics-guide.md for exactly how every number is calculated.
• Unified exports - Export a session plus linked captures as JSON, or export a readable markdown transcript (prompts, process summaries, final responses) for sharing.
• Claude Code API captures - Capture request/response-level details, including exact prompt assembly, system prompt blocks, tool schemas, request parameters, response headers, latency, time to first token, and streamed response events. Large payloads load the original capture one call at a time, paginate without discarding content, and open the current full page in the full-screen reader; system prompt versions can be compared with a line diff.

Claude Code And Codex Support

The visualizer features work for both Claude Code and Codex. The extra Claude-only feature is API capture: it records data that is not available from the saved local trajectory alone, such as max_tokens, temperature, thinking configuration, system prompt blocks, tool schemas, the exact messages sent to the API, response headers, HTTP status, total latency, time to first token, and streamed response events.

Quick Start

1. Install the extension.
2. Open the Trajectory Visualizer activity bar view.
3. Select a Claude Code or Codex session from the sidebar.
4. Review the session timeline, tool activity, context, captures, and export options in the webview.

Claude Code API Capture

1. Click Capture: Off in the status bar (or run Trajectory: Start Capture Proxy). Capture is one switch for all of VS Code: turning it on in any window turns it on everywhere, and turning it off anywhere turns it off everywhere.
2. Start Claude Code in a terminal. New terminals are captured automatically; a Claude Code session that was already running keeps its direct connection until you restart it (or use the Reload Window button in the capture notification).
3. Claude Code sends API calls through ANTHROPIC_BASE_URL, and the extension forwards them to api.anthropic.com while recording the request and response. The status bar shows a live Capture: On · N calls counter.
4. Open a captured session, select API Capture, then switch between API Calls, System Prompt, and Tool Schemas.

Captures are stored under ~/.claude/recorder/captures/, organized by project and session. Thinking blocks arrive from the API only as encrypted signatures; the viewer labels them instead of showing unreadable payloads.

Cross-Window And Remote SSH

• All windows share one desired capture state (~/.claude/recorder/capture-state.json) and converge on it within a second, so the status bar agrees everywhere.
• Exactly one window hosts the local proxy; the others share it. If the hosting window closes, another window takes over on the same port automatically, so running terminals keep working.
• If you set your own ANTHROPIC_BASE_URL (for example a corporate relay), capture detects it and will not override it.
• On VS Code Remote SSH, the extension runs on the remote machine and stores captures there. Local and remote captures stay independent.

Commands

Requirements

• VS Code 1.85+
• Claude Code CLI for API capture
• Claude Code or Codex local session files for trajectory viewing

License

MIT