[DevTools] Turn WebInspector.Panel into a web component.

third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com>
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 24 matching lines @@
  * @implements {WebInspector.ViewLocationResolver}
  * @extends {WebInspector.Panel}
  */
 WebInspector.ElementsPanel = function()
 {
     WebInspector.Panel.call(this, "elements");
     this.registerRequiredCSS("elements/elementsPanel.css");
 
     this._splitWidget = new WebInspector.SplitWidget(true, true, "elementsPanelSplitViewState", 325, 325);
     this._splitWidget.addEventListener(WebInspector.SplitWidget.Events.SidebarSizeChanged, this._updateTreeOutlineVisibleWidth.bind(this));
-    this._splitWidget.show(this.element);
+    this._splitWidget.show(this.contentElement);
 
     this._searchableView = new WebInspector.SearchableView(this);
     this._searchableView.setMinimumSize(25, 28);
     this._searchableView.setPlaceholder(WebInspector.UIString("Find by string, selector, or XPath"));
     var stackElement = this._searchableView.element;
 
     this._contentElement = createElement("div");
     var crumbsContainer = createElement("div");
     stackElement.appendChild(this._contentElement);
     stackElement.appendChild(crumbsContainer);
@@ skipping 251 matching lines @@
             this._contentElement.removeChild(treeOutline.element);
         }
         if (this._popoverHelper)
             this._popoverHelper.hidePopover();
         WebInspector.Panel.prototype.willHide.call(this);
     },
 
     onResize: function()
     {
         if (WebInspector.moduleSetting("sidebarPosition").get() === "auto")
-            this.element.window().requestAnimationFrame(this._updateSidebarPosition.bind(this));  // Do not force layout.
+            this.contentElement.window().requestAnimationFrame(this._updateSidebarPosition.bind(this));  // Do not force layout.
         this._updateTreeOutlineVisibleWidth();
     },
 
     /**
      * @param {!WebInspector.Event} event
      */
     _selectedNodeChanged: function(event)
     {
         var selectedNode = /** @type {?WebInspector.DOMNode} */ (event.data);
         for (var i = 0; i < this._treeOutlines.length; ++i) {
@@ skipping 787 matching lines @@
     /**
      * @override
      * @param {!WebInspector.DOMNode} node
      * @return {?{title: string, color: string}}
      */
     decorate: function(node)
     {
         return { color: "orange", title: WebInspector.UIString("Element state: %s", ":" + WebInspector.CSSModel.fromNode(node).pseudoState(node).join(", :")) };
     }
 }