[DevTools] Move Popover to shadow DOM.

third_party/WebKit/Source/devtools/front_end/ui/Popover.js

Index: third_party/WebKit/Source/devtools/front_end/ui/Popover.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/Popover.js b/third_party/WebKit/Source/devtools/front_end/ui/Popover.js
index 375a9c0d1311d30accc82276b3c2711890a99489..9a404ba9235056338230d79b3a7543f2bc109940 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/Popover.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/Popover.js
@@ -36,14 +36,12 @@ UI.Popover = class extends UI.Widget {
    * @param {!UI.PopoverHelper=} popoverHelper
    */
   constructor(popoverHelper) {
-    super();
+    super(true);
     this.markAsRoot();
-    this.element.className = UI.Popover._classNamePrefix;  // Override
+    this.registerRequiredCSS('ui/popover.css');
     this._containerElement = createElementWithClass('div', 'fill popover-container');
-
-    this._popupArrowElement = this.element.createChild('div', 'arrow');
-    this._contentDiv = this.element.createChild('div', 'content');
-
+    this._popupArrowElement = this.contentElement.createChild('div', 'arrow');
+    this._contentDiv = this.contentElement.createChild('div', 'popover-content');
     this._popoverHelper = popoverHelper;
     this._hideBound = this.hide.bind(this);
   }
@@ -135,7 +133,6 @@ UI.Popover = class extends UI.Widget {
    */
   setCanShrink(canShrink) {
     this._hasFixedHeight = !canShrink;
-    this._contentDiv.classList.toggle('fixed-height', this._hasFixedHeight);
   }
 
   /**
@@ -235,8 +232,7 @@ UI.Popover = class extends UI.Widget {
           Math.max(0, anchorBox.x - newElementPosition.x - borderRadius - arrowRadius + anchorBox.width / 2) + 'px';
     }
 
-    this.element.className =
-        UI.Popover._classNamePrefix + ' ' + verticalAlignment + '-' + horizontalAlignment + '-arrow';
+    this._popupArrowElement.className = 'arrow ' + verticalAlignment + '-' + horizontalAlignment + '-arrow';
     this.element.positionAt(newElementPosition.x, newElementPosition.y - borderWidth, container);
     this.element.style.width = newElementPosition.width + borderWidth * 2 + 'px';
     this.element.style.height = newElementPosition.height + borderWidth * 2 + 'px';