CSS Selectors: 5 months later
Sunday, 11 February 2007
During my work on the CSS selector test for CSS3.info I discovered a number of bugs in the selector implementations of all popular browsers. So I filed a number of bug reports with additional information on how to fix these bugs. It’s now five months later and time for a little update.
Konqueror
Konqueror only contained a single bug that resulted in 6 buggy selectors: attribute values should be treated case-sensitive in some cases and case-insensitive in other cases. I’ve worked together with the developers of Konqueror to come up with a definitive list of how each attribute should be treated. The solution was too late for the release of Konqueror 3.5.5, but it did make the next one. I want to congratulate the developers because this makes it the first browser to pass all of the tests and its developers can rightfully claim that Konqueror 3.5.6 fully supports all of the CSS selectors.
Firefox
Firefox suffered from a number of different bugs, including a variant of the same bug that plagued Konqueror. It did contain a list of how attributes should be treated, but it was simply not complete. I personally wrote a patch that updated the list to the same as Konqueror. The patch was accepted and has made it in Gran Paradiso, the test version of the next generation engine for Firefox 3.
Unfortunately this is the only bug that was fixed in its CSS selector support. Firefox still suffers from a number of other problems. It incorrectly considers text nodes as a child during the evaluation of :first-child
, :last-child
and :only-child
. Additionally the rendered view is not updated every time a selector matches or does not match anymore. For example, during the building of the DOM, each element is at one time the last child of its parent – at least until the next child is processed. After the DOM is build, the :last-child
selector should only match the then-current last child. And Firefox does this correctly, but it forgets to update the rendered view, so to the user (and also our CSS selector test) it still looks like every element matches the selector. When you force Firefox to re-render the page – for example by hovering over a link with a :hover
selector – it will show you the correct rendered view.
Safari
Webkit – the engine on which Safari is build has made a number of changes to their CSS selector support. First of all, they now properly support the :lang()
selector, and started work on some other CSS selector bugs. Unfortunately they decided to stop working on those bugs and temporarily drop support for these CSS 3 selectors.
Even though I’d rather see full support for all selectors, I do agree with their reasoning that it is better to drop support than ship a browser with buggy support. Mac OS X 10.5 and Safari 3 are coming this spring and shipping a stable browser is very important. So I was not surprised that the WebKit developers announced that they were temporarily changing their focus on stability instead of on new features. CSS 3 selector support seems to be a victim of this change in focus, but I have full confidence that they will continue working on this after the release of Safari 3.
What about Opera? We’re the second browser to pass the test, and the Wii browser and Opera Mini 4 Beta are already out there with quite advanced support. We didn’t get anyone working with us to fix the issues either ;)