scrolling-neg-z-index-descendants.html

<!DOCTYPE HTML>
<script src="../resources/text-based-repaint.js"></script>
<script>
if (window.internals)
  internals.settings.setPreferCompositingToLCDTextEnabled(false);

function repaintTest() {
  container.scrollTop = 100;
}

onload = runRepaintAndPixelTest;
</script>
<style>
::-webkit-scrollbar {
  width: 0;
  height: 0;
}

#container {
  width: 100px;
  height: 300px;
  border: 1px black solid;
  overflow: scroll;
  position: relative;
  backface-visibility: hidden;
}

#neg-z {
  position: relative;
  z-index: -1;
}

.scrolled {
  width: 50px;
  height: 50px;
  margin: 10px;
  position: relative;
  background-color: green;
}
</style>
<div id="container">
  <div id="neg-z">
    <div class="scrolled">1</div>
    <div class="scrolled">2</div>
    <div class="scrolled">3</div>
    <div class="scrolled">4</div>
    <div class="scrolled">5</div>
    <div class="scrolled">6</div>
    <div class="scrolled">7</div>
  </div>
</div>

chromium/third_party/blink/web_tests/paint/invalidation/compositing/scrolling-neg-z-index-descendants.html