composited-overlay-scrollbars-scrollbar-color-repaint.html

<!DOCTYPE HTML>
<html>
<head>
  <script src="../resources/text-based-repaint.js"></script>
  <script>
    if (window.internals) {
      internals.settings.setPreferCompositingToLCDTextEnabled(true);
      internals.useMockOverlayScrollbars();
    }

    function repaintTest() {
      const outer = document.getElementById('outer');
      const inner = document.getElementById('inner');
      outer.scrollTop = outer.scrollHeight - outer.clientHeight;
      inner.scrollTop = inner.scrollHeight - inner.clientHeight;
      document.documentElement.style.scrollbarColor = 'blue yellow';
    }

    window.addEventListener("load", runRepaintAndPixelTest);
  </script>
  <style media="screen">
    html, body { margin: 0; padding: 0; }
    html { scrollbar-color: red black }
    #outer {
      width: 400px;
      height: 300px;
      overflow-y: scroll;
      border: 1px solid green;
    }
    #inner {
      width: 100px;
      height: 100px;
      overflow-y: scroll;
      border: 1px solid blue;
    }
    .strut { height: 500px; }
  </style>
</head>
<body>
<div id="outer">
  <div class="strut"></div>
  <div id="inner">
    <div class="strut"></div>
  </div>
</div>
</body>
</html>

chromium/third_party/blink/web_tests/paint/invalidation/compositing/composited-overlay-scrollbars-scrollbar-color-repaint.html