border-shorthand-serialization.html (1891B)
1 <!doctype html> 2 <html> 3 <link rel="author" title="Erik Nordin" href="mailto:enordin@mozilla.com"> 4 <link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#propdef-border"> 5 <link rel="help" href="https://drafts.csswg.org/cssom-1/#serialize-a-css-declaration-block"> 6 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1594241"> 7 <meta charset="utf-8"> 8 <title>serialization of border shorthand</title> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 <style id="target"> 12 .a { 13 border-width: 1px; 14 border-style: solid; 15 border-color: black; 16 } 17 .b { 18 border-width: 1px; 19 border-style: solid; 20 border-color: black; 21 border-image: linear-gradient(white,black); 22 } 23 .c { 24 border: 1px solid black; 25 } 26 </style> 27 <script> 28 test(function() { 29 let rule = document.getElementById('target').sheet.cssRules[0]; 30 assert_equals(rule.style.border, "", "border shorthand isn't serialized if border-image longhands are not initial"); 31 }, "Declaration with border longhands is not serialized to a border shorthand declaration."); 32 test(function() { 33 let rule = document.getElementById('target').sheet.cssRules[1]; 34 assert_equals(rule.style.border, "", "border shorthand isn't serialized if border-image longhands are not initial"); 35 }, "Declaration with border longhands and border-image is not serialized to a border shorthand declaration."); 36 test(function() { 37 let rule = document.getElementById('target').sheet.cssRules[2]; 38 assert_not_equals(rule.style.border, "", "border shorthand "); 39 assert_equals(rule.cssText, ".c { border: 1px solid black; }"); 40 }, "Border shorthand is serialized correctly if all border-image-* are set to their initial specified values."); 41 </script> 42 </html>