src/third_party/WebKit/LayoutTests/compositing/squashing/repaint-squashed-layer-in-rect.html

   1 <!doctype html>
   2 <div style="height: 800px; width: 800px; background-color: lightgray; transform:translateZ(0)">
   3 </div>
   4 <div style="position:absolute; top: 0px; height: 200px; width: 200px">
   5 </div>
   6 <div style="position:absolute; top: 400px; left: 400px; height: 200px; width: 200px; background-color: lightblue">
   7   <div id="imgElement" style="height: 200px; width: 200px; background-color: lightblue">
   8   </div>
   9 </div>
  10 <script src="../../fast/repaint/resources/text-based-repaint.js"></script>
  11 <script>
  12 // Test that a repaint for the rect containing the changed background image is issued in the coordinate space of the
  13 // squashing layer, *not* local to the div with the background image on it.
  14
  15 if (window.internals)
  16     internals.settings.setLayerSquashingEnabled(true);
  17
  18 function repaintTest() {
  19     var imgElement = document.querySelector("#imgElement");
  20     imgElement.style.backgroundImage = "url('data:image/gif;base64,R0lGODdhAgACAIABAAAAAP///ywAAAAAAgACAAACA0QCBQA7')";
  21 }
  22 runRepaintTest();
  23 </script>