OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <style> |
| 3 #none { contain: none; } |
| 4 #style { contain: style; } |
| 5 #layout { contain: layout; } |
| 6 #paint { contain: paint; } |
| 7 #strict { contain: strict; } |
| 8 </style> |
| 9 <body> |
| 10 <div id="none"><div></div></div> |
| 11 <div id="style"><div></div></div> |
| 12 <div id="layout"><div></div></div> |
| 13 <div id="paint"><div></div></div> |
| 14 <div id="strict"><div></div></div> |
| 15 <div id="test"></div> |
| 16 <script src="../../../resources/js-test.js"></script> |
| 17 <script> |
| 18 function computedContainValue(element) { |
| 19 return window.getComputedStyle(element).contain; |
| 20 } |
| 21 function getContainValue(query) |
| 22 { |
| 23 var element = document.querySelector(query); |
| 24 return computedContainValue(element); |
| 25 } |
| 26 |
| 27 shouldBeEqualToString("getContainValue('#none')", "none"); |
| 28 shouldBeEqualToString("getContainValue('#style')", "style"); |
| 29 shouldBeEqualToString("getContainValue('#layout')", "layout"); |
| 30 shouldBeEqualToString("getContainValue('#paint')", "paint"); |
| 31 shouldBeEqualToString("getContainValue('#strict')", "strict"); |
| 32 |
| 33 var children = document.querySelectorAll("div > div"); |
| 34 for (var i = 0; i < children.length; i++) { |
| 35 shouldBeEqualToString("computedContainValue(children[i])", "none"); |
| 36 } |
| 37 |
| 38 var test = document.querySelector('#test'); |
| 39 |
| 40 test.style.setProperty("contain", "layout paint style"); |
| 41 shouldBeEqualToString("getContainValue('#test')", "strict"); |
| 42 |
| 43 test.style.setProperty("contain", "layout paint"); |
| 44 shouldBeEqualToString("getContainValue('#test')", "layout paint"); |
| 45 |
| 46 test.style.setProperty("contain", "strict"); |
| 47 shouldBeEqualToString("getContainValue('#test')", "strict"); |
| 48 |
| 49 test.style.setProperty("contain", "none"); |
| 50 shouldBeEqualToString("getContainValue('#test')", "none"); |
| 51 |
| 52 test.style.setProperty("contain", "layout layout"); |
| 53 shouldBeEqualToString("getContainValue('#test')", "none"); |
| 54 |
| 55 test.style.setProperty("contain", "strict layout"); |
| 56 shouldBeEqualToString("getContainValue('#test')", "none"); |
| 57 |
| 58 test.style.setProperty("contain", "paint strict"); |
| 59 shouldBeEqualToString("getContainValue('#test')", "none"); |
| 60 |
| 61 test.style.setProperty("contain", "paint layout style paint"); |
| 62 shouldBeEqualToString("getContainValue('#test')", "none"); |
| 63 |
| 64 test.style.setProperty("contain", "style paint"); |
| 65 shouldBeEqualToString("getContainValue('#test')", "style paint"); |
| 66 |
| 67 test.style.setProperty("contain", "none strict"); |
| 68 shouldBeEqualToString("getContainValue('#test')", "style paint"); |
| 69 |
| 70 test.style.setProperty("contain", "strict strict"); |
| 71 shouldBeEqualToString("getContainValue('#test')", "style paint"); |
| 72 |
| 73 test.style.setProperty("contain", "strict none"); |
| 74 shouldBeEqualToString("getContainValue('#test')", "style paint"); |
| 75 </script> |
OLD | NEW |