Bug 1244641 - Part 5: Add duration tests in layout/style/test. r=hiro

MozReview-Commit-ID: JrsLXlvjJa8 --HG-- extra : transplant_source : H%24%12%FF%01%40%97%02%23ym%88%C2%C6%08T%ACB%20%91
2016-02-27 06:41:40 +09:00 · 2016-02-27 06:41:40 +09:00 · 35966647ca
--- a/layout/style/test/file_animations_effect_timing_duration.html
+++ b/layout/style/test/file_animations_effect_timing_duration.html
@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <script type="application/javascript"
+    src="/tests/SimpleTest/paint_listener.js"></script>
+  <script type="application/javascript" src="animation_utils.js"></script>
+  <style type="text/css">
+    @keyframes anim {
+      0% { transform: translate(0px) }
+      100% { transform: translate(100px) }
+    }
+    .target {
+      /* The animation target needs geometry in order to qualify for OMTA */
+      width: 100px;
+      height: 100px;
+      background-color: white;
+    }
+  </style>
+  <script>
+    var ok = opener.ok.bind(opener);
+    var is = opener.is.bind(opener);
+    var todo = opener.todo.bind(opener);
+    function finish() {
+      var o = opener;
+      self.close();
+      o.SimpleTest.finish();
+    }
+  </script>
+</head>
+<body>
+<div id="display"></div>
+<script type="application/javascript">
+"use strict";
+
+runOMTATest(function() {
+  runAllAsyncAnimTests().then(function() {
+    finish();
+  });
+}, finish, opener.SpecialPowers);
+
+addAsyncAnimTest(function *() {
+  var [ div ] = new_div("");
+  var animation = div.animate(
+    [ { transform: 'translate(0px)', easing: "steps(2, start)" },
+      { transform: 'translate(100px)' } ], 4000);
+  yield waitForPaints();
+
+  advance_clock(500);
+  omta_is(div, "transform", { tx: 50 }, RunningOn.Compositor,
+          "Animation is running on compositor");
+  animation.effect.timing.duration = 2000;
+
+  yield waitForPaints();
+  omta_is(div, "transform", { tx: 50 }, RunningOn.Compositor,
+          "Animation remains on compositor");
+
+  advance_clock(1000);
+  omta_is(div, "transform", { tx: 100 }, RunningOn.Compositor,
+          "Animation is updated on compositor");
+
+  done_div();
+});
+
+addAsyncAnimTest(function *() {
+  var [ div ] = new_div("");
+  var animation = div.animate(
+    [ { transform: 'translate(0px)', easing: "steps(2, end)" },
+      { transform: 'translate(100px)' } ], 4000);
+  yield waitForPaints();
+
+  advance_clock(1000);
+  animation.effect.timing.duration = 2000;
+  advance_clock(0);
+  yield waitForPaints();
+  omta_is(div, "transform", { tx: 50 }, RunningOn.Compositor,
+          "Animation is running on compositor");
+  done_div();
+})
+
+
+</script>
+</body>
+</html>
--- a/layout/style/test/mochitest.ini
+++ b/layout/style/test/mochitest.ini
@ -42,6 +42,8 @@ skip-if = toolkit == 'android'
 [test_animations_async_tests.html]
 support-files = ../../reftests/fonts/Ahem.ttf file_animations_async_tests.html
 [test_animations_dynamic_changes.html]
+[test_animations_effect_timing_duration.html]
+support-files = file_animations_effect_timing_duration.html
 [test_animations_event_order.html]
 [test_animations_omta.html]
 [test_animations_omta_start.html]
--- a/layout/style/test/test_animations_effect_timing_duration.html
+++ b/layout/style/test/test_animations_effect_timing_duration.html
@ -0,0 +1,24 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <title>Test for animation.effect.timing on compositor</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+</head>
+<body>
+<div id="display"></div>
+<pre id="test">
+<script type="application/javascript">
+"use strict";
+
+SimpleTest.waitForExplicitFinish();
+
+SpecialPowers.pushPrefEnv(
+  { "set": [[ "dom.animations-api.core.enabled", true]] },
+  function() {
+    window.open("file_animations_effect_timing_duration.html");
+  });
+</script>
+</pre>
+</body>
+</html>