Image via Wikipedia
I've spent the last several days immersed in debugging Javascript in Internet Explorer. It's not as bad as it could be. After all, I'm using jQuery and that cuts down on the cross-browser incompatibilities.
In it's normal usage, Kynetx Network Services (KNS) compiles our domain specific language, called KRL, into Javascript. Since we test that the Javascript is compatible with multiple browsers, normal rule evaluation is pretty safe.
However, like any good DSL, KRL has a way of dropping out of the DSL and into the base system--in this case Javascript. That's when things get dicey. There are so many ways of creating browser problems when you're working with Javascript and CSS.
In Firefox, the venerable Firebug add-on is the tool for debugging CSS and Javascript. I use it's console all the time to execute Javascript against the page and see what works and what doesn't.
Alas, Firebug isn't available for IE. There are a few "for pay" tools that are supposed to be similar, but I haven't been able to see to my satisfaction what I'd get for my money. I also understand that Visual Studio has good tools.
When I was at Add On Con last week, Joshua Allen from Microsoft said that you should develop in IE8 because it has the best developer tools. I found that to be true--although they still leave a lot to be desired compared the Firefox.
The first thing you have to do is turn on debugging in IE by making sure that the "Disable script debugging" options are unchecked.
The error messages you get are pretty cryptic, but they at least give you a clue about where to look. The worst part is that they don't give you the name of the file where the error occurred. Ugh. @whitmer suggested Companion JS (not free for commercial use). I haven't tried it, but it looks like its a step above the stock debug messages.
Another good tool is the IE Developer Toolbar (free). This gives you the ability to browse the DOM, change CSS properties on the fly, clear the browser cache, etc. As far as I can tell there's no actual Javascript debugging and certainly no console. Still, being able to see the DOM, especially as its modified by Javascript components has been a great help.
I found this tutorial on using Web Developer Express Edition to debug Javascript, but I haven't tried it.
So far, that's what I've discovered. I'm sure there are better ways and tools. I look forward to someone educating me.
