Bug 1468475 - Part 3. Add negative current time tests. r?daisuke draft
authorMantaroh Yoshinaga <mantaroh@gmail.com>
Thu, 12 Jul 2018 09:30:08 +0900
changeset 817099 84e864d78595224baa54e5c511da926e149c88a3
parent 817098 af3f2430a563aaab14319ae5acba391aed145641
push id115953
push userbmo:mantaroh@gmail.com
push dateThu, 12 Jul 2018 00:30:42 +0000
reviewersdaisuke
bugs1468475
milestone63.0a1
Bug 1468475 - Part 3. Add negative current time tests. r?daisuke This patch will add tests which is related with negative current time. * Rewind the animations which has negative delay. * Replay the animations which has negative delay. * Inspect the negative current time animation. MozReview-Commit-ID: JACPqc19FpZ
devtools/client/inspector/animation/test/browser.ini
devtools/client/inspector/animation/test/browser_animation_current-time-scrubber-with-negative-delay.js
devtools/client/inspector/animation/test/browser_animation_pause-resume-button_end-time.js
devtools/client/inspector/animation/test/browser_animation_rewind-button.js
devtools/client/inspector/animation/test/head.js
--- a/devtools/client/inspector/animation/test/browser.ini
+++ b/devtools/client/inspector/animation/test/browser.ini
@@ -38,16 +38,17 @@ support-files =
 [browser_animation_animation-target_highlight.js]
 [browser_animation_animation-target_select.js]
 [browser_animation_animation-timeline-tick.js]
 [browser_animation_css-transition-with-playstate-idle.js]
 [browser_animation_current-time-label.js]
 [browser_animation_current-time-scrubber.js]
 [browser_animation_current-time-scrubber-rtl.js]
 [browser_animation_current-time-scrubber_each-different-creation-time-animations.js]
+[browser_animation_current-time-scrubber-with-negative-delay.js]
 [browser_animation_empty_on_invalid_nodes.js]
 [browser_animation_indication-bar.js]
 [browser_animation_infinity-duration_current-time-scrubber.js]
 [browser_animation_infinity-duration_summary-graph.js]
 [browser_animation_infinity-duration_tick-label.js]
 [browser_animation_inspector_exists.js]
 [browser_animation_keyframes-graph_computed-value-path-01.js]
 [browser_animation_keyframes-graph_computed-value-path-02.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/inspector/animation/test/browser_animation_current-time-scrubber-with-negative-delay.js
@@ -0,0 +1,30 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test whether the most left position means negative current time.
+
+add_task(async function() {
+  await addTab(URL_ROOT + "doc_multi_timings.html");
+  await removeAnimatedElementsExcept([".cssanimation-normal", ".delay-negative"]);
+  const { animationInspector, panel, inspector } = await openAnimationInspector();
+
+  info("Checking scrubber controller existence");
+  const controllerEl = panel.querySelector(".current-time-scrubber-area");
+  ok(controllerEl, "scrubber controller should exist");
+
+  info("Checking the current time of most left scrubber position");
+  const timeScale = animationInspector.state.timeScale;
+  await clickOnCurrentTimeScrubberController(animationInspector, panel, 0);
+  assertAnimationsCurrentTime(animationInspector, -1 * timeScale.zeroPositionTime);
+
+  info("Select negative current time animation");
+  await selectNodeAndWaitForAnimations(".cssanimation-normal", inspector);
+  assertAnimationsCurrentTime(animationInspector, -1 * timeScale.zeroPositionTime);
+
+  info("Back to 'body' and rewind the animation");
+  await selectNodeAndWaitForAnimations("body", inspector);
+  await clickOnRewindButton(animationInspector, panel);
+  assertAnimationsCurrentTime(animationInspector, 0);
+});
--- a/devtools/client/inspector/animation/test/browser_animation_pause-resume-button_end-time.js
+++ b/devtools/client/inspector/animation/test/browser_animation_pause-resume-button_end-time.js
@@ -3,38 +3,41 @@
 
 "use strict";
 
 // Test whether the animation can rewind if the current time is over end time when
 // the resume button clicked.
 
 add_task(async function() {
   await addTab(URL_ROOT + "doc_simple_animation.html");
-  await removeAnimatedElementsExcept([".animated", ".end-delay", ".long"]);
+  await removeAnimatedElementsExcept([".animated",
+                                      ".end-delay",
+                                      ".long",
+                                      ".negative-delay"]);
   const { animationInspector, panel } = await openAnimationInspector();
 
   info("Check animations state after resuming with infinite animation");
   info("Make the current time of animation to be over its end time");
   await clickOnCurrentTimeScrubberController(animationInspector, panel, 1);
   info("Resume animations");
   await clickOnPauseResumeButton(animationInspector, panel);
   await wait(1000);
   assertPlayState(animationInspector.state.animations,
-                  ["running", "finished", "finished"]);
+                  ["running", "finished", "finished", "finished"]);
   await clickOnCurrentTimeScrubberController(animationInspector, panel, 0);
 
   info("Check animations state after resuming without infinite animation");
   info("Remove infinite animation");
   await setClassAttribute(animationInspector, ".animated", "ball still");
   info("Make the current time of animation to be over its end time");
   await clickOnCurrentTimeScrubberController(animationInspector, panel, 1);
   await clickOnPlaybackRateSelector(animationInspector, panel, 10);
   info("Resume animations");
   await clickOnPauseResumeButton(animationInspector, panel);
-  assertPlayState(animationInspector.state.animations, ["running", "running"]);
+  assertPlayState(animationInspector.state.animations, ["running", "running", "running"]);
   assertCurrentTimeLessThanDuration(animationInspector.state.animations);
   assertScrubberPosition(panel);
 });
 
 function assertPlayState(animations, expectedState) {
   animations.forEach((animation, index) => {
     is(animation.state.playState, expectedState[index],
        `The playState of animation [${ index }] should be ${ expectedState[index] }`);
--- a/devtools/client/inspector/animation/test/browser_animation_rewind-button.js
+++ b/devtools/client/inspector/animation/test/browser_animation_rewind-button.js
@@ -4,18 +4,20 @@
 "use strict";
 
 // Test for following RewindButton component:
 // * element existence
 // * make animations to rewind to zero
 // * the state should be always paused after rewinding
 
 add_task(async function() {
-  await addTab(URL_ROOT + "doc_custom_playback_rate.html");
+  await addTab(URL_ROOT + "doc_multi_timings.html");
   const { animationInspector, panel } = await openAnimationInspector();
+  await removeAnimatedElementsExcept([".animated",
+                                      ".negative-delay"]);
 
   info("Checking button existence");
   ok(panel.querySelector(".rewind-button"), "Rewind button should exist");
 
   info("Checking rewind button makes animations to rewind to zero");
   await clickOnRewindButton(animationInspector, panel);
   assertAnimationsCurrentTime(animationInspector, 0);
   assertAnimationsPausing(animationInspector, panel);
--- a/devtools/client/inspector/animation/test/head.js
+++ b/devtools/client/inspector/animation/test/head.js
@@ -183,18 +183,17 @@ const clickOnRewindButton = async functi
  * @param {Number} mouseDownPosition
  *        rate on scrubber controller pane.
  *        This method calculates
  *        `mouseDownPosition * offsetWidth + offsetLeft of scrubber controller pane`
  *        as the clientX of MouseEvent.
  */
 const clickOnCurrentTimeScrubberController = async function(animationInspector,
                                                             panel,
-                                                            mouseDownPosition,
-                                                            mouseMovePosition) {
+                                                            mouseDownPosition) {
   const controllerEl = panel.querySelector(".current-time-scrubber-area");
   const bounds = controllerEl.getBoundingClientRect();
   const mousedonwX = bounds.width * mouseDownPosition;
 
   info(`Click ${ mousedonwX } on scrubber controller`);
   EventUtils.synthesizeMouse(controllerEl, mousedonwX, 0, {}, controllerEl.ownerGlobal);
   await waitForSummaryAndDetail(animationInspector);
 };