Debugging TypeScript code

[semafox]

Hi Radzen,

I am trying to set breakpoints in the TypeScript code via Visual Code, is it possible?

Thanks

[korchev]

Hi @semafox,

It seems possible but requires a few extra steps due the fact that debugging TypeScript requires a web browser (VS Code supports natively only NodeJS debugging).

1. You have to run the Radzen application from VS code.
2. Install the Chrome debugger extension if you don't have it already.
3. Create a new VS Code launch configuration. Open the launch.json file and append the following content:

{
   "name": "Attach to Chrome",
   "type": "chrome",
   "request": "attach",
   "port": 9222,
   "webRoot": "${workspaceFolder}/../client/src/app"
}

4. Start debugging
5. This is the important step - run chrome with remote debugging enabled. For windows you have to do the following:

• Right click the Chrome shortcut, and select properties
• In the "target" field, append --remote-debugging-port=9222

6. Finally from the VS Code debugger toolbar execute "Attach to Chrome".
   
   

At last you can break in the TypeScript code

It looks a bit too much for my taste to be honest which is why I prefer debugging in Chrome directly as described in our docs.

Best regards,
Atanas

[semafox]

Sorry, I should have read the online doc better… Debugging via Chrome is perfectly fine!

Thanks