Cross Browser JavaScript Still Hard

Recently, I’ve been doing a reasonable amount of playing around with prototype and scriptaculous. They’re both really great libraries that give you loads of features and take a lot of trouble out of your hands. But they certainly don’t absolve you from cross browser compatibility testing. Whilst the libraries themselves are pretty much cross browser compatible, your own code likely isn’t until proved otherwise…

The discoveries I have made that lead to this:

  • MSIE doesn’t like trailing commas. e.g. this throws up an a JScript error in Internet Explorer.
  {
    foo: 1,
    bar: 2,
  }
  • I’m still tracking this one down, but I started getting errors when I did Element.show('non-existent-id') in Internet Explorer, but not FireFox. Why doesn’t Firefox complain? I think it should do.
    • Oh all right, it does complain. I missed the warning.

Doubtless this is just the beginning of a list.

Of course, I managed to waste plenty of time arriving at these problems, because Internet Explorer has such incredibly lacklustre development tools. For example, to get any idea at all of where the error in your code is1, you have to install the Microsoft Script Debugger. This is very primitive, but it will show you where the error actually occurred, and gives you a fighting chance of examining some variables in the locality2.

In my case, the script debugger didn’t even work properly when first installed. After reading somewhere that Visual Studio surperceded the Script Debugger, I remembered an experiment I’d performed a while back. It turned out that something called MDM had gottened installed. Deleting it and all associated registry entries made the Script Debugger spring back into life. Finally!

Another hint worth noting about the Script Debugger: if you want it to run in a non-administrator account, you need to put yourself in the “Debugger Users” group.

1 The error that pops up in Internet Explorer gives you a line number without a filename which is none too helpful.

2 Hint: you have to use alert() to see any useful output in the command window, then flick back to the browser to see the popup.