Changeset 125005 in webkit

Timestamp:

Aug 8, 2012, 12:39:14 AM (13 years ago)

Author:

vsevik@chromium.org

Message:

Web Inspector: TabbedPane should use floating point width values for measuring.
​https://bugs.webkit.org/show_bug.cgi?id=93349

Reviewed by Pavel Feldman.

TabbedPane now uses getBoundingClientRect().width instead of offsetWidth for more precise calculation.

• inspector/front-end/TabbedPane.js:

(WebInspector.TabbedPane.prototype._totalWidth):
(WebInspector.TabbedPane.prototype._updateTabsDropDown):
(WebInspector.TabbedPane.prototype._measureDropDownButton):
(WebInspector.TabbedPane.prototype._updateWidths):
(WebInspector.TabbedPaneTab.prototype._measure):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/TabbedPane.js (modified) (4 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2012-08-07  Vsevolod Vlasov  <vsevik@chromium.org>
+
+        Web Inspector: TabbedPane should use floating point width values for measuring.
+        https://bugs.webkit.org/show_bug.cgi?id=93349
+
+        Reviewed by Pavel Feldman.
+
+        TabbedPane now uses getBoundingClientRect().width instead of offsetWidth for more precise calculation.
+
+        * inspector/front-end/TabbedPane.js:
+        (WebInspector.TabbedPane.prototype._totalWidth):
+        (WebInspector.TabbedPane.prototype._updateTabsDropDown):
+        (WebInspector.TabbedPane.prototype._measureDropDownButton):
+        (WebInspector.TabbedPane.prototype._updateWidths):
+        (WebInspector.TabbedPaneTab.prototype._measure):
+
 2012-08-08  Douglas Stockwell  <dstockwell@chromium.org>
 

trunk/Source/WebCore/inspector/front-end/TabbedPane.js

@@ -305 +305 @@
     },
 
+    _totalWidth: function()
+    {
+        return this._headerContentsElement.getBoundingClientRect().width;
+    },
+
     _updateTabsDropDown: function()
     {
-        var tabsToShowIndexes = this._tabsToShowIndexes(this._tabs, this._tabsHistory, this._headerContentsElement.offsetWidth, this._measuredDropDownButtonWidth);
+        var tabsToShowIndexes = this._tabsToShowIndexes(this._tabs, this._tabsHistory, this._totalWidth(), this._measuredDropDownButtonWidth);
 
         for (var i = 0; i < this._tabs.length; ++i) {
@@ -363 +368 @@
         this._dropDownButton.addStyleClass("measuring");
         this._headerContentsElement.appendChild(this._dropDownButton);
-        this._measuredDropDownButtonWidth = this._dropDownButton.offsetWidth;
+        this._measuredDropDownButtonWidth = this._dropDownButton.getBoundingClientRect().width;
         this._headerContentsElement.removeChild(this._dropDownButton);
         this._dropDownButton.removeStyleClass("measuring");
@@ -374 +379 @@
             measuredWidths.push(this._tabs[tabId].measuredWidth);
         
-        const roundingError = 5;
-        var maxWidth = this._calculateMaxWidth(measuredWidths, this._headerContentsElement.offsetWidth - 5);
+        var maxWidth = this._calculateMaxWidth(measuredWidths, this._totalWidth());
         
         for (var tabId in this._tabs) {
@@ -658 +662 @@
         var measuringTabElement = this._createTabElement(true);
         this._measureElement.appendChild(measuringTabElement);
-        this._measuredWidth = measuringTabElement.offsetWidth;
+        this._measuredWidth = measuringTabElement.getBoundingClientRect().width;
         this._measureElement.removeChild(measuringTabElement);
     },