1 files changed, 79 insertions, 0 deletions
diff --git a/dom/smil/test/file_smilWithTransition.html b/dom/smil/test/file_smilWithTransition.html
new file mode 100644
index 0000000000..b91398436b
--- /dev/null
+++ b/dom/smil/test/file_smilWithTransition.html
@@ -0,0 +1,79 @@
+<!doctype html>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1315874
+-->
+<head>
+  <meta charset="utf-8">
+  <title>Test SMIL does not trigger CSS Transitions (bug 1315874)</title>
+</head>
+<body>
+<a target="_blank"
+  href="https://bugzilla.mozilla.org/show_bug.cgi?id=1315874">Mozilla Bug
+  1315874</a>
+<svg>
+  <rect width="100%" height="100%"
+        style="fill: red; transition: fill 10s" id="rect">
+    <animate attributeName="fill" to="lime" dur="1s" fill="freeze">
+  </rect>
+</svg>
+<script  type="text/javascript">
+  // Bring SimpleTest's function from opener.
+  if (opener) {
+    var is = opener.is.bind(opener);
+    var ok = opener.ok.bind(opener);
+    function finish() {
+      var o = opener;
+      self.close();
+      o.SimpleTest.finish();
+    }
+  }
+
+  window.addEventListener('load', runTests);
+
+  var rect = document.getElementById('rect');
+  var svg = document.getElementsByTagName('svg')[0];
+  is(getComputedStyle(rect).fill, 'rgb(255, 0, 0)',
+     'The initial color should be red.');
+
+  function runTests() {
+    waitForFrame().then(function() {
+      svg.setCurrentTime(1);
+      is(getComputedStyle(rect).fill, 'rgb(0, 255, 0)',
+         'The end color should be lime.');
+
+      return waitForAnimationFrames(2);
+    }).then(function() {
+      var anim = document.getAnimations()[0];
+      ok(!anim, 'Transition should not be created by restyling for SMIL');
+      finish();
+    });
+  }
+
+  // Utility methods from testcommon.js
+  // For detail, see dom/animation/test/testcommon.js.
+
+  function waitForFrame() {
+    return new Promise(function(resolve, reject) {
+      requestAnimationFrame(function(time) {
+        resolve();
+      });
+    });
+  }
+
+  function waitForAnimationFrames(frameCount) {
+    return new Promise(function(resolve, reject) {
+      function handleFrame() {
+        if (--frameCount <= 0) {
+          resolve();
+        } else {
+          window.requestAnimationFrame(handleFrame);
+        }
+      }
+      window.requestAnimationFrame(handleFrame);
+    });
+  }
+</script>
+</pre>
+</body>
+</html>