Devtools: Fix disabled element state pane button after reloading

Source/devtools/front_end/animation/AnimationControlPane.js

 // Copyright (c) 2015 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.StylesSidebarPane.BaseToolbarPaneWidget}
  */
 WebInspector.AnimationControlPane = function(toolbarItem)
 {
@@ skipping 63 matching lines @@
         if (this._target)
             this._target.animationAgent().getPlaybackRate(setPlaybackRate.bind(this));
     },
 
     /**
      * @override
      * @param {?WebInspector.DOMNode} node
      */
     onNodeChanged: function(node)
     {
-        if (!node) {
-            this.detach();
+        if (!node)
             return;
-        }
 
         if (this._target)
             this._target.resourceTreeModel.removeEventListener(WebInspector.ResourceTreeModel.EventTypes.MainFrameNavigated, this._updateAnimationsPlaybackRate, this);
 
         this._target = node.target();
         this._target.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.MainFrameNavigated, this._updateAnimationsPlaybackRate, this);
         this._updateAnimationsPlaybackRate();
     },
 
     __proto__: WebInspector.StylesSidebarPane.BaseToolbarPaneWidget.prototype
 }
 
 /**
  * @constructor
  * @implements {WebInspector.ToolbarItem.Provider}
  */
 WebInspector.AnimationControlPane.ButtonProvider = function()
 {
     this._button = new WebInspector.ToolbarButton(WebInspector.UIString("Animations Controls"), "animation-toolbar-item");
     this._button.addEventListener("click", this._clicked, this);
     WebInspector.context.addFlavorChangeListener(WebInspector.DOMNode, this._nodeChanged, this);
     this._nodeChanged();
 }
 
 WebInspector.AnimationControlPane.ButtonProvider.prototype = {
-    _animationTimelineModeClick: function()
+    /**
+     * @param {boolean} toggleOn
+     */
+    _toggleAnimationTimelineMode: function(toggleOn)
     {
         if (!this._animationTimeline)
             this._animationTimeline = new WebInspector.AnimationTimeline();
-        this._button.setToggled(!this._animationTimeline.isShowing());
+        this._button.setToggled(toggleOn);
         var elementsPanel = WebInspector.ElementsPanel.instance();
-        elementsPanel.setWidgetBelowDOM(!this._animationTimeline.isShowing() ? this._animationTimeline : null);
+        elementsPanel.setWidgetBelowDOM(toggleOn ? this._animationTimeline : null);
     },
 
-    _animationControlPaneModeClick: function()
+    /**
+     * @param {boolean} toggleOn
+     */
+    _toggleAnimationControlPaneMode: function(toggleOn)
     {
         if (!this._animationsControlPane)
             this._animationsControlPane = new WebInspector.AnimationControlPane(this.item());
         var stylesSidebarPane = WebInspector.ElementsPanel.instance().sidebarPanes.styles;
-        stylesSidebarPane.showToolbarPane(!this._animationsControlPane.isShowing() ? this._animationsControlPane : null);
+        stylesSidebarPane.showToolbarPane(toggleOn ? this._animationsControlPane : null);
     },
 
     _clicked: function()
     {
         if (Runtime.experiments.isEnabled("animationInspection"))
-            this._animationTimelineModeClick();
+            this._toggleAnimationTimelineMode(!this._button.toggled());
         else
-            this._animationControlPaneModeClick();
+            this._toggleAnimationControlPaneMode(!this._button.toggled());
     },
 
     _nodeChanged: function()
     {
-        this._button.setEnabled(!!WebInspector.context.flavor(WebInspector.DOMNode));
+        var enabled = !!WebInspector.context.flavor(WebInspector.DOMNode);
+        this._button.setEnabled(enabled);
+        if (enabled)
+            return;
+
+        if (Runtime.experiments.isEnabled("animationInspection"))
+            this._toggleAnimationTimelineMode(false);
+        else
+            this._toggleAnimationControlPaneMode(false);
     },
 
     /**
      * @override
      * @return {!WebInspector.ToolbarItem}
      */
     item: function()
     {
         return this._button;
     }
 }