unmapped-attributes.html (3616B)
1 <!doctype html> 2 <meta charset=utf-8> 3 <title>Test handling of attributes that should not be mapped into style, but 4 incorrectly were in some browsers</title> 5 <script src=/resources/testharness.js></script> 6 <script src=/resources/testharnessreport.js></script> 7 <body> 8 <div id="container" style="display: none"></div> 9 <iframe></iframe> 10 <script> 11 /* 12 * We wand to test both quirks and standards mode. We can use the fact that 13 * our document is in standards mode and the about:blank iframe we have is in 14 * quirks mode. 15 */ 16 test(() => { 17 assert_equals(document.compatMode, "CSS1Compat") 18 }, "We should be in standards mode"); 19 const container = document.getElementById("container"); 20 21 const frameDoc = document.querySelector("iframe").contentDocument; 22 test(() => { 23 assert_equals(frameDoc.compatMode, "BackCompat") 24 }, "Subframe should be in quirks mode"); 25 const frameContainer = frameDoc.createElement("div"); 26 frameContainer.style.display = "none"; 27 frameDoc.body.appendChild(frameContainer); 28 29 function newElem(name) { 30 return (parent) => 31 parent.appendChild(parent.ownerDocument.createElement(name)); 32 } 33 34 /* 35 * Array of tests. Each test consists of the following information: 36 * 37 * 1) An element creation function, which takes a parent element as an 38 * argument. 39 * 2) The name of the attribute to set 40 * 3) The name of the CSS property to get. 41 */ 42 const tests = [ 43 [ newElem("table"), "hspace", "marginLeft" ], 44 [ newElem("table"), "hspace", "marginRight" ], 45 [ newElem("table"), "vspace", "marginTop" ], 46 [ newElem("table"), "vspace", "marginBottom" ], 47 [ newElem("embed"), "border", "borderTopWidth" ], 48 [ newElem("embed"), "border", "borderRightWidth" ], 49 [ newElem("embed"), "border", "borderBottomWidth" ], 50 [ newElem("embed"), "border", "borderLeftWidth" ], 51 [ newElem("iframe"), "border", "borderTopWidth" ], 52 [ newElem("iframe"), "border", "borderRightWidth" ], 53 [ newElem("iframe"), "border", "borderBottomWidth" ], 54 [ newElem("iframe"), "border", "borderLeftWidth" ], 55 [ newElem("iframe"), "hspace", "marginLeft" ], 56 [ newElem("iframe"), "hspace", "marginRight" ], 57 [ newElem("iframe"), "vspace", "marginTop" ], 58 [ newElem("iframe"), "vspace", "marginBottom" ], 59 [ newElem("marquee"), "border", "borderTopWidth" ], 60 [ newElem("marquee"), "border", "borderRightWidth" ], 61 [ newElem("marquee"), "border", "borderBottomWidth" ], 62 [ newElem("marquee"), "border", "borderLeftWidth" ], 63 // Non-image input 64 [ newElem("input"), "border", "borderTopWidth" ], 65 [ newElem("input"), "border", "borderRightWidth" ], 66 [ newElem("input"), "border", "borderBottomWidth" ], 67 [ newElem("input"), "border", "borderLeftWidth" ], 68 [ newElem("input"), "width", "width" ], 69 [ newElem("input"), "height", "height" ], 70 [ newElem("input"), "hspace", "marginLeft" ], 71 [ newElem("input"), "hspace", "marginRight" ], 72 [ newElem("input"), "vspace", "marginTop" ], 73 [ newElem("input"), "vspace", "marginBottom" ], 74 ]; 75 76 function style(element) { 77 return element.ownerDocument.defaultView.getComputedStyle(element); 78 } 79 80 for (let [ctor, attr, prop] of tests) { 81 for (let parent of [container, frameContainer]) { 82 let elem = ctor(parent); 83 test(function() { 84 let default_elem = ctor(parent); 85 this.add_cleanup(() => { 86 elem.remove(); 87 default_elem.remove(); 88 }); 89 elem.setAttribute(attr, "200"); 90 assert_equals(elem.getAttribute(attr), "200"); 91 assert_equals(style(elem)[prop], style(default_elem)[prop]); 92 }, `<${elem.localName} ${attr}> should not be mapped to style ${prop} in ${parent.ownerDocument.compatMode} mode`); 93 } 94 } 95 </script>