JS cross browser inconsistencies/differences

Question

There are lots of DOM/CSS inconsistencies between browsers. But how many core JS differences are there between browsers? One that recently tripped me up is that in Firefox, setT

Answer 1

Well, I'm going to open up a CW:

• Prior to Firefox 4 Function.apply only accept an Array, not an array-like object. Ref MDC: Function.apply
• Some engines (which ones?) promote the result of String.prototype methods from string to String. Ref a String.prototype's "this" doesn't return a string?
• Firefox 4 may insert "event loops" into seemingly synchronous code. Ref Asynchronous timer event running synchronously ("buggy") in Firefox 4?
• Earlier Firefox versions would accept a trailing , in object literals. Ref trailing comma problem, javascript (Seems "fixed" in FF6).
• Firefox and IE both treat function-expression productions incorrectly (but differently).
• Math.round/Math.toFixed. Ref Math.round(num) vs num.toFixed(0) and browser inconsistencies
• The IE vs. W3C Event Model -- both are missing events/features of the other.

Answer 2

I find QuirksMode and WebDevout to have the best tables regarding CSS and DOM quirks. You can bridge those incompatibilities with jQuery. There is also this great list started by Paul Irish which includes pretty much any polyfill you could ever need, including ones for ES5 methods such as Array.map.

Answer 3

There doesn't appear to be anything out there that clearly outlines all these issues (very surprising actually). If you use jQuery there is a nice browser compatibility doc section that outlines supported browsers and known issues. I just deal with issues as they come up (as you should be browser testing in all cases anyways) and you can document them if you want to make sure you are coding correctly or if you run into issues and need to know fixes. It's easy to find issues when you do a quick search on a particular topic.