| <!DOCTYPE html> |
| <title>CSS Nesting: CSSNestedDeclarations CSSOM (whitespace)</title> |
| <link rel="help" href="https://drafts.csswg.org/css-nesting-1/#nested-declarations-rule"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script> |
| // https://drafts.csswg.org/cssom/#serialize-a-css-rule |
| test(() => { |
| let s = new CSSStyleSheet(); |
| s.replaceSync(` |
| .a { |
| & { } |
| left: 1px; |
| & { } |
| right: 1px; |
| } |
| `); |
| assert_equals(s.cssRules.length, 1); |
| let a_rule = s.cssRules[0]; |
| assert_equals(a_rule.cssRules.length, 4); |
| for (let child_rule of a_rule.cssRules) { |
| child_rule.style = ''; |
| } |
| assert_equals(a_rule.cssText, '.a {\n & { }\n & { }\n}'); |
| }, 'Empty CSSNestedDeclarations do not affect outer serialization'); |
| |
| // https://drafts.csswg.org/cssom/#serialize-a-css-rule |
| test(() => { |
| let s = new CSSStyleSheet(); |
| s.replaceSync(` |
| .a { |
| @media (width > 1px) { |
| & { } |
| left: 1px; |
| & { } |
| right: 1px; |
| } |
| } |
| `); |
| assert_equals(s.cssRules.length, 1); |
| let outer = s.cssRules[0]; |
| assert_equals(outer.cssRules.length, 1); |
| |
| // @media |
| let media = outer.cssRules[0]; |
| assert_equals(media.cssRules.length, 4); |
| for (let child_rule of media.cssRules) { |
| child_rule.style = ''; |
| } |
| assert_equals(media.cssText, '@media (width > 1px) {\n & { }\n & { }\n}'); |
| }, 'Empty CSSNestedDeclarations do not affect outer serialization (nested grouping rule)'); |
| </script> |
