third_party/WebKit/LayoutTests/fast/css/cssText-shorthand.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/testharness.js"></script>
   3 <script src="../../resources/testharnessreport.js"></script>
   4 <script>
   5
   6 var tests = [
   7     ['border: 1px; border-top: 1px;', 'border: 1px;'],
   8     ['border: 1px solid red;', 'border: 1px solid red;'],
   9     ['border: 1px red;', 'border: 1px red;'],
  10     ['border: red;', 'border: red;'],
  11     ['border-top: 1px; border-right: 1px; border-bottom: 1px; border-left: 1px;', 'border: 1px;'],
  12     ['border-top: 1px; border-right: 2px; border-bottom: 3px; border-left: 4px;', 'border-color: initial; border-style: initial; border-width: 1px 2px 3px 4px;'],
  13     ['border: 1px; border-top: 2px;', 'border-color: initial; border-style: initial; border-width: 2px 1px 1px;'],
  14     ['border: 1px; border-top: 1px !important;',
  15     'border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-width: 1px !important;'],
  16
  17     ['border: 1px; border-top-color: red;', 'border-style: initial; border-top-color: red; border-width: 1px;'],
  18     ['border: solid; border-style: dotted', 'border: dotted;'],
  19     ['border-width: 1px;', 'border-width: 1px;'],
  20
  21     ['-webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 2px;', 'border-spacing: 1px 2px;'],
  22
  23     // We don't use shorthand for font-family, etc... for compatibility reasons
  24     ['font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold;',
  25         'font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold;'],
  26
  27     ['list-style-type: circle; list-style-position: inside; list-style-image: initial;', 'list-style: circle inside;'],
  28     ['margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px;', 'margin: 1px 2px 3px 4px;'],
  29     ['outline-width: 2px; outline-style: dotted; outline-color: blue;', 'outline: blue dotted 2px;'],
  30     ['overflow-x: scroll; overflow-y: hidden;', 'overflow-x: scroll; overflow-y: hidden;'],
  31     ['overflow-x: scroll; overflow-y: scroll;', 'overflow: scroll;'],
  32     ['padding-top: 1px; padding-right: 2px; padding-bottom: 3px; padding-left: 4px;', 'padding: 1px 2px 3px 4px;'],
  33     ['padding: initial; padding-top: initial !important',
  34         'padding-top: initial !important; padding-right: initial; padding-bottom: initial; padding-left: initial;'],
  35
  36     ['list-style-type: lower-alpha;', 'list-style-type: lower-alpha;']
  37 ];
  38
  39 function normalizeCssText(text) { return text.trim().split(/;\s*/).sort().slice(1).join("; "); }
  40
  41 var element;
  42 tests.forEach(function (values) {
  43     var styleAttribute = values[0];
  44     var expectedCssText = values[1];
  45     test(function() {
  46
  47         element = document.createElement('div');
  48         element.setAttribute('style', styleAttribute);
  49
  50         assert_equals(normalizeCssText(element.style.cssText), normalizeCssText(expectedCssText));
  51     }, "cssText set to " + JSON.stringify(styleAttribute) + " is read back as " + JSON.stringify(expectedCssText));
  52 });
  53
  54 </script>