DevTools: wheel-zoom on timeline makes overview window flicker.

Source/devtools/front_end/components/FlameChart.js

 /**
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 397 matching lines @@
      * @return {?WebInspector.FlameChart.TimelineData}
      */
     _timelineData: function()
     {
         var timelineData = this._dataProvider.timelineData();
         if (timelineData !== this._rawTimelineData || timelineData.entryStartTimes.length !== this._rawTimelineDataLength)
             this._processTimelineData(timelineData);
         return this._rawTimelineData;
     },
 
+    _cancelAnimation: function()
+    {
+        if (this._cancelWindowTimesAnimation) {
+            this._timeWindowLeft = this._pendingAnimationTimeLeft;
+            this._timeWindowRight = this._pendingAnimationTimeRight;
+            this._cancelWindowTimesAnimation();
+            delete this._cancelWindowTimesAnimation;
+        }
+    },
+
     /**
      * @param {number} startTime
      * @param {number} endTime
      */
     setWindowTimes: function(startTime, endTime)
     {
         if (this._muteAnimation || this._timeWindowLeft === 0 || this._timeWindowRight === Infinity) {
             // Initial setup.
             this._timeWindowLeft = startTime;
             this._timeWindowRight = endTime;
             this.scheduleUpdate();
             return;
         }
 
-        if (this._cancelWindowTimesAnimation)
-            this._cancelWindowTimesAnimation();
+        this._cancelAnimation();
         this._cancelWindowTimesAnimation = WebInspector.animateFunction(this._animateWindowTimes.bind(this),
             [{from: this._timeWindowLeft, to: startTime}, {from: this._timeWindowRight, to: endTime}], 5,
             this._animationCompleted.bind(this));
+        this._pendingAnimationTimeLeft = startTime;
+        this._pendingAnimationTimeRight = endTime;
     },
 
     /**
      * @param {number} startTime
      * @param {number} endTime
      */
     _animateWindowTimes: function(startTime, endTime)
     {
         this._timeWindowLeft = startTime;
         this._timeWindowRight = endTime;
@@ skipping 145 matching lines @@
             this._handleZoomGesture(zoomMultiplier);
             e.consume(true);
         }
     },
 
     /**
      * @param {number} zoom
      */
     _handleZoomGesture: function(zoom)
     {
+        this._cancelAnimation();
         var bounds = this._windowForGesture();
         var cursorTime = this._cursorTime(this._lastMouseOffsetX);
         bounds.left += (bounds.left - cursorTime) * zoom;
         bounds.right += (bounds.right - cursorTime) * zoom;
         this._requestWindowTimes(bounds);
     },
 
     /**
      * @param {number} shift
      */
     _handlePanGesture: function(shift)
     {
+        this._cancelAnimation();
         var bounds = this._windowForGesture();
         shift = Number.constrain(shift, this._minimumBoundary - bounds.left, this._totalTime + this._minimumBoundary - bounds.right);
         bounds.left += shift;
         bounds.right += shift;
         this._requestWindowTimes(bounds);
     },
 
     /**
      * @return {{left: number, right: number}}
      */
@@ skipping 537 matching lines @@
     {
         this._highlightedMarkerIndex = -1;
         this._highlightedEntryIndex = -1;
         this._selectedEntryIndex = -1;
         this._textWidth = {};
         this.update();
     },
 
     __proto__: WebInspector.HBox.prototype
 }