Bug 1245849 - Remove mochitest browser_animation_name.js and add a xpcshell test instead; r=ochameau

--HG--
extra : commitid : AYcI9tDXKgD
extra : rebase_source : 64225d0a9b7b57a646527cefaaa432cdd75051e7

devtools/server/actors/animation.js

@@ -41,6 +41,7 @@ const ANIMATION_TYPES = {
   CSS_TRANSITION: "csstransition",
   UNKNOWN: "unknown"
 };
+exports.ANIMATION_TYPES = ANIMATION_TYPES;
 
 /**
  * The AnimationPlayerActor provides information about a given animation: its
@@ -71,16 +72,12 @@ var AnimationPlayerActor = ActorClass({
     this.onAnimationMutation = this.onAnimationMutation.bind(this);
 
     this.walker = animationsActor.walker;
-    this.tabActor = animationsActor.tabActor;
     this.player = player;
     this.node = player.effect.target;
 
-    let win = this.node.ownerDocument.defaultView;
-    this.styles = win.getComputedStyle(this.node);
-
     // Listen to animation mutations on the node to alert the front when the
     // current animation changes.
-    this.observer = new win.MutationObserver(this.onAnimationMutation);
+    this.observer = new this.window.MutationObserver(this.onAnimationMutation);
     this.observer.observe(this.node, {animations: true});
   },
 
@@ -90,12 +87,15 @@ var AnimationPlayerActor = ActorClass({
     if (this.observer && !Cu.isDeadWrapper(this.observer)) {
       this.observer.disconnect();
     }
-    this.tabActor = this.player = this.node = this.styles = null;
-    this.observer = this.walker = null;
+    this.player = this.node = this.observer = this.walker = null;
 
     Actor.prototype.destroy.call(this);
   },
 
+  get window() {
+    return this.node.ownerDocument.defaultView;
+  },
+
   /**
    * Release the actor, when it isn't needed anymore.
    * Protocol.js uses this release method to call the destroy method.
@@ -119,12 +119,12 @@ var AnimationPlayerActor = ActorClass({
     return data;
   },
 
-  isAnimation: function(player=this.player) {
-    return player instanceof this.tabActor.window.CSSAnimation;
+  isAnimation: function(player = this.player) {
+    return player instanceof this.window.CSSAnimation;
   },
 
-  isTransition: function(player=this.player) {
-    return player instanceof this.tabActor.window.CSSTransition;
+  isTransition: function(player = this.player) {
+    return player instanceof this.window.CSSTransition;
   },
 
   getType: function() {
@@ -372,6 +372,8 @@ var AnimationPlayerActor = ActorClass({
   })
 });
 
+exports.AnimationPlayerActor = AnimationPlayerActor;
+
 var AnimationPlayerFront = FrontClass(AnimationPlayerActor, {
   initialize: function(conn, form, detail, ctx) {
     Front.prototype.initialize.call(this, conn, form, detail, ctx);

devtools/server/tests/browser/animation.html

@@ -145,19 +145,6 @@
       width: 100px;
     }
   }
-
-  .script-generated {
-    display: inline-block;
-
-    width: 50px;
-    height: 50px;
-    border-radius: 50%;
-    background-color: black;
-    background-image:
-      repeating-linear-gradient(45deg, transparent 0, transparent 5px, #f06 5px, #f06 10px);
-    border: 5px solid #f06;
-    box-sizing: border-box;
-  }
 </style>
 <div class="not-animated"></div>
 <div class="simple-animation"></div>
@@ -170,26 +157,11 @@
 <div class="delayed-multiple-animations"></div>
 <div class="multiple-animations-2"></div>
 <div class="all-transitions"></div>
-<div class="script-generated"></div>
 <script type="text/javascript">
   // Get the transitions started when the page loads
   var players;
   addEventListener("load", function() {
     document.querySelector(".transition").classList.add("get-round");
     document.querySelector(".delayed-transition").classList.add("get-round");
-
-    // Create a script-generated animation.
-    var animation = document.querySelector(".script-generated").animate({
-      backgroundColor: ["black", "gold"]
-    }, {
-      duration: 500,
-      iterations: Infinity,
-      direction: "alternate"
-    });
-    animation.id = "custom-animation-name";
-
-    // Add a custom animation id to an existing css animation.
-    document.querySelector(".delayed-animation")
-            .getAnimations()[0].id = "cssanimation-custom-name";
   });
 </script>

devtools/server/tests/browser/browser.ini

@@ -28,7 +28,6 @@ support-files =
 [browser_animation_getStateAfterFinished.js]
 [browser_animation_getSubTreeAnimations.js]
 [browser_animation_keepFinished.js]
-[browser_animation_name.js]
 [browser_animation_playerState.js]
 [browser_animation_playPauseIframe.js]
 [browser_animation_playPauseSeveral.js]

devtools/server/tests/browser/browser_animation_name.js

@@ -1,51 +0,0 @@
-/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
-/* Any copyright is dedicated to the Public Domain.
-   http://creativecommons.org/publicdomain/zero/1.0/ */
-
-"use strict";
-
-// Test that the AnimationPlayerActor provides the correct name for an
-// animation. Whether this animation is a CSSAnimation, CSSTransition or a
-// script-based animation that has been given an id, or even a CSSAnimation that
-// has been given an id.
-
-const TEST_DATA = [{
-  selector: ".simple-animation",
-  animationIndex: 0,
-  expectedName: "move"
-}, {
-  selector: ".transition",
-  animationIndex: 0,
-  expectedName: "width"
-}, {
-  selector: ".script-generated",
-  animationIndex: 0,
-  expectedName: "custom-animation-name"
-}, {
-  selector: ".delayed-animation",
-  animationIndex: 0,
-  expectedName: "cssanimation-custom-name"
-}];
-
-add_task(function*() {
-  let {client, walker, animations} =
-    yield initAnimationsFrontForUrl(MAIN_DOMAIN + "animation.html");
-
-  for (let {selector, animationIndex, expectedName} of TEST_DATA) {
-    let {name} = yield getAnimationStateForNode(walker, animations, selector,
-                                                animationIndex);
-    is(name, expectedName, "The animation has the expected name");
-  }
-
-  yield closeDebuggerClient(client);
-  gBrowser.removeCurrentTab();
-});
-
-function* getAnimationStateForNode(walker, animations, nodeSelector, index) {
-  let node = yield walker.querySelector(walker.rootNode, nodeSelector);
-  let players = yield animations.getAnimationPlayersForNode(node);
-  let player = players[index];
-  yield player.ready();
-  let state = yield player.getCurrentState();
-  return state;
-}

devtools/server/tests/unit/test_animation_name.js

@@ -0,0 +1,79 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+"use strict";
+
+// Test that AnimationPlayerActor.getName returns the right name depending on
+// the type of an animation and the various properties available on it.
+
+const { AnimationPlayerActor } = require("devtools/server/actors/animation");
+
+function run_test() {
+  // Mock a window with just the properties the AnimationPlayerActor uses.
+  let window = {
+    MutationObserver: function() {
+      this.observe = () => {};
+    },
+    Animation: function() {
+      this.effect = {target: getMockNode()};
+    },
+    CSSAnimation: function() {
+      this.effect = {target: getMockNode()};
+    },
+    CSSTransition: function() {
+      this.effect = {target: getMockNode()};
+    }
+  };
+
+  // Helper to get a mock DOM node.
+  function getMockNode() {
+    return {
+      ownerDocument: {
+        defaultView: window
+      }
+    };
+  }
+
+  // Objects in this array should contain the following properties:
+  // - desc {String} For logging
+  // - animation {Object} An animation object instantiated from one of the mock
+  //   window animation constructors.
+  // - props {Objet} Properties of this object will be added to the animation
+  //   object.
+  // - expectedName {String} The expected name returned by
+  //   AnimationPlayerActor.getName.
+  const TEST_DATA = [{
+    desc: "Animation with an id",
+    animation: new window.Animation(),
+    props: { id: "animation-id" },
+    expectedName: "animation-id"
+  }, {
+    desc: "CSSTransition with an id",
+    animation: new window.CSSTransition(),
+    props: { id: "transition-with-id", transitionProperty: "width" },
+    expectedName: "transition-with-id"
+  }, {
+    desc: "CSSAnimation with an id",
+    animation: new window.CSSAnimation(),
+    props: { id: "animation-with-id", animationName: "move" },
+    expectedName: "animation-with-id"
+  }, {
+    desc: "CSSTransition without an id",
+    animation: new window.CSSTransition(),
+    props: { transitionProperty: "width" },
+    expectedName: "width"
+  }, {
+    desc: "CSSAnimation without an id",
+    animation: new window.CSSAnimation(),
+    props: { animationName: "move" },
+    expectedName: "move"
+  }];
+
+  for (let { desc, animation, props, expectedName } of TEST_DATA) {
+    do_print(desc);
+    for (let key in props) {
+      animation[key] = props[key];
+    }
+    let actor = AnimationPlayerActor({}, animation);
+    do_check_eq(actor.getName(), expectedName);
+  }
+}

devtools/server/tests/unit/test_animation_type.js

@@ -0,0 +1,61 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+"use strict";
+
+// Test the output of AnimationPlayerActor.getType().
+
+const { ANIMATION_TYPES, AnimationPlayerActor } =
+  require("devtools/server/actors/animation");
+
+function run_test() {
+  // Mock a window with just the properties the AnimationPlayerActor uses.
+  let window = {
+    MutationObserver: function() {
+      this.observe = () => {};
+    },
+    Animation: function() {
+      this.effect = {target: getMockNode()};
+    },
+    CSSAnimation: function() {
+      this.effect = {target: getMockNode()};
+    },
+    CSSTransition: function() {
+      this.effect = {target: getMockNode()};
+    }
+  };
+
+  // Helper to get a mock DOM node.
+  function getMockNode() {
+    return {
+      ownerDocument: {
+        defaultView: window
+      }
+    };
+  }
+
+  // Objects in this array should contain the following properties:
+  // - desc {String} For logging
+  // - animation {Object} An animation object instantiated from one of the mock
+  //   window animation constructors.
+  // - expectedType {String} The expected type returned by
+  //   AnimationPlayerActor.getType.
+  const TEST_DATA = [{
+    desc: "Test CSSAnimation type",
+    animation: new window.CSSAnimation(),
+    expectedType: ANIMATION_TYPES.CSS_ANIMATION
+  }, {
+    desc: "Test CSSTransition type",
+    animation: new window.CSSTransition(),
+    expectedType: ANIMATION_TYPES.CSS_TRANSITION
+  }, {
+    desc: "Test unknown type",
+    animation: {effect: {target: getMockNode()}},
+    expectedType: ANIMATION_TYPES.UNKNOWN
+  }];
+
+  for (let { desc, animation, expectedType } of TEST_DATA) {
+    do_print(desc);
+    let actor = AnimationPlayerActor({}, animation);
+    do_check_eq(actor.getType(), expectedType);
+  }
+}

devtools/server/tests/unit/xpcshell.ini

@@ -33,6 +33,8 @@ support-files =
   setBreakpoint-on-line-with-no-offsets-at-end-of-script.js
   setBreakpoint-on-line-with-no-offsets-in-gcd-script.js
 
+[test_animation_name.js]
+[test_animation_type.js]
 [test_ScriptStore.js]
 [test_actor-registry-actor.js]
 [test_nesting-01.js]