third_party/WebKit/LayoutTests/fast/repaint/fixed-under-composited-absolute-scrolled.html

   1 <!DOCTYPE html>
   2 <script src="resources/text-based-repaint.js"></script>
   3 <script>
   4 function repaintTest() {
   5   document.getElementById('fixed').style.height = '200px';
   6 }
   7 onload = function() {
   8   // Scroll before repaint test to test correct scroll offset of invalidation rect
   9   // for fixed-position element when it needs repaint.
  10   window.scrollTo(0, 400);
  11   runRepaintTest();
  12 };
  13 </script>
  14 <style>
  15 #indicator {
  16   position: absolute;
  17   height: 200px;
  18   width: 100px;
  19   top: 400px;
  20   left: 0;
  21   background-color: red;
  22 }
  23 #absolute {
  24   position: absolute;
  25   top: 2000px;
  26   width: 1px;
  27   height: 1px;
  28   background-color: red;
  29   backface-visibility: hidden;
  30   z-index: 1000;
  31 }
  32 #fixed {
  33   position: fixed;
  34   top: 0;
  35   left: 0;
  36   width: 100px;
  37   height: 100px;
  38   background-color: green;
  39 }
  40 </style>
  41 Tests paint invalidation of fixed element under a composited absolute element on resize after scrolled.
  42 Passes if there is a 100x200 green rectangle and no red.
  43 <div id="indicator"></div>
  44 <div id="absolute">
  45   <div id="fixed">
  46   </div>
  47 </div>