| Test queries with the :matches selectors. |
| |
| On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE". |
| |
| |
| PASS document.body.querySelectorAll('#area1 > :matches(div, p)').length is 6 |
| PASS document.body.querySelectorAll('#area1 > :matches(p, span)').length is 2 |
| PASS document.body.querySelectorAll('#area1 > :matches(div, p, span)').length is 7 |
| PASS document.body.querySelectorAll('#area1 > :matches(:not(div), :not(p))').length is 8 |
| PASS document.body.querySelectorAll('#area1 > :matches(.cocoa, .cappuccino)').length is 4 |
| PASS document.body.querySelectorAll('#area2 :matches(p > .cocoa, p > .cappuccino)').length is 2 |
| PASS document.body.querySelectorAll('#area2 :matches(.cocoa, p > .cappuccino)').length is 2 |
| PASS document.body.querySelectorAll('#area2 :matches(div > .cocoa, p > .cappuccino)').length is 1 |
| PASS document.body.querySelectorAll('#area2 :matches(.cappuccino, p) > span').length is 3 |
| PASS document.body.querySelectorAll('#area3 :matches(.cocoa .cappuccino, .tea)').length is 3 |
| PASS document.body.querySelectorAll('#area3 :matches(.cocoa > .cappuccino, .tea)').length is 1 |
| PASS document.body.querySelectorAll('#area4 :matches(.cocoa + .cappuccino)').length is 1 |
| PASS document.body.querySelectorAll('#area4 :matches(.cocoa ~ .cappuccino)').length is 2 |
| PASS document.body.querySelectorAll('#area4 :matches(.cocoa ~ :matches(.cocoa, .cappuccino))').length is 3 |
| PASS document.body.querySelectorAll('#area5 :matches(.cocoa::first-letter)').length is 0 |
| PASS document.body.querySelectorAll('#area5 :matches(.cocoa::first-letter, .cocoa)').length is 1 |
| PASS successfullyParsed is true |
| |
| TEST COMPLETE |
| |