author | Dão Gottwald <dao@mozilla.com> |
Tue, 24 Oct 2017 12:37:43 +0200 | |
changeset 387870 | f5121cba7d7b5031d69bcc7179c227c1858265a5 |
parent 387869 | 7d3f5015ac7e35796e6b3595e56d20cec64b9ff0 |
child 387872 | c41827492ec5321f2e10b5093010d108b3eeac37 |
push id | 53920 |
push user | dgottwald@mozilla.com |
push date | Tue, 24 Oct 2017 10:39:56 +0000 |
treeherder | autoland@f5121cba7d7b [default view] [failures only] |
perfherder | [talos] [build metrics] [platform microbench] (compared to previous push) |
reviewers | nhnt11 |
bugs | 1405542, 477157 |
milestone | 58.0a1 |
first release with | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
last release without | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
--- a/browser/base/content/browser-tabsintitlebar.js +++ b/browser/base/content/browser-tabsintitlebar.js @@ -155,19 +155,17 @@ var TabsInTitlebar = { 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 height of the tabs toolbar: - let tabsToolbar = $("TabsToolbar"); - let tabsStyles = window.getComputedStyle(tabsToolbar); - let fullTabsHeight = rect(tabsToolbar).height + verticalMargins(tabsStyles); + let fullTabsHeight = rect($("TabsToolbar")).height; // Buttons first: let captionButtonsBoxWidth = rect($("titlebar-buttonbox-container")).width; let secondaryButtonsWidth, menuHeight, fullMenuHeight, menuStyles; if (AppConstants.platform == "macosx") { secondaryButtonsWidth = rect($("titlebar-secondary-buttonbox")).width; // No need to look up the menubar stuff on OS X:
--- a/browser/base/content/test/performance/browser_windowopen_reflows.js +++ b/browser/base/content/test/performance/browser_windowopen_reflows.js @@ -70,26 +70,16 @@ if (Services.appinfo.OS == "WINNT") { }, ); } if (Services.appinfo.OS == "WINNT" || Services.appinfo.OS == "Darwin") { 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: [ "rect@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: 4, // This number should only ever go down - never up. }, );
--- a/browser/themes/linux/browser.css +++ b/browser/themes/linux/browser.css @@ -60,21 +60,19 @@ background-color: var(--toolbar-bgcolor); background-image: var(--toolbar-bgimage); color: var(--toolbar-color, inherit); -moz-appearance: none; border-style: none; } #TabsToolbar:not([collapsed="true"]) + #nav-bar { - border-top: 1px solid var(--tabs-border) !important; - background-clip: padding-box; - /* Position the toolbar above the bottom of background tabs */ + box-shadow: 0 calc(-1 * var(--tab-toolbar-navbar-overlap)) 0 var(--tabs-border); + /* This is needed for some toolbar button animations. Gross :( */ position: relative; - z-index: 1; } #nav-bar { padding-top: 2px; padding-bottom: 2px; } #browser-bottombox { @@ -535,17 +533,16 @@ html|span.ac-emphasize-text-url { #tabbrowser-tabs { /* override the global style to allow the selected tab to be above the nav-bar */ z-index: auto; } #TabsToolbar { min-height: 0; padding: 0; - margin-bottom: calc(-1 * var(--tab-toolbar-navbar-overlap)); } #TabsToolbar:not(:-moz-lwtheme) { -moz-appearance: menubar; color: -moz-menubartext; } #nav-bar {
--- a/browser/themes/osx/browser.css +++ b/browser/themes/osx/browser.css @@ -106,17 +106,17 @@ height: 22px; /* The native titlebar on OS X is 22px tall. */ } /** * For tabs in titlebar on OS X, we stretch the titlebar down so that the * tabstrip can overlap it. */ #main-window[tabsintitlebar] > #titlebar { - min-height: calc(var(--tab-min-height) + var(--space-above-tabbar) - var(--tab-toolbar-navbar-overlap)); + min-height: calc(var(--tab-min-height) + var(--space-above-tabbar)); } /** End titlebar **/ #main-window[chromehidden~="toolbar"][chromehidden~="location"][chromehidden~="directories"] { border-top: 1px solid rgba(0,0,0,0.65); } @@ -126,18 +126,17 @@ color: var(--toolbar-color, inherit); } /* Draw the bottom border of the tabs toolbar when it's not using -moz-appearance: toolbar. */ #main-window:-moz-any([sizemode="fullscreen"],[customize-entered]) #TabsToolbar:not([collapsed="true"]) + #nav-bar, #main-window:not([tabsintitlebar]) #TabsToolbar:not([collapsed="true"]) + #nav-bar, #TabsToolbar:not([collapsed="true"]) + #nav-bar:-moz-lwtheme { - border-top: 1px solid var(--tabs-border); - background-clip: padding-box; + box-shadow: 0 calc(-1 * var(--tab-toolbar-navbar-overlap)) 0 var(--tabs-border); /* Position the toolbar above the bottom of background tabs */ position: relative; z-index: 1; } /* Always draw a border on Yosemite to ensure the border is well-defined there * (the default border is too light). */ @media (-moz-mac-yosemite-theme) { @@ -806,18 +805,16 @@ html|span.ac-emphasize-text-url { .tabbrowser-tab:focus > .tab-stack > .tab-content > .tab-label-container:not([pinned]), .tabbrowser-tab:focus > .tab-stack > .tab-content > .tab-icon-image[pinned], .tabbrowser-tab:focus > .tab-stack > .tab-content > .tab-throbber[pinned] { box-shadow: var(--focus-ring-box-shadow); } #TabsToolbar { -moz-appearance: none; - /* overlap the nav-bar's top border */ - margin-bottom: calc(-1 * var(--tab-toolbar-navbar-overlap)); padding-top: var(--space-above-tabbar); } :root:not([customizing]):not([tabsintitlebar]):not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme) { -moz-appearance: toolbar; } #TabsToolbar:not(:-moz-lwtheme) {
--- a/browser/themes/windows/browser.css +++ b/browser/themes/windows/browser.css @@ -248,27 +248,26 @@ /* End classic titlebar gradient */ #main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) toolbarbutton:not(:-moz-lwtheme) { color: inherit; } } #TabsToolbar:not([collapsed="true"]) + #nav-bar { - /* Position the toolbar above the bottom of background tabs */ + /* This is needed for some toolbar button animations. Gross :( */ position: relative; - z-index: 1; } #nav-bar { - border-top: 1px solid var(--tabs-border) !important; + box-shadow: 0 calc(-1 * var(--tab-toolbar-navbar-overlap)) 0 var(--tabs-border); } @media (-moz-windows-compositor: 0) { #TabsToolbar[collapsed="true"] + #nav-bar { - border-top-style: none !important; + box-shadow: none; } } #print-preview-toolbar:not(:-moz-lwtheme) { -moz-appearance: toolbox; } #browser-bottombox:not(:-moz-lwtheme) { @@ -772,17 +771,16 @@ html|span.ac-emphasize-text-url { text-shadow: none; } /* Tabstrip */ #TabsToolbar { min-height: 0; padding: 0; - margin-bottom: calc(-1 * var(--tab-toolbar-navbar-overlap)); /* overlap the nav-bar's top border */ } %include ../shared/tabs.inc.css /* tabbrowser-tab focus ring */ .tabbrowser-tab:focus > .tab-stack > .tab-content { outline: 1px dotted; outline-offset: -6px;