Javascript Madness: Introduction

Introduction

In the course of the development of the Web Paint-by-Number site and various other heavy-duty Javascript applications, I've found it necessary to do a lot of experimentation with different browsers to figure out how they handle different things. The results have generally been nightmarish, with truly impressive ranges of bizarre and strange behavior.

These pages summarize my results in a few areas, mainly having to do with event handling. I wrote them up largely for my own future reference. I have found very little of this information available elsewhere on the web.

Ideally, we would be able to write single Javascript programs that would work on all browsers. In practice, this is only possible if you are willing give up a lot of functionality. Many of the features used in the Web Paint-by-Number site would have been impossible in implement without first sensing the browser type and then selecting different code to run for different browsers, or different versions of the same browser. Sad, but true.

Worse, due to bad design and shear bugginess, there are perfectly simple things that cannot be reliably done on some browsers, like identifying with certainty which key was pressed to trigger a keydown event or recognizing when the second click of a double-click occurs.

If you are a programmer trying to sort these things out, you might consider adopting one of the freely available Javascript toolkits on the web. Some of them can help insulate you from this kind of low-level headaches described in this page. Surveying such toolkits is beyond the scope of these pages, however. I recommend that you google "Javascript toolkit" and see what you find.

Contents

Mouse Events

Madness in the handling of mouse events. Which events are fired when you click or double-click with the left, right or middle mouse button on various browsers.

Key Events

Madness in the handling of keyboard events. Which events are fired when you hit or release a key or allow it to auto-repeat in various browsers. The demented strangeness of key codes which may or may not identify which key was hit.

Dynamic Script Loading

A study of a method of loading additional Javascript functions on demand after the rest of the page has already been loaded. As usual, many browser incompatibilities are discovered.

Layout Engines and Gecko Versions

Why I talk about "Gecko" instead of "Firefox" in the above notes. Which versions of Gecko are used by various browsers and a few notes on other layout engines.

Ill Informed Grousing About Browsers

These tests have done little to raise the various browsers in my esteem. I'm sure most everyone is trying very hard and the task is very difficult, but the results, from where I sit as a web application developer, aren't very impressive.

Internet Explorer

Old fashioned and hardly compliant to standards. The nicest thing that you can say about them is that they hardly ever fix anything. Many of the well-known bugs in IE 5 are still with us today in IE 7, though a few have gone away, especially if you force it out of quirks mode. Microsoft doesn't seem to be trying very hard to improve it, but that's not all bad from a programmer's point of view. It may be evil, but at least it's a familiar evil.

Firefox and other Gecko Browsers

Much more standards compliant than IE. It may be true that all bugs are shallow to many eyes, but many eyes seem to make danged slow progress. Bugs often don't get fixed for years after they have been reported. The fact that development is actually happening at all does mean that bugs come and go from version to version, adding to the complexity of trying to write Javascript code that works properly on all of them. However, from my perspective, they did manage to reach a level of basic adequacy with the release of Firefox 1.5, something Microsoft may never acheive, given their current rate of progress.

Safari

This is the browser that causes me the least headaches. If you write code to work on IE and Firefox, then it pretty much always works on Safari. There are lots of signs of very careful thought going into their design choices, clear attempts to balance compatibility with sanity. In terms of compatibility and correctness, Safari seems to have overtaken everything else. It's a good thing that even the older versions are pretty good, because older versions of Safari hang around longer than older versions of most other browsers. This is because upgrading to a newer Safari sometimes requires upgrading to a newer version of OS X, and thus costs quite a lot of money. I'm sure lots of people (like me) don't bother.

Opera

This is the browser that causes me the most headaches. While Mozilla's developers seem mired in bureaucracy, and Microsoft's developers have all cashed in their stock options and moved to the Bahamas, Opera's developers are speedy and nimble. Every release is different from the last. Old bugs turn into different bugs, new bugs are introduced, and sometimes a bug is even fixed. Every bug I ever reported to them was changed in a subsequent release, though none of them was ever actually fixed. (Update: one may have been!) Some behavior is subtly wonky. I sometimes wish they would slow down and figure out how things are supposed to work instead of patching patches. I strongly suspect their event handling code needs to be thrown out and re-written from scratch if it's ever going to really be correct. As it is, tracking what does and does not work in Opera is a constant headache, and there have always been enough non-working stuff that I have never really been able to get any version to fully work on my web paint-by-number site, though different versions fail for different reasons.

Konqueror

This browser is a lot better than one would reasonably expect from something with so little visibility. Safari was derived from it, but the relationship doesn't always show. In mouse and key event handling, they are very different. It doesn't always seem like the fixes Apple made got back to the Konqueror people.

iCab

Another browser that is remarkably good for something with so little visibility. With version 4 they abandoned their pretty decent layout engine and started using the Safari one instead. An excellent choice, but it must have been hard to abandon all that code they developed.

Netscape 4

Obviously nobody uses this anymore. It is sometimes included in these reports because it was the source of many defacto standards that newer browser more or less emulate, so it gives a little historical context to all this that can help make more sense of it all.

No, I hate IE more. The rest at least mean well.

And I'm beginning to develop some respect for the Safari team.