third_party/WebKit/LayoutTests/compositing/squashing/invalidate-on-grouped-mapping-reorder.html

   1 <!DOCTYPE html>
   2 <script>
   3 // Two frames are required in order to set up the squashing, for some reason.
   4 onload = requestAnimationFrame(function() {
   5   debugger;
   6     requestAnimationFrame(function() {
   7         document.getElementById('badlayer').style.zIndex = "1"
   8         if (window.testRunner)
   9             window.testRunner.notifyDone();
  10     });
  11 });
  12
  13 if (window.testRunner)
  14     window.testRunner.waitUntilDone();
  15
  16 </script>
  17 <!-- Tests an obscure invalidaiton situation in which changing the z-index of a element results in a reshuffle of squashed content,
  18      yet avoiding many of the invalidation paths to update the contents correctly. -->
  19 <div style="float:right;position:relative;z-index:3">
  20   This test is broken if this text shows up twice
  21 </div>
  22 <div style="width: 0">
  23   <div style="height:220px;position:relative" id="badlayer">
  24     <div style="transform: translate3d(325px, 0px, 0px);">
  25     </div>
  26   </div>
  27   <div style="height:220px;position:relative">
  28     <div style="position: absolute; top: 0px; left: 0px; width:10px;height:10px; transform: translate3d(1px, 1px, 1px); background: lightgray"></div>
  29     <div style="position: absolute; top: 0px; left: 0px; background: lightblue; width:10px;height:10px;" ></div>
  30   </div>
  31   a
  32 </div>
  33 <br>
  34 <div style="position:relative; height: 500px;">
  35 </div>