Devtools Animations: Listen to all animation play state changes

third_party/WebKit/Source/devtools/front_end/animation/AnimationModel.js

 // Copyright (c) 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 
 /**
  * @constructor
  * @extends {WebInspector.SDKModel}
  * @param {!WebInspector.Target} target
  */
@@ skipping 24 matching lines @@
     },
 
     /**
      * @param {string} id
      */
     animationCreated: function(id)
     {
         this._pendingAnimations.push(id);
     },
 
+    /**
+     * @param {string} id
+     */
     _animationCanceled: function(id)
     {
         this._pendingAnimations.remove(id);
         this._flushPendingAnimationsIfNeeded();
     },
 
     /**
      * @param {!AnimationAgent.Animation} payload
      */
     animationStarted: function(payload)
     {
         var animation = WebInspector.AnimationModel.Animation.parsePayload(this.target(), payload);
+
         // Ignore Web Animations custom effects & groups.
-        if (animation.type() === "WebAnimation" && animation.source().keyframesRule().keyframes().length === 0)
+        if (animation.type() === "WebAnimation" && animation.source().keyframesRule().keyframes().length === 0) {
             this._pendingAnimations.remove(animation.id());
-        else
+        } else {
            this._animationsById.set(animation.id(), animation);
+           if (this._pendingAnimations.indexOf(animation.id()) === -1)
+                this._pendingAnimations.push(animation.id());
+        }
+
         this._flushPendingAnimationsIfNeeded();
     },
 
     _flushPendingAnimationsIfNeeded: function()
     {
         for (var id of this._pendingAnimations) {
             if (!this._animationsById.get(id))
                 return;
         }
 
@@ skipping 350 matching lines @@
     iterationStart: function()
     {
         return this._payload.iterationStart;
     },
 
     /**
      * @return {number}
      */
     iterations: function()
     {
+        // Animations with zero duration, zero delays and infinite iterations can't be shown.
+        if (!this.delay() && !this.endDelay() && !this.duration())
+            return 0;
         return this._payload.iterations || Infinity;
     },
 
     /**
      * @return {number}
      */
     duration: function()
     {
         return this._duration;
     },
@@ skipping 332 matching lines @@
 
     /**
      * @override
      * @param {!AnimationAgent.Animation} payload
      */
     animationStarted: function(payload)
     {
         this._animationModel.animationStarted(payload);
     }
 }