| <!doctype html> |
| <head> |
| <title>CSS OM: CSS Values</title> |
| <link rel="author" title="Divya Manian" href="mailto:manian@adobe.com"> |
| <link rel="help" href="http://www.w3.org/TR/cssom-1/#the-cssrulelist-interface"> |
| <meta name="flags" content="dom"> |
| <meta name="assert" content="Testing Serialization of Style Rules"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <style id="s-0"> |
| @namespace svg "http://www.w3.org/2000/svg"; |
| </style> |
| <style id="s-1"> |
| @import url('main.css'); |
| </style> |
| <style id="s-2"> |
| h1 { background: indianred; } |
| </style> |
| <style id="s-3"> |
| @namespace svg "http://www.w3.org/2000/svg"; |
| svg|a { color: white; } |
| </style> |
| <style id="s-4"> |
| @font-face { |
| font-family: 'Megalopolis'; |
| src: url('fonts/megalopolisextra-webfont.eot'); |
| src: url('fonts/megalopolisextra-webfont.eot?#iefix') format('embedded-opentype'), |
| url('fonts/megalopolisextra-webfont.woff') format('woff'), |
| url('fonts/megalopolisextra-webfont.ttf') format('truetype'), |
| url('fonts/megalopolisextra-webfont.svg#MEgalopolisExtraRegular') format('svg'); |
| font-weight: normal; |
| font-style: normal; |
| } |
| </style> |
| <style id="s-5"> |
| @media (min-width: 200px) { |
| h1 { background: aliceblue; } |
| } |
| </style> |
| <style id="s-6"> |
| @page :first { |
| h1 { color: #444; } |
| } |
| </style> |
| </head> |
| <body> |
| <div id="log"></div> |
| <script> |
| var stylesheets = document.styleSheets; |
| var ruletypes = { |
| 1: 'Style Rule', |
| 3: '@import rule', |
| 4: 'media rule', |
| 5: '@font-face rule', |
| 6: 'page rule', |
| 10: 'Namespace rule', |
| 11: 'unrecognized rule' |
| }; |
| |
| var types = { |
| 's-0': '@namespace svg "http://www.w3.org/2000/svg"', |
| 's-1': '@import url("main.css")', |
| 's-2': 'h1', |
| 's-3': 'svg|a', |
| 's-4': '@font-face', |
| 's-5': '@media (min-width: 200px)', |
| 's-6': '@page :first' |
| } |
| |
| var ruleOrder = [10, 3, 1, 1, 5, 4, 6]; |
| |
| var results = []; |
| |
| |
| for (i = 0; i < stylesheets.length; i++) { |
| if(i == 3) { |
| cssType = stylesheets[i].cssRules.length > 0 && stylesheets[i].cssRules[1] ? stylesheets[i].cssRules[1].type : 11; |
| } else { |
| cssType = stylesheets[i].cssRules.length > 0 ? stylesheets[i].cssRules[0].type : 11; |
| } |
| |
| results.push([ |
| ruletypes[ruleOrder[i]] + ' is expected to be ' + types['s-' + i], |
| ruletypes[cssType], |
| ruletypes[ruleOrder[i]] |
| ]); |
| |
| } |
| |
| generate_tests(assert_equals, results); |
| |
| </script> |
| </body> |
| </html> |
| |
