| <!doctype html> |
| <meta charset="utf-8"> |
| <title>CSS Paged Media: parsing @page declarations inside @media</title> |
| <link rel="author" title="Felipe Erias Morandeira" href="mailto:felipeerias@gmail.com"/> |
| <link rel="help" href="https://drafts.csswg.org/css-page/#at-page-rule"/> |
| <meta name="assert" content="Test that @page declarations inside @media are parsed correctly."> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| |
| <style type="text/css"> |
| |
| @media print { |
| @page { |
| margin: 3cm; |
| } |
| @page :first { |
| margin-top: 6cm; |
| } |
| @page :left { |
| color: red; |
| } |
| @page :right { |
| color: blue; |
| } |
| } |
| |
| </style> |
| <script type="text/javascript"> |
| |
| test(function(){ |
| let expectedForSelector = { |
| "" : "margin: 3cm;", |
| ":first" : "margin-top: 6cm;", |
| ":left" : "color: red;", |
| ":right" : "color: blue;" |
| }; |
| let styleSheets = document.styleSheets; |
| for (let i = 0; i < styleSheets.length; i++) { |
| let rules = styleSheets[i].cssRules; |
| for (let rule of rules) { |
| if (rule.type == CSSRule.MEDIA_RULE && rule.conditionText == 'print') { |
| for (let mediaRule of rule.cssRules) { |
| if (mediaRule.type == CSSRule.PAGE_RULE) { |
| let expected = expectedForSelector[mediaRule.selectorText]; |
| assert_equals(mediaRule.style.cssText, expected, "unexpected @page contents"); |
| delete expectedForSelector[mediaRule.selectorText]; |
| } |
| } |
| } |
| } |
| } |
| assert_equals(Object.keys(expectedForSelector).length, 0, "missing @page selectors in @media"); |
| }, "test @page inside a @media print rule"); |
| |
| </script> |
