How do you debug IE & jQuery errors like this

Question

I'm developing in Javascript for quite a long time now. Usually when I hit an error in IE I know roughly where it originated even if the message received from IE is useless bunch of text. When I don't know where the error originated, I usually try to "delete" parts of my code, until the error doesn't repeat itself, and that start manually checking line by line until I find the error.

I'm sure that it's far from the best approach, so I'd like to ask you how you debug error like these:

Answer 1

If you are using IE8+, you can press F12 on a page to open the Developers Tools.

This contains a JavaScript debugger, much like Firebug & Chrome Dev Tools

EDIT: In response to the comment under the question, if IE is throwing a cryptic error that you are unsure of, there is a couple of steps I would do.

• Is it an IE only error? Does the same error occur in Firefox? Chrome?
• Is the error occurring in a 3rd party library. If you believe it is, use an un-minified version of the library.
• Can you replicate the error outside of your website? Can you make the error occur in a http://jsfiddle.net/ for instance?
• If you still can't narrow down the issue, post a question on SO with your code, any error messages, and expectations of the result.

HTH

Answer 2

Try using non-minified version of jQuery - it will give you a better idea where exactly the error is. Also, if you use VS 2010 to debug your js code in IE, it will break at the error line. This always works fine for me.