| OLD | NEW | 
| (Empty) |  | 
 |   1 <!DOCTYPE html> | 
 |   2 <html> | 
 |   3 <head> | 
 |   4   <style> | 
 |   5     #container { | 
 |   6       will-change: contents; | 
 |   7       position: absolute; | 
 |   8       z-index: 0; | 
 |   9       left: 200px; | 
 |  10       top: 100px; | 
 |  11       width: 100px; | 
 |  12       height: 100px; | 
 |  13       background-color: blue; | 
 |  14     } | 
 |  15  | 
 |  16     #willChangeOpacity { | 
 |  17       position: absolute; | 
 |  18       left: 50px; | 
 |  19       top: 50px; | 
 |  20       width: 75px; | 
 |  21       height: 75px; | 
 |  22       background-color: green; | 
 |  23       will-change: opacity; | 
 |  24     } | 
 |  25   </style> | 
 |  26   <script type="text/javascript"> | 
 |  27     if (window.internals) { | 
 |  28       window.internals.settings.setAcceleratedCompositingForGpuRasterizationHint
    Enabled(true); | 
 |  29       // Force an update of the compositing triggers. | 
 |  30       window.internals.forceCompositingUpdate(document); | 
 |  31     } | 
 |  32  | 
 |  33     function doTest() | 
 |  34     { | 
 |  35       if (window.internals) { | 
 |  36         window.internals.forceCompositingUpdate(document); | 
 |  37       } | 
 |  38       // Removing "will-change: contents" from the container div should | 
 |  39       // allow its child to composite. | 
 |  40       document.getElementById("container").style.willChange = "top"; | 
 |  41       if (window.testRunner) { | 
 |  42         document.getElementById("layertree").innerText = window.internals.layerT
    reeAsText(document); | 
 |  43         testRunner.dumpAsText(); | 
 |  44       } | 
 |  45     } | 
 |  46  | 
 |  47     window.addEventListener('load', doTest, false); | 
 |  48   </script> | 
 |  49 </head> | 
 |  50  | 
 |  51 <body> | 
 |  52   <div id="container"> | 
 |  53     <div id="willChangeOpacity"></div> | 
 |  54   </div> | 
 |  55  | 
 |  56   <pre id="layertree"></pre> | 
 |  57 </body> | 
 |  58  | 
 |  59 </html> | 
| OLD | NEW |