1. Modify LayoutTests/fast/scrolling/background-paint-composited-scrolled.html by replacing runAfterLayoutAndPaint to testRunner.capturePixelsAsyncThen():

testRunner.capturePixelsAsyncThen(function() {
  var container = document.querySelector('#container');
  var box = document.querySelector("#box");
  container.scrollTop = 400;
  box.style.backgroundColor = "green";
  testRunner.capturePixelsAsyncThen(function() {
    container.scrollTop = 0;
    if (window.testRunner)
      testRunner.notifyDone();
  });
});

2. Run the test: run-layout-tests fast/scrolling/background-paint-composited-scrolled.html

The test fails because the final captured image (the one captured by test_runner at the end of the test) is the image when container.scrollTop was 400, not the final state.

If add another capturePixelsAsyncThen:

testRunner.capturePixelsAsyncThen(function() {
  var container = document.querySelector('#container');
  var box = document.querySelector("#box");
  container.scrollTop = 400;
  box.style.backgroundColor = "green";
  testRunner.capturePixelsAsyncThen(function() {
    container.scrollTop = 0;
    testRunner.capturePixelsAsyncThen(function() {
      testRunner.notifyDone();
    });
  });
});

The test still fails but the captured image is weird: the contents are in correct final status, but the scrollbar is still in status when container.scrollTop was 400.

Checked display items at blink side and they all seem correct.

The test passes with threaded-compositing enabled, which might indicate that we have some synchronization issues about composited scrolling in single-threaded compositing mode.