test_bug160403.html (3905B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=160403 5 --> 6 <head> 7 <title>Test for Bug 160403</title> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 10 </head> 11 <body> 12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=160403">Mozilla Bug 160403</a> 13 <div id="content" style="display: none"> 14 15 </div> 16 <pre id="test"> 17 <script type="application/javascript"> 18 19 /** Test for Bug 160403 */ 20 21 var element = document.getElementById("content"); 22 var style = element.style; 23 24 element.setAttribute("style", "border-top-style: dotted"); 25 is(style.getPropertyValue("border-top-style"), "dotted"); 26 is(style.getPropertyPriority("border-top-style"), ""); 27 is(style.getPropertyValue("border-style"), ""); 28 is(style.getPropertyPriority("border-style"), ""); 29 30 element.setAttribute("style", "border-top-style: dotted ! important"); 31 is(style.getPropertyValue("border-top-style"), "dotted"); 32 is(style.getPropertyPriority("border-top-style"), "important"); 33 is(style.getPropertyValue("border-style"), ""); 34 is(style.getPropertyPriority("border-style"), ""); 35 36 element.setAttribute("style", "border-top-style: dotted ! important; border-bottom-style: dotted ! important; border-left-style: dotted ! important"); 37 is(style.getPropertyValue("border-top-style"), "dotted"); 38 is(style.getPropertyPriority("border-top-style"), "important"); 39 is(style.getPropertyValue("border-style"), ""); 40 is(style.getPropertyPriority("border-style"), ""); 41 42 element.setAttribute("style", "border-top-style: dotted ! important; border-right-style: dotted; border-bottom-style: dotted ! important; border-left-style: dotted ! important"); 43 is(style.getPropertyValue("border-top-style"), "dotted"); 44 is(style.getPropertyPriority("border-top-style"), "important"); 45 is(style.getPropertyValue("border-right-style"), "dotted"); 46 is(style.getPropertyPriority("border-right-style"), ""); 47 is(style.getPropertyValue("border-style"), ""); 48 is(style.getPropertyPriority("border-style"), ""); 49 50 element.setAttribute("style", "border-top-style: dotted ! important; border-right-style: dotted ! important; border-bottom-style: dotted ! important; border-left-style: dotted ! important"); 51 is(style.getPropertyValue("border-top-style"), "dotted"); 52 is(style.getPropertyPriority("border-top-style"), "important"); 53 is(style.getPropertyValue("border-right-style"), "dotted"); 54 is(style.getPropertyPriority("border-right-style"), "important"); 55 isnot(style.getPropertyValue("border-style"), ""); 56 is(style.getPropertyPriority("border-style"), "important"); 57 58 // Also test that we check consistency of inherit and initial. 59 element.setAttribute("style", "border-top-style: dotted; border-right-style: dotted; border-bottom-style: dotted; border-left-style: dotted"); 60 isnot(style.getPropertyValue("border-style"), "", "serialize shorthand when all values not inherit/initial"); 61 element.setAttribute("style", "border-top-style: inherit; border-right-style: inherit; border-bottom-style: inherit; border-left-style: inherit"); 62 is(style.getPropertyValue("border-style"), "inherit", "serialize shorthand as inherit"); 63 element.setAttribute("style", "border-top-style: initial; border-right-style: initial; border-bottom-style: initial; border-left-style: initial"); 64 is(style.getPropertyValue("border-style"), "initial", "serialize shorthand as initial"); 65 element.setAttribute("style", "border-top-style: dotted; border-right-style: dotted; border-bottom-style: dotted; border-left-style: inherit"); 66 is(style.getPropertyValue("border-style"), "", "don't serialize shorthand when partly inherit"); 67 element.setAttribute("style", "border-top-style: initial; border-right-style: dotted; border-bottom-style: initial; border-left-style: initial"); 68 is(style.getPropertyValue("border-style"), "", "don't serialize shorthand when partly initial"); 69 70 </script> 71 </pre> 72 </body> 73 </html>