| <!DOCTYPE html> |
| <script src="../../resources/testharness.js"></script> |
| <style> |
| .scale-transform { |
| transform: scale(0.75); |
| } |
| .translate-transform { |
| transform: translateX(5px); |
| } |
| </style> |
| <div style="will-change: transform; width: 200px; height: 200px; background: lightgray;"></div> |
| <div class="scale-transform" style="position: absolute; width: 200px; height: 200px; top: 100px; left: 100px; background: lightblue"></div> |
| <div class="translate-transform" style="position: absolute; width: 200px; height: 200px; top: 100px; left: 100px; background: lightblue"></div> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| onload = function() { |
| if (window.internals) { |
| var layers = JSON.parse(internals.layerTreeAsText(document, internals.LAYER_TREE_INCLUDES_DEBUG_INFO))["layers"]; |
| |
| // The scale-transform layer can't be squashed |
| assert_true(layers[3].compositingReasons[1] == "Layer was separately composited because it could not be squashed."); |
| assert_true(layers[3].squashingDisallowedReasons[0] == "Cannot squash layers with transforms that are not identity or translation."); |
| |
| // ...but the translate-transform one can. |
| assert_true(layers[4].compositingReasons[0] == "Secondary layer, home for a group of squashable content"); |
| } |
| }; |
| </script> |