CSS Selector test updated
Last week we unveiled the CSS selector test over at css3.info. The test consists of over several hundred separate test cases, each designed to test a certain aspect of the compatibility of your browser with the CSS selector standards. Today we are going to expand the number of test cases to 578.
The new tests have a large impact of the results. There are quite a few browsers that used to pass with the old test cases, but fail with the new test cases. Generally we added test cases for the following situations:
- Dynamic updates: If you update the DOM using Javascript this should also affect the CSS selectors. Take for example the
:emptyselector. It only matches elements without any children. If you dynamically add a new child it should not longer match that particular element. - White space in attribute selectors: There are four different ways an attribute selector could be written:
[attribute=value],[attribute =value],[attribute= value]and[attribute = value]. We now test if your browser supports all of these variants. - Case sensitivity of the value in attribute selectors: The previous version of the test contained a test case for determining if the value of an attribute selector was compared in a case-insensitive way. However this was not complete. We only tested the
alignattribute – which should be treated in a case-insensitive way. Only Konqueror failed this test. But there are also a lot of other attributes which should be tested in a case-sensitive way. Now almost every browser fails this test. More information about this case-sensitivity can be found on rakaz.nl: CSS selector bugs: Case sensitivity
We also changed the way results are reported. Instead of just showing whether a selector failed or passed, we now detect if the selector is fully supported, buggy, or not supported at all. This should give all of us a better idea about the state of the compatibility of each browser.
| Browser | Version | Supported | Buggy | Unsupported | No. tests passed |
|---|---|---|---|---|---|
| Internet Explorer | 6 | 10 | 1 | 32 | 276 |
| Internet Explorer | 7 RC 1 | 13 | 4 | 26 | 330 |
| Opera | 8.5.4 | 18 | 3 | 22 | 317 |
| Safari | 2.0.4 | 21 | 7 | 15 | 336 |
| Firefox | 1.0.8 | 24 | 9 | 10 | 352 |
| Opera | 9.0.2 | 25 | 3 | 15 | 346 |
| Safari | r16925 | 25 | 9 | 9 | 355 |
| Firefox | 1.5.0.7 | 26 | 10 | 7 | 357 |
| Konqueror | 3.5.4 | 37 | 6 | 0 | 570 |
Guys, you are doing a great job! Thanks!
Keep it running!
I’m interested in seeing how Konq 3.5.5 does. It was released a few days before you did the test :) so hopefully you’ll update the results when you get a copy.
I’ve just run 3.5.5 - the same results as 3.5.4
IE 7 release is unchanged from RC 1
Firefox 2.0 is unchanged from Fx 1.5
Thanks to your patch (bug 356936), Gecko trunk now does:
32 have passed, 4 are buggy and 7 are unsupported (Passed 370 out of 579 tests). :-)
One thought: IE 7 is a still wrong for E + F in the following case:
[foo]blabla[foo][!-- html comment --][bar]boubou[/bar]
foo + bar, bar will not be styled in IE 7.
(I used styled brackets, not sure what your comment system allows.
You could come up with tests for :first-child that gives similar errors.
From the 43 selectors 32 have passed, 4 are buggy and 7 are unsupported (Passed 369 out of 578 tests)
latest firefox trunk build firefox 3 will have great support
Konqueror 3.5.5 on SUSE 10.2:
From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported (Passed 578 out of 578 tests)
[...] With so many unsupported selectors what chance is there to implement CSS3 selectors [...]
Konqueror 3.5.6 on Kubuntu Edgy:
From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported (Passed 578 out of 578 tests)
KHTML is the first rendering engine to thoroughly pass the 578 tests.