raster-under-invalidation-checking.html

<!DOCTYPE html>
<script src="../../resources/run-after-layout-and-paint.js"></script>
<script src="resources/text-based-repaint.js"></script>
<style>
[id^="target"] {
  width: 60px;
  height: 40px;
  margin: 10px;
  background: blue;
  border: 1px solid blue;
  box-sizing: border-box;
}
</style>
<div id="target1"></div>
<div id="target2" style="will-change: transform"></div>
<div style="will-change: transform; width: 150px; height: 150px; background: yellow">
  <div id="target3" style="position: relative; top: 70px; left: 30px"></div>
</div>
<div id="scroller" style="will-change: transform; width: 150px; height: 150px; overflow: scroll">
  <div style="width: 4000px; height: 20000px"></div>
  <div id="target4" style="position: relative; top: -10000px; left: 30px"></div>
</div>
<script>
window.testIsAsync = true;

function repaintTest() {
  if (window.internals)
    internals.simulateRasterUnderInvalidations(true);
  document.querySelectorAll('[id^="target"]').forEach(function(e) {
    e.style.background = 'green';
    e.style.borderColor = 'green';
  });
  runAfterLayoutAndPaint(function() {
    if (window.internals)
      internals.simulateRasterUnderInvalidations(false);
    finishRepaintTest();
  });
};

onload = function() {
	scroller.scrollTop = 9950;
	scroller.scrollLeft = 50;
  runRepaintAndPixelTest();
}
</script>
chromium/third_party/blink/web_tests/paint/invalidation/raster-under-invalidation-checking.html
