The Tor Browser / file comparison
comparison: layout/base/tests/chrome/test_will_change.html
layout/base/tests/chrome/test_will_change.html
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:cd448bdeebad |
|---|---|
| 1 <!DOCTYPE HTML> | |
| 2 <html> | |
| 3 <head> | |
| 4 <title>Tests for MozAfterPaint</title> | |
| 5 <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> | |
| 6 <script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/paint_listener.js"></script> | |
| 7 <!-- This CSS must not be parsed before we get a change to set layout.css.will-change.enabled=true --> | |
| 8 <script type="css_but_do_not_parse" id="csscode"> | |
| 9 #checkOpacityRepaint { | |
| 10 will-change: opacity; | |
| 11 } | |
| 12 #checkTransformRepaint { | |
| 13 will-change: transform; | |
| 14 } | |
| 15 div { | |
| 16 width: 100px; | |
| 17 height: 100px; | |
| 18 background: radial-gradient(ellipse at center, #87e0fd 0%,#53cbf1 40%,#05abe0 100%); | |
| 19 } | |
| 20 </script> | |
| 21 </head> | |
| 22 <body> | |
| 23 <div id="checkRepaint"> | |
| 24 Check repaint without will-change | |
| 25 </div> | |
| 26 <div id="checkOpacityRepaint"> | |
| 27 Check repaint with will-change | |
| 28 </div> | |
| 29 <div id="checkTransformRepaint"> | |
| 30 Check repaint with will-change | |
| 31 </div> | |
| 32 </body> | |
| 33 <script> | |
| 34 | |
| 35 var utils = window.QueryInterface(Components.interfaces.nsIInterfaceRequestor). | |
| 36 getInterface(Components.interfaces.nsIDOMWindowUtils); | |
| 37 | |
| 38 var initialPaintCount = 0; | |
| 39 | |
| 40 function test_checkRepaint(next) { | |
| 41 var element = document.getElementById("checkRepaint"); | |
| 42 waitForAllPaintsFlushed(function () { | |
| 43 utils.checkAndClearPaintedState(element); | |
| 44 element.style.opacity = "0.5"; | |
| 45 waitForAllPaintsFlushed(function () { | |
| 46 var painted = utils.checkAndClearPaintedState(element); | |
| 47 // *** We check that this repaints because the test is relying | |
| 48 // on this property. If this is broken then this test wont | |
| 49 // be reliable check for will-change. | |
| 50 is(painted, true, "element should have been painted"); | |
| 51 next(); | |
| 52 }); | |
| 53 }); | |
| 54 } | |
| 55 | |
| 56 function test_checkOpacityRepaint(next) { | |
| 57 var element = document.getElementById("checkOpacityRepaint"); | |
| 58 waitForAllPaintsFlushed(function () { | |
| 59 utils.checkAndClearPaintedState(element); | |
| 60 element.style.opacity = "0.5"; | |
| 61 waitForAllPaintsFlushed(function () { | |
| 62 var painted = utils.checkAndClearPaintedState(element); | |
| 63 // BasicLayers' heuristics are so that even with will-change:opacity, | |
| 64 // we can still have repaints. | |
| 65 if (utils.layerManagerType != "Basic") { | |
| 66 is(painted, false, "will-change checkOpacityRepaint element should not have been painted"); | |
| 67 } | |
| 68 next(); | |
| 69 }); | |
| 70 }); | |
| 71 } | |
| 72 | |
| 73 function test_checkTransformRepaint(next) { | |
| 74 var element = document.getElementById("checkTransformRepaint"); | |
| 75 waitForAllPaintsFlushed(function () { | |
| 76 utils.checkAndClearPaintedState(element); | |
| 77 element.style.transform = "translateY(-5px)"; | |
| 78 waitForAllPaintsFlushed(function () { | |
| 79 var painted = utils.checkAndClearPaintedState(element); | |
| 80 // BasicLayers' heuristics are so that even with will-change:transform, | |
| 81 // we can still have repaints. | |
| 82 if (utils.layerManagerType != "Basic") { | |
| 83 is(painted, false, "will-change checkTransformRepaint element should not have been painted"); | |
| 84 } | |
| 85 next(); | |
| 86 }); | |
| 87 }); | |
| 88 } | |
| 89 | |
| 90 function runTest() { | |
| 91 var csscode = document.getElementById("csscode").firstChild.textContent; | |
| 92 var style = document.createElement("style"); | |
| 93 style.textContent = csscode; | |
| 94 document.body.appendChild(style); | |
| 95 test_checkRepaint(function(){ | |
| 96 test_checkOpacityRepaint(function(){ | |
| 97 test_checkTransformRepaint(function(){ | |
| 98 SimpleTest.finish(); | |
| 99 }); | |
| 100 }); | |
| 101 }); | |
| 102 } | |
| 103 | |
| 104 SimpleTest.waitForExplicitFinish(); | |
| 105 SpecialPowers.pushPrefEnv({ "set": [["layout.css.will-change.enabled", true]] }, runTest); | |
| 106 | |
| 107 </script> | |
| 108 </html> |
