1 files changed, 24 insertions, 0 deletions
diff --git a/layout/reftests/css-animations/background-position-after-finish.html b/layout/reftests/css-animations/background-position-after-finish.html
new file mode 100644
index 0000000000..ac9bdfbd46
--- /dev/null
+++ b/layout/reftests/css-animations/background-position-after-finish.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<title>background-position-x animation after finish</title>
+<style>
+@keyframes holdBackgroundPosition {
+  from,to { background-position-x: 100%; }
+}
+#test {
+  height: 100px;
+  width: 100px;
+  background-repeat: no-repeat;
+  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAMAAADzN3VRAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF/wAAAAAAQaMSAwAAABJJREFUeNpiYBgFo2AwAIAAAwACigABtnCV2AAAAABJRU5ErkJggg==); /* a 25x25 px red box */
+  animation: holdBackgroundPosition 0.01s;
+  background-position-x: 50%;
+}
+</style>
+<div id="test" class="reftest-opaque-layer"></div>
+<script>
+document.getElementById("test").addEventListener("animationend", () => {
+  requestAnimationFrame(() => {
+    document.documentElement.classList.remove("reftest-wait");
+  })
+});
+</script>