1

How should I add breakpoints to .typescript source files of my Angular application using Firefox developer tools?

I can add breakpoints to generated javascript files, but is there a way to debug .ts source files? I'm working with the latest version of Angular.

2 Answers 2

4

Make sure your tsconfig.json file should have following line in compileroptions:

"sourceMap": true,

In browser press f12 and click on debugger tab. Now press ctrl+p a search bar will open. Search your ts file and add breakpoint.

Hope it will help.

Sign up to request clarification or add additional context in comments.

4 Comments

"sourceMap": true ..was already present in my config file. Whenever I try to add a breakpoint it's immediately removed; like I never added it in the first place. This happens only with my .ts source files.
I think it's problem of firefox version. Can you please try same on chrome and see it's working or not.
It does work in latest version of Chrome. However, I was hoping to work on my project with Firefox. That's why I posted this question in the first place :-)
@Dušan Jovanović +1, do you know if debugging is still not supported in Firefox?
0

Check the "Enable Source Maps" box in dev tools settings under "Advanced settings".

2 Comments

I removed the non-answering part, assuming that this can be tolerated as an answer to the question. But, if you think that what you are writing is a comment, then stop and please wait for your commenting privilege. You obviously do know the rule, please accept it to also apply to you and do not misuse an answer for what you mean as a comment. Answering is however very welcome. Try to contribute in an answering way and it will be very welcome. Have fun.
Anybody with more technical understanding than mine, if this cannot be considered an answer to the question please let me know. Flagging as NAA is then appropriate and I apologise.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.