Debug code

[bernardoadc]

Would it be feasible to see code running and debug with vscode? I'm thinking this should be super hard but also awesome! Mental steps:

• press F7 (or whatever)
• extension creates temporary .js file, vscode opens that in editor
• extension executes code in debug mode, before runs line 1
• or (not even sure it's possible, but could lead to having to) get breakpoints in original file and pass them along to temporary file, and only stop there if breakpoints exists

---

Thinking alternatives here. It could generate temp file and open it. User manually sets breakpoints. Runs with F8, which would detect as extension temp file previously generated, and run immediately (not generate another file)

Or initially, adding breakpoints as simple 'debugger' statements for starters, before evolving to 'full feature'. For this I believe you would only need to run node with --inspect flag, or use some predefined VSCode launch config.

This project is a great idea! The only situation I cannot use it is the one described. Otherwise, would never go back to chrome's DevTools again to test some arbitrary code...

[Miramac]

Hi @khullah, sorry for the late response. Thank you for your suggestion, but in fact I used my own extension less and less. the build-in debug possibilities in VSCode (Run Code with F5) are almost perfect. You can set breakpoints, inspect variables and so on.

Or do you see a reason not to use them because this extension gives you other advantages?

[bernardoadc]

Hey, no problemo

So, how do you use VS's debugger? When F5 is pressed, it will start a debug session with the last launch config used. But there I can only do something like type node, request launch, and specify some file. I don't want that, I don't want to run the whole app. I just want to run some selected code, or even the current file (not change the config every time to a specific file - well, just learned its possible with program: "${file}"). Thats why I've mentioned using some predefined launch config - your extension would add/change the config, generate temp file and run VS debugger.

So, bottom line, your extension still beats VS debugger for selected lines. Agree?

[Miramac]

So, bottom line, your extension still beats VS debugger for selected lines. Agree?

yes thats right ;)

I think you've sketched a possible way very well already. Unfortunately I don't know when I will get there, because I have a lot to do in my work at the moment. Pull requests are very welcome :)

[bernardoadc]

Thanks, I believe I can do that, yeah! But first, let us get to the solution.

Reading it over, I think the simplest way is to open tmp file and pause execution right on the first line. Why bother getting breakpoints if the idea is to manually advance code execution? And, you could set new breakpoints at that moment, nevertheless.

Fortunately, this is what --inspect-brk arg does! However, in my tests this didn't work. I've tried a launch config (see below) and also changing settings with "miramac.node.args": "['--inspect-brk']", but nothing happens (maybe he is waiting for a inspector to attach?). Perhaps it should require the debugger extension and execute from there? Any ideas?

    {
        "type": "node",
        "request": "launch",
        "name": "Debug File",
        "program": "${file}",
        "args": [
            "--inspect-brk"
        ]
    }

PS: try it as well, my environment may be faulty.

[Miramac]

Yeah, it's true, "miramac.node.args": ["--inspect-brk"] does not produce the expected outcome. The reason is that --inspect-brk is a node argument and not a script arg.

we need node --inspect-brk script.js but get at the moment: node script.js --inspect-brk

Of course, this can easily be solved with a new config option

Now you can open Chrome and start the inspector. Of course it would be cool to get the inspector directly in the VS code - this is where the real work begins ;-)

[jiangyan33]

select some code and then use a shortcut key to debug it，that is very cool !