Bug 1315874 - Add test that SMIL does not trigger CSS Transitions; r=dbaron
MozReview-Commit-ID: D8zZTFkoY6p
--- 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>