1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146
|
<!doctype html>
<title>Selectors: syntax of case-sensitivity attribute selector</title>
<link rel="help" href="https://drafts.csswg.org/selectors/#attribute-case">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style></style>
<div id=log></div>
<div id=test foo="BAR" baz="quux"></div>
<iframe id="quirks" src="resources/syntax-quirks.html"></iframe>
<iframe id="xml" src="resources/syntax-xml.xhtml"></iframe>
<script>
setup({explicit_done:true});
var valid = [
"[foo='BAR'] /* sanity check (valid) */",
"[baz='quux'] /* sanity check (valid) */",
// Case-insensitive selectors.
"[foo='bar' i]",
"[foo='bar' I]",
"[foo=bar i]",
'[foo="bar" i]',
"[foo='bar'i]",
"[foo='bar'i ]",
"[foo='bar' i ]",
"[foo='bar' /**/ i]",
"[foo='bar' i /**/ ]",
"[foo='bar'/**/i/**/]",
"[foo=bar/**/i]",
"[foo='bar'\ti\t] /* \\t */",
"[foo='bar'\ni\n] /* \\n */",
"[foo='bar'\ri\r] /* \\r */",
"[foo='bar' \\i]",
"[foo='bar' \\69]",
"[foo='bar' \\49]",
"[foo~='bar' i]",
"[foo^='bar' i]",
"[foo$='bar' i]",
"[foo*='bar' i]",
"[foo|='bar' i]",
"[|foo='bar' i]",
"[*|foo='bar' i]",
// Case-sensitive selectors.
"[baz='quux' s]",
"[baz='quux' S]",
"[baz=quux s]",
'[baz="quux" s]',
"[baz='quux's]",
"[baz='quux's ]",
"[baz='quux' s ]",
"[baz='quux' /**/ s]",
"[baz='quux' s /**/ ]",
"[baz='quux'/**/s/**/]",
"[baz=quux/**/s]",
"[baz='quux'\ts\t] /* \\t */",
"[baz='quux'\ns\n] /* \\n */",
"[baz='quux'\rs\r] /* \\r */",
"[baz='quux' \\s]",
"[baz='quux' \\73]",
"[baz='quux' \\53]",
"[baz~='quux' s]",
"[baz^='quux' s]",
"[baz$='quux' s]",
"[baz*='quux' s]",
"[baz|='quux' s]",
"[|baz='quux' s]",
"[*|baz='quux' s]",
];
var invalid = [
"[foo[ /* sanity check (invalid) */",
"[foo='bar' i i]",
"[foo i ='bar']",
"[foo= i 'bar']",
"[i foo='bar']",
"[foo='bar' i\u0000] /* \\0 */",
"[foo='bar' \u0130]",
"[foo='bar' \u0131]",
"[foo='bar' ii]",
"[foo='bar' ij]",
"[foo='bar' j]",
"[foo='bar' \\\\i]",
"[foo='bar' \\\\69]",
"[foo='bar' i()]",
"[foo='bar' i ()]",
"[foo='bar' () i]",
"[foo='bar' (i)]",
"[foo='bar' i []]",
"[foo='bar' [] i]",
"[foo='bar' [i]]",
"[foo='bar' i {}]",
"[foo='bar' {} i]",
"[foo='bar' {i}]",
"[foo='bar' 1i]",
"[foo='bar' 1]",
"[foo='bar' 'i']",
"[foo='bar' url(i)]",
"[foo='bar' ,i]",
"[foo='bar' i,]",
"[foo='bar']i",
"[foo='bar' |i]",
"[foo='bar' \\|i]",
"[foo='bar' *|i]",
"[foo='bar' \\*|i]",
"[foo='bar' *]",
"[foo='bar' \\*]",
"[foo i]",
"[foo/**/i]",
];
var mode = "standards mode";
onload = function() {
var quirks = document.getElementById('quirks').contentWindow;
var xml = document.getElementById('xml').contentWindow;
[window, quirks, xml].forEach(function(global) {
var style = global.document.getElementsByTagName('style')[0];
var elm = global.document.getElementById('test');
function clean_slate() {
style.textContent = '';
assert_equals(style.sheet.cssRules.length, 0, 'CSSOM was not empty for empty stylesheet');
assert_equals(global.getComputedStyle(elm).visibility, 'visible', 'computed style for empty stylesheet');
}
valid.forEach(function(s) {
test(function() {
clean_slate();
style.textContent = s + ' { visibility:hidden }';
assert_equals(style.sheet.cssRules.length, 1, 'valid rule didn\'t parse into CSSOM');
assert_equals(global.getComputedStyle(elm).visibility, 'hidden', 'valid selector didn\'t match');
}, s + ' in ' + global.mode);
test(function() {
assert_equals(global.document.querySelector(s), elm, 'valid selector');
}, s + ' with querySelector in ' + global.mode);
});
invalid.forEach(function(s) {
test(function() {
clean_slate();
style.textContent = s + ' { visibility:hidden }';
assert_equals(style.sheet.cssRules.length, 0, 'invalid rule parsed into CSSOM');
assert_equals(global.getComputedStyle(elm).visibility, 'visible', 'invalid selector matched');
}, s + ' in ' + global.mode);
test(function() {
assert_throws_dom("SyntaxError", global.DOMException, function() {
global.document.querySelector(s);
}, 'invalid selector');
}, s + ' with querySelector in ' + global.mode);
});
});
done();
};
</script>
|