1 files changed, 30 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-backgrounds/background-image-none-gradient-repaint.html b/testing/web-platform/tests/css/css-backgrounds/background-image-none-gradient-repaint.html
new file mode 100644
index 0000000000..1ddca5e21d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-backgrounds/background-image-none-gradient-repaint.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>CSS Backgrounds and Borders: Repaint gradient change in second layer</title>
+<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
+<link rel="match" href="background-clip-color-repaint-ref.html">
+<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#layering">
+<meta name="fuzzy" content="maxDifference=0-1; totalPixels=0-9693" />
+<style>
+  #box {
+    width: 150px;
+    height: 150px;
+  }
+  .red {
+    background: none, linear-gradient(to right, red, red);
+  }
+  .green {
+    background: none, linear-gradient(to right, green, green);
+  }
+</style>
+<p>There should be a green square below.</p>
+<div id="box" class="red"></div>
+<script>
+  requestAnimationFrame(function(){
+    requestAnimationFrame(function(){
+      box.className = "green";
+      document.documentElement.classList.remove("reftest-wait");
+    });
+  });
+</script>