Bug 1375335 - Fix window control height calculation on Windows 10. r=dao

This commit:

- Makes the window controls have exactly the same height as tabs when the
  menubar is hidden, and have the same height as the menubar when it is shown.
  This requires us to remove the menubar height before flushing layout in
  case it is shown, since we need its original height for the calculation.

- Removes the top margin between the menu bar and the window border
  that was present on Windows 10 and makes it apply on Windows 7 only.
  The border was causing miscalculations of the window control height,
  which could have been handled in browser-tabsintitlebar.js, but since
  it's not part of the Photon spec we decide to remove it entirely.

- Makes window control height calculations ignore vertical tabs toolbar
  margins. The only margin it has right now is -1px and the calculation
  code doesn't work right with negative margins.

MozReview-Commit-ID: HJXxUUJFX8x

--HG--
extra : rebase_source : fdb5db7e5b410cb45cef054d5cbec41048211f75

browser/base/content/browser-tabsintitlebar.js

@@ -148,13 +148,19 @@ var TabsInTitlebar = {
       document.documentElement.setAttribute("tabsintitlebar", "true");
       updateTitlebarDisplay();
 
+      // Reset the custom titlebar height if the menubar is shown,
+      // because we will want to calculate its original height.
+      if (AppConstants.isPlatformAndVersionAtLeast("win", "10.0") &&
+          (menubar.getAttribute("inactive") != "true" ||
+          menubar.getAttribute("autohide") != "true")) {
+        $("titlebar-buttonbox").style.removeProperty("height");
+      }
+
       // Try to avoid reflows in this code by calculating dimensions first and
       // then later set the properties affecting layout together in a batch.
 
-      // Get the full height of the tabs toolbar:
-      let tabsToolbar = $("TabsToolbar");
-      let tabsStyles = window.getComputedStyle(tabsToolbar);
-      let fullTabsHeight = rect(tabsToolbar).height + verticalMargins(tabsStyles);
+      // Get the height of the tabs toolbar:
+      let tabsHeight = rect($("TabsToolbar")).height;
       // Buttons first:
       let captionButtonsBoxWidth = rect($("titlebar-buttonbox-container")).width;
 
@@ -176,12 +182,12 @@ var TabsInTitlebar = {
 
       // Begin setting CSS properties which will cause a reflow
 
+      // On Windows 10, adjust the window controls to span the entire
+      // tab strip height if we're not showing a menu bar.
       if (AppConstants.isPlatformAndVersionAtLeast("win", "10.0")) {
-        if (!menuHeight && window.windowState == window.STATE_MAXIMIZED) {
-          titlebarContentHeight = Math.max(titlebarContentHeight, fullTabsHeight);
+        if (!menuHeight) {
+          titlebarContentHeight = tabsHeight;
           $("titlebar-buttonbox").style.height = titlebarContentHeight + "px";
-        } else {
-          $("titlebar-buttonbox").style.removeProperty("height");
         }
       }
 
@@ -214,7 +220,7 @@ var TabsInTitlebar = {
 
       // Next, we calculate how much we need to stretch the titlebar down to
       // go all the way to the bottom of the tab strip, if necessary.
-      let tabAndMenuHeight = fullTabsHeight + fullMenuHeight;
+      let tabAndMenuHeight = tabsHeight + fullMenuHeight;
 
       if (tabAndMenuHeight > titlebarContentHeight) {
         // We need to increase the titlebar content's outer height (ie including margins)

browser/base/content/test/performance/browser_windowopen_reflows.js

@@ -52,16 +52,6 @@ if (Services.appinfo.OS == "Darwin") {
 
 if (Services.appinfo.OS == "WINNT") {
   EXPECTED_REFLOWS.push(
-    {
-      stack: [
-        "verticalMargins@chrome://browser/content/browser-tabsintitlebar.js",
-        "_update@chrome://browser/content/browser-tabsintitlebar.js",
-        "init@chrome://browser/content/browser-tabsintitlebar.js",
-        "handleEvent@chrome://browser/content/tabbrowser.xml",
-      ],
-      times: 2, // This number should only ever go down - never up.
-    },
-
     {
       stack: [
         "handleEvent@chrome://browser/content/tabbrowser.xml",

browser/themes/windows/browser-aero.css

@@ -7,9 +7,11 @@
 %define glassActiveBorderColor rgb(37, 44, 51)
 %define glassInactiveBorderColor rgb(102, 102, 102)
 
-@media not all and (-moz-windows-classic) {
-  #main-window[sizemode="normal"] > #tab-view-deck > #browser-panel > #navigator-toolbox > #toolbar-menubar {
-    margin-top: 1px;
+@media (-moz-os-version: windows-win7) {
+  @media not all and (-moz-windows-classic) {
+    #main-window[sizemode="normal"] > #tab-view-deck > #browser-panel > #navigator-toolbox > #toolbar-menubar {
+      margin-top: 1px;
+    }
   }
 }
 
@@ -81,16 +83,11 @@
       .titlebar-button {
         border: none;
         margin: 0 !important;
-        padding: 10px 17px;
+        padding: 8px 17px;
         -moz-context-properties: stroke;
         stroke: var(--titlebar-text-color);
       }
 
-      :root[sizemode=maximized] .titlebar-button {
-        padding-top: 8px;
-        padding-bottom: 8px;
-      }
-
       .titlebar-button > .toolbarbutton-icon {
         width: 12px;
         height: 12px;