third_party/WebKit/LayoutTests/fast/scrolling/background-paint-composited-scrolled.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/run-after-layout-and-paint.js"></script>
   3 <style>
   4 #box, #box-unchanged {
   5   margin-left: 300px;
   6   width: 50px;
   7   height: 50px;
   8 }
   9 #box {
  10   margin-top: 150px;
  11   background-color: yellow;
  12 }
  13 #box-unchanged {
  14   background-color: blue;
  15 }
  16 #container {
  17   width: 500px;
  18   height: 500px;
  19   backface-visibility: hidden;
  20   overflow: scroll;
  21 }
  22 </style>
  23 Tests invalidation and painting of a box changing background while composited scrolled.
  24 <div id="container">
  25 <div id="box"></div>
  26 <div id="box-unchanged"></div>
  27 <div style="height: 4000px"></div>
  28 </div>
  29 <script>
  30
  31 if (window.testRunner) {
  32   testRunner.dumpAsTextWithPixelResults();
  33   testRunner.waitUntilDone();
  34 }
  35
  36 runAfterLayoutAndPaint(function() {
  37   var container = document.querySelector('#container');
  38   var box = document.querySelector("#box");
  39   container.scrollTop = 400;
  40   box.style.backgroundColor = "green";
  41   runAfterLayoutAndPaint(function() {
  42     container.scrollTop = 0;
  43     if (window.testRunner)
  44       testRunner.notifyDone();
  45   });
  46 });
  47
  48 </script>