at-rule-in-declaration-list.html (1844B)
1 <!doctype html> 2 <title>CSS Syntax Test: handle at-rules in declaration lists</title> 3 <link rel="help" href="https://drafts.csswg.org/css-syntax/#consume-list-of-declarations"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <style id="test_sheet"> 7 </style> 8 <script> 9 function parseRule(rule_text) { 10 let sheet = test_sheet.sheet; 11 if (sheet.cssRules.length != 0) 12 sheet.deleteRule(0); 13 sheet.insertRule(rule_text); 14 return sheet.cssRules[0]; 15 } 16 17 test(() => { 18 let rule = parseRule(` 19 div { 20 @at {} 21 color: green; 22 } 23 `); 24 assert_equals(rule.style.color, "green"); 25 }, "Allow @-rule with block inside style rule"); 26 27 test(() => { 28 let rule = parseRule(` 29 div { 30 @at at; 31 color: green; 32 } 33 `); 34 assert_equals(rule.style.color, "green"); 35 }, "Allow @-rule with semi-colon inside style rule"); 36 37 test(() => { 38 let rule = parseRule(` 39 @page { 40 @at {} 41 margin-top: 20px; 42 } 43 `); 44 assert_equals(rule.style.marginTop, "20px"); 45 }, "Allow @-rule with block inside page rule"); 46 47 test(() => { 48 let rule = parseRule(` 49 @page { 50 @at at; 51 margin-top: 20px; 52 } 53 `); 54 assert_equals(rule.style.marginTop, "20px"); 55 }, "Allow @-rule with semi-colon inside page rule"); 56 57 test(() => { 58 let rule = parseRule(` 59 @font-face { 60 @at {} 61 font-family: myfont; 62 } 63 `); 64 assert_equals(rule.style.fontFamily, "myfont"); 65 }, "Allow @-rule with block inside font-face rule"); 66 67 test(() => { 68 let rule = parseRule(` 69 @font-face { 70 @at at; 71 font-family: myfont; 72 } 73 `); 74 assert_equals(rule.style.fontFamily, "myfont"); 75 }, "Allow @-rule with semi-colon inside font-face rule"); 76 </script>