1 files changed, 39 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/CSS2/stacking-context/composite-change-after-scroll-preserves-stacking-order.html b/testing/web-platform/tests/css/CSS2/stacking-context/composite-change-after-scroll-preserves-stacking-order.html
new file mode 100644
index 0000000000..1abf6f292e
--- /dev/null
+++ b/testing/web-platform/tests/css/CSS2/stacking-context/composite-change-after-scroll-preserves-stacking-order.html
@@ -0,0 +1,39 @@
+<!doctype HTML>
+<link rel="author" title="Chris Harrelson" href="chrishtr@chromium.org">
+<link rel="match" href="composite-change-after-scroll-preserves-stacking-order-ref.html">
+<link rel="help" href="https://www.w3.org/TR/CSS2/zindex.html"/>
+<script src="/common/reftest-wait.js"></script>
+<script src="/web-animations/testcommon.js"></script>
+<style>
+    #one, #two {
+        width: 200px; height: 200px; background: lightblue; position: relative
+    }
+    #one {
+        background: lightblue
+    }
+    #two {
+        background: lightgray;
+        margin-top: -200px;
+    }
+</style>
+<html class=reftest-wait>
+  <div id=scroller style="overflow: scroll; width: 300px; height: 300px; will-change: transform">
+    <div id=one></div>
+    <div id=two></div>
+    <div id=spacer style="width: 50px; height: 5000px"></div>
+  </div>
+</html>
+<script>
+  onload = () => {
+    waitForAnimationFrames(2).then(() => {
+      scroller.scrollBy(0, 1000);
+      waitForAnimationFrames(2).then(() => {
+        one.style = 'will-change: transform';
+        waitForAnimationFrames(2).then(() => {
+          scroller.scrollBy(0, -1000);
+          takeScreenshot();
+        });
+      });
+    });
+  };
+</script>