diff --git a/tests/wpt/mozilla/meta/MANIFEST.json b/tests/wpt/mozilla/meta/MANIFEST.json
index 4d0e9b89ac2..d9d08e602d6 100644
--- a/tests/wpt/mozilla/meta/MANIFEST.json
+++ b/tests/wpt/mozilla/meta/MANIFEST.json
@@ -6168,6 +6168,12 @@
             "url": "/_mozilla/css/animations/basic-transition.html"
           }
         ],
+        "css/animations/transition-raf.html": [
+          {
+            "path": "css/animations/transition-raf.html",
+            "url": "/_mozilla/css/animations/transition-raf.html"
+          }
+        ],
         "css/empty-keyframes.html": [
           {
             "path": "css/empty-keyframes.html",
diff --git a/tests/wpt/mozilla/tests/css/animations/transition-raf.html b/tests/wpt/mozilla/tests/css/animations/transition-raf.html
new file mode 100644
index 00000000000..6159bb9ab33
--- /dev/null
+++ b/tests/wpt/mozilla/tests/css/animations/transition-raf.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<meta charset="utf-8">
+<title></title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+#box {
+  width: 100px;
+  height: 200px;
+  background: red;
+  transition: width 1s linear;
+}
+
+#box.expose {
+  width: 200px;
+}
+</style>
+<div id="box"></div>
+<script>
+var box = document.getElementById('box');
+var test = new window.TestBinding();
+async_test(function(t) {
+  // Dummy RAF loop.
+  (function onFrame() {
+    var style = getComputedStyle(box).getPropertyValue('width');
+    if (style === '150px') {
+      t.done();
+    } else {
+      window.requestAnimationFrame(onFrame);
+    }
+  }());
+
+  window.addEventListener('load', function() {
+    assert_equals(getComputedStyle(box).getPropertyValue('width'), '100px');
+    box.className = "expose";
+    // Let the first restyle run at zero, then advance the clock.
+    setTimeout(function() { test.advanceClock(500, false) }, 0);
+  });
+}, "Transitions should work during RAF loop")
+</script>
