at-scope-parsing.html (2645B)
1 <!doctype html> 2 <title>@scope: parsing</title> 3 <link rel="help" href="https://drafts.csswg.org/css-cascade-6/#scope-atrule"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <main id=main></main> 7 <script> 8 function test_valid(actual, expected) { 9 if (expected === undefined) 10 expected = actual; 11 test(t => { 12 t.add_cleanup(() => main.replaceChildren()); 13 let style = document.createElement('style'); 14 style.textContent = `${actual}{}`; 15 main.append(style); 16 assert_equals(style.sheet.rules.length, 1); 17 let rule = style.sheet.rules[0]; 18 assert_equals(rule.cssText, `${expected} {\n}`); 19 }, `${actual} is valid`); 20 } 21 22 function test_invalid(actual) { 23 test(t => { 24 t.add_cleanup(() => main.replaceChildren()); 25 let style = document.createElement('style'); 26 style.textContent = `${actual}{}`; 27 main.append(style); 28 assert_equals(style.sheet.rules.length, 0); 29 }, `${actual} is not valid`); 30 } 31 32 test_valid('@scope (.a)'); 33 test_valid('@scope (.a + .b)'); 34 test_valid('@scope (.a:hover)'); 35 test_valid('@scope (.a:hover, #b, div)'); 36 test_valid('@scope (:is(div, span))'); 37 38 test_valid('@scope (.a) to (.b)'); 39 test_valid('@scope (.a)to (.b)', '@scope (.a) to (.b)'); 40 test_valid('@scope (.a) to (.b:hover, #c, div)'); 41 test_valid('@scope'); 42 test_valid('@scope to (.a)'); 43 test_valid('@scope (.a) to (&)'); 44 test_valid('@scope (.a) to (& > &)'); 45 test_valid('@scope (.a) to (> .b)'); 46 test_valid('@scope (.a) to (+ .b)'); 47 test_valid('@scope (.a) to (~ .b)'); 48 49 test_invalid('@scope ()'); 50 test_invalid('@scope to ()'); 51 test_invalid('@scope () to ()'); 52 test_invalid('@scope (.c <> .d)'); 53 test_invalid('@scope (.a, .c <> .d)'); 54 test_invalid('@scope (.a <> .b, .c)'); 55 test_invalid('@scope (div::before)'); 56 test_invalid('@scope (div::after)'); 57 test_invalid('@scope (slotted(div))'); 58 test_invalid('@scope (.a) to (div::before)'); 59 test_invalid('@scope (> &) to (>>)'); 60 test_invalid('@scope div'); 61 test_invalid('@scope (.a) unknown (.c)'); 62 test_invalid('@scope (.a) to unknown (.c)'); 63 test_invalid('@scope (.a) 1px (.c)'); 64 test_invalid('@scope (.a) to unknown(c)'); 65 test_invalid('@scope unknown(.a)'); 66 test_invalid('@scope 1px'); 67 test_invalid('@scope creep'); 68 test_invalid('@scope )))'); 69 test_invalid('@scope ('); 70 test_invalid('@scope ( {}'); 71 test_invalid('@scope to'); 72 test_invalid('@scope }'); 73 test_invalid('@scope (.a'); 74 test_invalid('@scope (.a to (.b)'); 75 test_invalid('@scope ( to (.b)'); 76 test_invalid('@scope (.a) from (.c)'); 77 </script>