[JavaScript] How to debug the code?

Programming JavaScript
1

Hi community! I’m doing the JavaScript track and I have some previous experience. One thing that helped me a lot when I was learning before was being able to run the code in Chrome or any browser and create “breakpoints” to understand how my code was being executed line-by-line.

Is there any way I can do it in VSC locally? Though the test functionality is very helpful, I can’t find where I’m making the mistake.

Happy to hear your thoughts.

2

Yes, you can!

This is what I do that works for me, there might be other ways to do it:

  1. Open the exercise folder as the only folder in the VSCode workspace.

  2. Set the breakpoints in the code where you want them.

  3. Go to the “Run and Debug” menu. You should see it in the left bar.

  4. In that menu, you should see a text in link form saying Show all automatic debug configurations.
    4.1 Select Node.js... → Run Script: test
    4.2 Launch the configuration from the “Run and Debug” menu
    4.3 The code should stop at your breakpoints now

If step 4 fails, you can create the same configuration manually by putting this into a .vscode/launch.json file in the exercise directory:

.vscode/launch.json 
{
  "configurations": [
    {
      "type": "node-terminal",
      "name": "Run Script: test",
      "request": "launch",
      "command": "yarn run test",
      "cwd": "${workspaceFolder}"
    }
  ]
}

After saving the file, the “Run and Debug” menu should have this configuration ready to run.

3

This is right.

@gonzaloalonsofiks I posted about this three years ago with some screenshots here:

Please responde here if you’re running into trouble.

1 Like
4

Thanks for your explanation!

5

Thanks! I’ll keep that in mind :slight_smile: