Copilot Vision

Type @vision in Copilot Chat — Copilot now sees your live debugger state.

Copilot Vision adds an @vision chat participant to GitHub Copilot. When your code is paused at a breakpoint or has crashed, @vision injects the real local variables, error, console output, and call stack into Copilot's prompt — so Copilot answers based on what your code is actually doing, not what it might be doing.

No more copy-pasting variable values into chat. Just ask.

Try it in 30 seconds

1. Open a JS/TS file
2. Run Start Debug (Ctrl+Shift+D) — or open Command Palette → Start Debug
3. When execution pauses, open Copilot Chat and type:

@vision why is total 4 instead of 10?

@vision my loop only runs once — what's wrong?

@vision explain the current call stack and suggest a fix

That's it. Copilot replies with the fix using your actual runtime values.

Why use @vision?

Without it, you'd type something like:

"I have a function calculateTotal that returns 1.33 but I expected 4. Here are the values: total=4, count=3, items=[…]. Why?"

With it, you type:

@vision why is the result wrong?

Copilot Vision attaches the real state automatically. Faster prompts, better answers.

Example

function calculateTotal(items) {
    let total = 0, count = 0;
    for (let item of items) {
        total += item.price;
        count++;
    }
    return total / count;   // Bug: should return total
}

const products = [
    { name: "Apple",  price: 1.5 },
    { name: "Banana", price: 0.5 },
    { name: "Orange", price: 2.0 }
];

console.log(calculateTotal(products));   // 1.333...

Run with Start Debug → pause → open Copilot Chat:

@vision I expected 4.0 (the sum), but got 1.33. Fix the function.

Copilot sees total = 4, count = 3, average = 1.333 from your live debugger and replies with the corrected return total;.

What you get

• @vision Copilot Chat participant — Copilot reads live debugger state on every prompt
• Sidebar panel — local variables, error messages, console output, and call stack at a glance
• Debug controls — Continue, Step, Stop with familiar shortcuts (F5, F10)
• Status bar indicator — see debugger state without opening the panel

Commands

Requirements

• VS Code 1.70+
• GitHub Copilot Chat (required for @vision)
• Node.js 16+ (for running debugged scripts)

Current limitations (v0.1)

• Node.js / JavaScript / TypeScript only
• Variable extraction is simplified — deeply nested objects may show as [object Object]
• Browser/frontend debugging not supported yet
• Watch expressions and conditional breakpoints not supported yet

Roadmap

• Richer object inspection (full Debug Adapter Protocol parsing)
• Watch expressions, conditional breakpoints, breakpoint UI
• Browser/frontend debugging via Chrome DevTools Protocol
• Multi-language support (Python, Go, Java) via DAP
• Slash commands inside @vision — /explain, /fix, /trace, /watch
• Variable timeline (see how values changed across steps)

Feedback

Found a bug? Have a feature request? Open an issue on the TheCodeLords page.

License

MIT