<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[204264] trunk/Source/WebInspectorUI</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/204264">204264</a></dd>
<dt>Author</dt> <dd>joepeck@webkit.org</dd>
<dt>Date</dt> <dd>2016-08-08 13:56:35 -0700 (Mon, 08 Aug 2016)</dd>
</dl>

<h3>Log Message</h3>
<pre>Web Inspector: Popover for Color Picker should update position when window resizes
https://bugs.webkit.org/show_bug.cgi?id=160321

Reviewed by Brian Burg.

* UserInterface/Views/Popover.js:
(WebInspector.Popover):
(WebInspector.Popover.prototype.set windowResizeHandler):
(WebInspector.Popover.prototype.dismiss):
(WebInspector.Popover.prototype.handleEvent):
(WebInspector.Popover.prototype._addListenersIfNeeded):
The popover already has a set of window listeners, add &quot;resize&quot; to
the list. If there is a resize, invoke a resize handler. The resize
handler will only be called while the popover is visible.

* UserInterface/Views/HeapSnapshotDataGridTree.js:
(WebInspector.HeapSnapshotDataGridTree):
(WebInspector.HeapSnapshotDataGridTree.prototype.get visible):
(WebInspector.HeapSnapshotDataGridTree.prototype.get popoverNode):
(WebInspector.HeapSnapshotDataGridTree.prototype.set popoverNode):
(WebInspector.HeapSnapshotDataGridTree.prototype.get popoverTargetElement):
(WebInspector.HeapSnapshotDataGridTree.prototype.set popoverTargetElement):
(WebInspector.HeapSnapshotDataGridTree.prototype.get popover):
(WebInspector.HeapSnapshotDataGridTree.prototype.willDismissPopover):
* UserInterface/Views/HeapSnapshotInstanceDataGridNode.js:
Update heap snapshot popovers to reposition on window resize.
Set a target to reposition around, since the popover is shared.

* UserInterface/Views/ProbeSetDetailsSection.js:
(WebInspector.ProbeSetDetailsSection.prototype._addProbeButtonClicked):
Update probe expression popover to respect window resizes.

* UserInterface/Views/VisualStylePropertyEditor.js:
(WebInspector.VisualStylePropertyEditor.prototype._showPropertyInfoPopover):
Though not yet visible, update this to respect window resizes.

* UserInterface/Views/InlineSwatch.js:
(WebInspector.InlineSwatch.prototype._swatchElementClicked):
Add a window resize handler to reposition over the swatch element.

* UserInterface/Views/LayerTreeDetailsSidebarPanel.js:
(WebInspector.LayerTreeDetailsSidebarPanel.prototype._updatePopoverForSelectedNode):
(WebInspector.LayerTreeDetailsSidebarPanel): Deleted.
(WebInspector.LayerTreeDetailsSidebarPanel.prototype._windowResized): Deleted.
* UserInterface/Views/TimelineDataGrid.js:
(WebInspector.TimelineDataGrid.prototype._showPopoverForSelectedNodeSoon):
(WebInspector.TimelineDataGrid): Deleted.
(WebInspector.TimelineDataGrid.prototype.closed): Deleted.
(WebInspector.TimelineDataGrid.prototype.handleEvent): Deleted.
(WebInspector.TimelineDataGrid.prototype._windowResized): Deleted.
* UserInterface/Views/ScopeChainDetailsSidebarPanel.js:
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._addWatchExpressionButtonClicked):
(WebInspector.ScopeChainDetailsSidebarPanel.prototype.willDismissPopover): Deleted.
Replace custom popover repositioning with standard Popover handling.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsHeapSnapshotDataGridTreejs">trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotDataGridTree.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsHeapSnapshotInstanceDataGridNodejs">trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotInstanceDataGridNode.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsInlineSwatchjs">trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsLayerTreeDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsPopoverjs">trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsProbeSetDetailsSectionjs">trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsScopeChainDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineDataGridjs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsVisualStylePropertyEditorjs">trunk/Source/WebInspectorUI/UserInterface/Views/VisualStylePropertyEditor.js</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/ChangeLog        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -1,3 +1,60 @@
</span><ins>+2016-08-08  Joseph Pecoraro  &lt;pecoraro@apple.com&gt;
+
+        Web Inspector: Popover for Color Picker should update position when window resizes
+        https://bugs.webkit.org/show_bug.cgi?id=160321
+
+        Reviewed by Brian Burg.
+
+        * UserInterface/Views/Popover.js:
+        (WebInspector.Popover):
+        (WebInspector.Popover.prototype.set windowResizeHandler):
+        (WebInspector.Popover.prototype.dismiss):
+        (WebInspector.Popover.prototype.handleEvent):
+        (WebInspector.Popover.prototype._addListenersIfNeeded):
+        The popover already has a set of window listeners, add &quot;resize&quot; to
+        the list. If there is a resize, invoke a resize handler. The resize
+        handler will only be called while the popover is visible.
+
+        * UserInterface/Views/HeapSnapshotDataGridTree.js:
+        (WebInspector.HeapSnapshotDataGridTree):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.get visible):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.get popoverNode):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.set popoverNode):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.get popoverTargetElement):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.set popoverTargetElement):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.get popover):
+        (WebInspector.HeapSnapshotDataGridTree.prototype.willDismissPopover):
+        * UserInterface/Views/HeapSnapshotInstanceDataGridNode.js:
+        Update heap snapshot popovers to reposition on window resize.
+        Set a target to reposition around, since the popover is shared.
+
+        * UserInterface/Views/ProbeSetDetailsSection.js:
+        (WebInspector.ProbeSetDetailsSection.prototype._addProbeButtonClicked):
+        Update probe expression popover to respect window resizes.
+
+        * UserInterface/Views/VisualStylePropertyEditor.js:
+        (WebInspector.VisualStylePropertyEditor.prototype._showPropertyInfoPopover):
+        Though not yet visible, update this to respect window resizes.
+
+        * UserInterface/Views/InlineSwatch.js:
+        (WebInspector.InlineSwatch.prototype._swatchElementClicked):
+        Add a window resize handler to reposition over the swatch element.
+
+        * UserInterface/Views/LayerTreeDetailsSidebarPanel.js:
+        (WebInspector.LayerTreeDetailsSidebarPanel.prototype._updatePopoverForSelectedNode):
+        (WebInspector.LayerTreeDetailsSidebarPanel): Deleted.
+        (WebInspector.LayerTreeDetailsSidebarPanel.prototype._windowResized): Deleted.
+        * UserInterface/Views/TimelineDataGrid.js:
+        (WebInspector.TimelineDataGrid.prototype._showPopoverForSelectedNodeSoon):
+        (WebInspector.TimelineDataGrid): Deleted.
+        (WebInspector.TimelineDataGrid.prototype.closed): Deleted.
+        (WebInspector.TimelineDataGrid.prototype.handleEvent): Deleted.
+        (WebInspector.TimelineDataGrid.prototype._windowResized): Deleted.
+        * UserInterface/Views/ScopeChainDetailsSidebarPanel.js:
+        (WebInspector.ScopeChainDetailsSidebarPanel.prototype._addWatchExpressionButtonClicked):
+        (WebInspector.ScopeChainDetailsSidebarPanel.prototype.willDismissPopover): Deleted.
+        Replace custom popover repositioning with standard Popover handling.
+
</ins><span class="cx"> 2016-08-07  Matt Baker  &lt;mattbaker@apple.com&gt;
</span><span class="cx"> 
</span><span class="cx">         REGRESSION (r201245): switching between Computed and Visual Styles panels causes internal error
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsHeapSnapshotDataGridTreejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotDataGridTree.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotDataGridTree.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotDataGridTree.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -39,7 +39,8 @@
</span><span class="cx"> 
</span><span class="cx">         this._visible = false;
</span><span class="cx">         this._popover = null;
</span><del>-        this._popoverNode = null;
</del><ins>+        this._popoverGridNode = null;
+        this._popoverTargetElement = null;
</ins><span class="cx"> 
</span><span class="cx">         this.populateTopLevel();
</span><span class="cx">     }
</span><span class="lines">@@ -69,29 +70,25 @@
</span><span class="cx"> 
</span><span class="cx">     get heapSnapshot() { return this._heapSnapshot; }
</span><span class="cx"> 
</span><del>-    get visible()
-    {
-        return this._visible;
-    }
</del><ins>+    get visible() { return this._visible; }
+    get popoverGridNode() { return this._popoverGridNode; }
+    set popoverGridNode(x) { this._popoverGridNode = x; }
+    get popoverTargetElement() { return this._popoverTargetElement; }
+    set popoverTargetElement(x) { this._popoverTargetElement = x; }
</ins><span class="cx"> 
</span><span class="cx">     get popover()
</span><span class="cx">     {
</span><del>-        if (!this._popover)
</del><ins>+        if (!this._popover) {
</ins><span class="cx">             this._popover = new WebInspector.Popover(this);
</span><ins>+            this._popover.windowResizeHandler = () =&gt; {
+                let bounds = WebInspector.Rect.rectFromClientRect(this._popoverTargetElement.getBoundingClientRect());
+                this._popover.present(bounds.pad(2), [WebInspector.RectEdge.MAX_Y, WebInspector.RectEdge.MIN_Y, WebInspector.RectEdge.MAX_X]);
+            };
+        }
</ins><span class="cx"> 
</span><span class="cx">         return this._popover;
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    get popoverNode()
-    {
-        return this._popoverNode;
-    }
-
-    set popoverNode(x)
-    {
-        this._popoverNode = x;
-    }
-
</del><span class="cx">     get children()
</span><span class="cx">     {
</span><span class="cx">         return this._children;
</span><span class="lines">@@ -151,7 +148,8 @@
</span><span class="cx"> 
</span><span class="cx">     willDismissPopover(popover)
</span><span class="cx">     {
</span><del>-        this._popoverNode = null;
</del><ins>+        this._popoverGridNode = null;
+        this._popoverTargetElement = null;
</ins><span class="cx">     }
</span><span class="cx"> 
</span><span class="cx">     // Protected
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsHeapSnapshotInstanceDataGridNodejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotInstanceDataGridNode.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotInstanceDataGridNode.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HeapSnapshotInstanceDataGridNode.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -318,10 +318,11 @@
</span><span class="cx">         if (!targetFrame.size.width &amp;&amp; !targetFrame.size.height)
</span><span class="cx">             return;
</span><span class="cx"> 
</span><del>-        if (this._tree.popoverNode === this._node)
</del><ins>+        if (this._tree.popoverGridNode === this._node)
</ins><span class="cx">             return;
</span><span class="cx"> 
</span><del>-        this._tree.popoverNode = this._node;
</del><ins>+        this._tree.popoverGridNode = this._node;
+        this._tree.popoverTargetElement = event.target;
</ins><span class="cx"> 
</span><span class="cx">         let popoverContentElement = document.createElement(&quot;div&quot;);
</span><span class="cx">         popoverContentElement.classList.add(&quot;heap-snapshot&quot;, &quot;heap-snapshot-instance-popover-content&quot;);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsInlineSwatchjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -134,6 +134,11 @@
</span><span class="cx">         let bounds = WebInspector.Rect.rectFromClientRect(this._swatchElement.getBoundingClientRect());
</span><span class="cx">         let popover = new WebInspector.Popover(this);
</span><span class="cx"> 
</span><ins>+        popover.windowResizeHandler = () =&gt; {
+            let bounds = WebInspector.Rect.rectFromClientRect(this._swatchElement.getBoundingClientRect());
+            popover.present(bounds.pad(2), [WebInspector.RectEdge.MIN_X]);
+        };
+
</ins><span class="cx">         this._valueEditor = null;
</span><span class="cx">         if (this._type === WebInspector.InlineSwatch.Type.Bezier) {
</span><span class="cx">             this._valueEditor = new WebInspector.BezierEditor;
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsLayerTreeDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -35,8 +35,6 @@
</span><span class="cx"> 
</span><span class="cx">         WebInspector.showShadowDOMSetting.addEventListener(WebInspector.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
</span><span class="cx"> 
</span><del>-        window.addEventListener(&quot;resize&quot;, this._windowResized.bind(this));
-
</del><span class="cx">         this._buildLayerInfoSection();
</span><span class="cx">         this._buildDataGridSection();
</span><span class="cx">         this._buildBottomBar();
</span><span class="lines">@@ -93,12 +91,6 @@
</span><span class="cx">             this._updateDisplayWithLayers(this._layerForNode, this._unfilteredChildLayers);
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    _windowResized(event)
-    {
-        if (this._popover &amp;&amp; this._popover.visible)
-            this._updatePopoverForSelectedNode();
-    }
-
</del><span class="cx">     _buildLayerInfoSection()
</span><span class="cx">     {
</span><span class="cx">         var rows = this._layerInfoRows = {};
</span><span class="lines">@@ -332,8 +324,10 @@
</span><span class="cx">             return;
</span><span class="cx"> 
</span><span class="cx">         var popover = this._popover;
</span><del>-        if (!popover)
</del><ins>+        if (!popover) {
</ins><span class="cx">             popover = this._popover = new WebInspector.Popover;
</span><ins>+            popover.windowResizeHandler = () =&gt; { this._updatePopoverForSelectedNode(); };
+        }
</ins><span class="cx"> 
</span><span class="cx">         var targetFrame = WebInspector.Rect.rectFromClientRect(dataGridNode.element.getBoundingClientRect());
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsPopoverjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -36,6 +36,7 @@
</span><span class="cx">         this._targetFrame = new WebInspector.Rect;
</span><span class="cx">         this._anchorPoint = new WebInspector.Point;
</span><span class="cx">         this._preferredEdges = null;
</span><ins>+        this._resizeHandler = null;
</ins><span class="cx"> 
</span><span class="cx">         this._contentNeedsUpdate = false;
</span><span class="cx">         this._dismissing = false;
</span><span class="lines">@@ -90,6 +91,12 @@
</span><span class="cx">             this._update(true);
</span><span class="cx">     }
</span><span class="cx"> 
</span><ins>+    set windowResizeHandler(resizeHandler)
+    {
+        console.assert(typeof resizeHandler === &quot;function&quot;);
+        this._resizeHandler = resizeHandler;
+    }
+
</ins><span class="cx">     update(shouldAnimate = true)
</span><span class="cx">     {
</span><span class="cx">         if (!this.visible)
</span><span class="lines">@@ -142,6 +149,7 @@
</span><span class="cx">         this._isListeningForPopoverEvents = false;
</span><span class="cx">         window.removeEventListener(&quot;mousedown&quot;, this, true);
</span><span class="cx">         window.removeEventListener(&quot;scroll&quot;, this, true);
</span><ins>+        window.removeEventListener(&quot;resize&quot;, this, true);
</ins><span class="cx"> 
</span><span class="cx">         this._element.classList.add(WebInspector.Popover.FadeOutClassName);
</span><span class="cx"> 
</span><span class="lines">@@ -157,6 +165,10 @@
</span><span class="cx">             if (!this._element.contains(event.target) &amp;&amp; !event.target.enclosingNodeOrSelfWithClass(WebInspector.Popover.IgnoreAutoDismissClassName))
</span><span class="cx">                 this.dismiss();
</span><span class="cx">             break;
</span><ins>+        case &quot;resize&quot;:
+            if (this._resizeHandler)
+                this._resizeHandler();
+            break;
</ins><span class="cx">         case &quot;transitionend&quot;:
</span><span class="cx">             if (event.target === this._element) {
</span><span class="cx">                 document.body.removeChild(this._element);
</span><span class="lines">@@ -168,6 +180,7 @@
</span><span class="cx">                 this._dismissing = false;
</span><span class="cx">                 break;
</span><span class="cx">             }
</span><ins>+            break;
</ins><span class="cx">         }
</span><span class="cx">     }
</span><span class="cx"> 
</span><span class="lines">@@ -557,6 +570,7 @@
</span><span class="cx">             this._isListeningForPopoverEvents = true;
</span><span class="cx">             window.addEventListener(&quot;mousedown&quot;, this, true);
</span><span class="cx">             window.addEventListener(&quot;scroll&quot;, this, true);
</span><ins>+            window.addEventListener(&quot;resize&quot;, this, true);
</ins><span class="cx">         }
</span><span class="cx">     }
</span><span class="cx"> };
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsProbeSetDetailsSectionjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -131,6 +131,10 @@
</span><span class="cx">         popover.content = content;
</span><span class="cx">         let target = WebInspector.Rect.rectFromClientRect(event.target.element.getBoundingClientRect());
</span><span class="cx">         popover.present(target, [WebInspector.RectEdge.MAX_Y, WebInspector.RectEdge.MIN_Y, WebInspector.RectEdge.MAX_X]);
</span><ins>+        popover.windowResizeHandler = () =&gt; {
+            let target = WebInspector.Rect.rectFromClientRect(event.target.element.getBoundingClientRect());
+            popover.present(target, [WebInspector.RectEdge.MAX_Y, WebInspector.RectEdge.MIN_Y, WebInspector.RectEdge.MAX_X]);            
+        };
</ins><span class="cx">         textBox.select();
</span><span class="cx">     }
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsScopeChainDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -368,11 +368,9 @@
</span><span class="cx">             }
</span><span class="cx">         });
</span><span class="cx"> 
</span><del>-        // Reposition the popover when the window resizes.
-        this._windowResizeListener = presentPopoverOverTargetElement;
-        window.addEventListener(&quot;resize&quot;, this._windowResizeListener);
</del><ins>+        popover.content = content;
</ins><span class="cx"> 
</span><del>-        popover.content = content;
</del><ins>+        popover.windowResizeHandler = presentPopoverOverTargetElement;
</ins><span class="cx">         presentPopoverOverTargetElement();
</span><span class="cx"> 
</span><span class="cx">         // CodeMirror needs a refresh after the popover displays, to layout, otherwise it doesn't appear.
</span><span class="lines">@@ -391,8 +389,6 @@
</span><span class="cx">                 this._addWatchExpression(expression);
</span><span class="cx">         }
</span><span class="cx"> 
</span><del>-        window.removeEventListener(&quot;resize&quot;, this._windowResizeListener);
-        this._windowResizeListener = null;
</del><span class="cx">         this._codeMirror = null;
</span><span class="cx">     }
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineDataGridjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -57,8 +57,6 @@
</span><span class="cx">         this.addEventListener(WebInspector.DataGrid.Event.SelectedNodeChanged, this._dataGridSelectedNodeChanged, this);
</span><span class="cx">         this.addEventListener(WebInspector.DataGrid.Event.SortChanged, this._sort, this);
</span><span class="cx"> 
</span><del>-        window.addEventListener(&quot;resize&quot;, this);
-
</del><span class="cx">         this.columnChooserEnabled = true;
</span><span class="cx">     }
</span><span class="cx"> 
</span><span class="lines">@@ -124,11 +122,6 @@
</span><span class="cx">         this._hidePopover();
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    closed()
-    {
-        window.removeEventListener(&quot;resize&quot;, this);
-    }
-
</del><span class="cx">     treeElementForDataGridNode(dataGridNode)
</span><span class="cx">     {
</span><span class="cx">         if (!this._treeOutlineDataGridSynchronizer)
</span><span class="lines">@@ -193,13 +186,6 @@
</span><span class="cx"> 
</span><span class="cx">     // Protected
</span><span class="cx"> 
</span><del>-    handleEvent(event)
-    {
-        console.assert(event.type === &quot;resize&quot;);
-
-        this._windowResized(event);
-    }
-
</del><span class="cx">     dataGridNodeNeedsRefresh(dataGridNode)
</span><span class="cx">     {
</span><span class="cx">         if (!this._dirtyDataGridNodes)
</span><span class="lines">@@ -441,12 +427,6 @@
</span><span class="cx">         this._showPopoverForSelectedNodeSoon();
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    _windowResized(event)
-    {
-        if (this._popover &amp;&amp; this._popover.visible)
-            this._updatePopoverForSelectedNode(false);
-    }
-
</del><span class="cx">     _showPopoverForSelectedNodeSoon()
</span><span class="cx">     {
</span><span class="cx">         if (this._showPopoverTimeout)
</span><span class="lines">@@ -453,8 +433,10 @@
</span><span class="cx">             return;
</span><span class="cx"> 
</span><span class="cx">         this._showPopoverTimeout = setTimeout(() =&gt; {
</span><del>-            if (!this._popover)
</del><ins>+            if (!this._popover) {
</ins><span class="cx">                 this._popover = new WebInspector.Popover;
</span><ins>+                this._popover.windowResizeHandler = () =&gt; { this._updatePopoverForSelectedNode(false); };
+            }
</ins><span class="cx">             this._updatePopoverForSelectedNode(true);
</span><span class="cx">             this._showPopoverTimeout = undefined;
</span><span class="cx">         }, WebInspector.TimelineDataGrid.DelayedPopoverShowTimeout);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsVisualStylePropertyEditorjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/VisualStylePropertyEditor.js (204263 => 204264)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/VisualStylePropertyEditor.js        2016-08-08 20:30:29 UTC (rev 204263)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/VisualStylePropertyEditor.js        2016-08-08 20:56:35 UTC (rev 204264)
</span><span class="lines">@@ -601,6 +601,10 @@
</span><span class="cx">         let popover = new WebInspector.Popover(this);
</span><span class="cx">         popover.content = propertyInfoElement;
</span><span class="cx">         popover.present(bounds.pad(2), [WebInspector.RectEdge.MIN_Y]);
</span><ins>+        popover.windowResizeHandler = () =&gt; {
+            let bounds = WebInspector.Rect.rectFromClientRect(this._titleElement.getBoundingClientRect());
+            popover.present(bounds.pad(2), [WebInspector.RectEdge.MIN_Y]);
+        };
</ins><span class="cx">     }
</span><span class="cx"> 
</span><span class="cx">     _toggleTabbingOfSelectableElements(disabled)
</span></span></pre>
</div>
</div>

</body>
</html>