| <!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/#css-values"> |
| <meta name="flags" content="dom"> |
| <meta name="assert" content="Testing Serialization of Shorthand Values"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| </head> |
| <body> |
| <div id="cssomtestElm"></div> |
| <div id="log"></div> |
| <script> |
| var tests = { |
| 'border': [ |
| ['border: 1px; border-top: 1px;', 'border: 1px;'], |
| ['border: 1px solid red;', 'border: 1px solid red;'], |
| ['border: 1px red;', 'border: 1px red;'], |
| ['border: red;', 'border: red;'], |
| ['border-top: 1px; border-right: 1px; border-bottom: 1px; border-left: 1px;', 'border: 1px;', ' (#2)'], |
| ['border-top: 1px; border-right: 2px; border-bottom: 3px; border-left: 4px;', 'border-width: 1px 2px 3px 4px;'], |
| ['border: 1px; border-top: 2px;', 'border-width: 2px 1px 1px;'], |
| ['border: 1px; border-top: 1px !important;', |
| 'border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-width: 1px !important;'], |
| |
| ['border: 1px; border-top-color: red;', 'border-width: 1px; border-top-color: red;'], |
| ['border: solid; border-style: dotted', 'border: dotted;'], |
| ['border-width: 1px;', 'border-width: 1px;'] |
| ], |
| |
| 'overflow': [ |
| ['overflow-x: scroll; overflow-y: hidden;', 'overflow: scroll hidden;'], |
| ['overflow-x: scroll; overflow-y: scroll;', 'overflow: scroll;'] |
| ], |
| 'outline': [ |
| ['outline-width: 2px; outline-style: dotted; outline-color: blue;', 'outline: blue dotted 2px;'] |
| ], |
| 'margin': [ |
| ['margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px;', 'margin: 1px 2px 3px 4px;'] |
| ], |
| 'list': [ |
| ['list-style-type: circle; list-style-position: inside; list-style-image: initial;', 'list-style: circle inside;'], |
| ['list-style-type: lower-alpha;', 'list-style-type: lower-alpha;'] |
| ], |
| 'font-family': [ |
| ['font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold;', |
| 'font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold;'] |
| ], |
| 'padding': [ |
| ['padding-top: 1px; padding-right: 2px; padding-bottom: 3px; padding-left: 4px;', 'padding: 1px 2px 3px 4px;'], |
| ] |
| } |
| |
| var results = {}; |
| |
| var testElm = document.getElementById('cssomtestElm'); |
| for (var test in tests) { |
| if(tests.hasOwnProperty(test)) { |
| results[test] = []; |
| var propertyTests = tests[test]; |
| |
| for (i = 0; i < propertyTests.length; i++) { |
| document.getElementById('cssomtestElm').setAttribute('style', propertyTests[i][0]); |
| var titleSuffix = propertyTests[i][2] || ""; |
| results[test].push([ |
| test + ' is expected to be ' + propertyTests[i][1] + titleSuffix, |
| document.getElementById('cssomtestElm').style.cssText, |
| propertyTests[i][1] |
| ]); |
| } |
| |
| generate_tests(assert_equals, results[test]); |
| } |
| } |
| |
| </script> |
| </body> |
| </html> |
