Bug 1315874 - Add test that SMIL does not trigger CSS Transitions; r=dbaron
authorMantaroh Yoshinaga <mantaroh@gmail.com>
Mon, 16 Jan 2017 14:07:39 +0900
changeset 351510 09d2b2c67b7fe274ab094d7b623ec19e544959b1
parent 351509 ca8440c0eeb360d1eaa6b5bbad829bd1646adb35
child 351511 1f233c0466f62f140f03b68fca7714f216baa63b
push id31611
push usercbook@mozilla.com
push dateThu, 06 Apr 2017 10:51:05 +0000
treeherdermozilla-central@950612071c4e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdbaron
bugs1315874
milestone55.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1315874 - Add test that SMIL does not trigger CSS Transitions; r=dbaron MozReview-Commit-ID: D8zZTFkoY6p
dom/smil/test/mochitest.ini
dom/smil/test/test_smilWithTransition.html
--- a/dom/smil/test/mochitest.ini
+++ b/dom/smil/test/mochitest.ini
@@ -52,10 +52,11 @@ skip-if = toolkit == 'android' #TIMED_OU
 [test_smilSyncTransform.xhtml]
 [test_smilSyncbaseTarget.xhtml]
 [test_smilTextZoom.xhtml]
 [test_smilTimeEvents.xhtml]
 [test_smilTiming.xhtml]
 [test_smilTimingZeroIntervals.xhtml]
 [test_smilUpdatedInterval.xhtml]
 [test_smilValues.xhtml]
+[test_smilWithTransition.html]
 [test_smilWithXlink.xhtml]
 [test_smilXHR.xhtml]
new file mode 100644
--- /dev/null
+++ b/dom/smil/test/test_smilWithTransition.html
@@ -0,0 +1,72 @@
+<!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>
+  <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+</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>
+<pre id="test">
+<script  type="text/javascript">
+  SimpleTest.waitForExplicitFinish();
+  window.addEventListener('load', runTests, false);
+
+  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);
+      ok(getComputedStyle(rect).fill, 'rgb(0, 255, 0)',
+         'The end color should be lime.');
+
+      return waitForAnimationFrames(2);
+    }).then(function() {
+      var anim = document.getAnimations()[0];
+      todo(!anim, 'Transition should not be created by restyling for SMIL');
+      SimpleTest.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>