[Australis] Backed out changeset da8776bc458e (bug 962677) for mochitest-bc failures.

browser/base/content/browser.css

@@ -896,15 +896,13 @@ chatbox:-moz-full-screen-ancestor > .chat-titlebar {
 }
 
 /* Customize mode */
-#navigator-toolbox > toolbar:not(#TabsToolbar),
-#content-deck {
-  transition-property: margin-left, margin-right;
+#tab-view-deck {
+  transition-property: padding;
   transition-duration: 150ms;
   transition-timing-function: ease-out;
 }
 
-#tab-view-deck[fastcustomizeanimation] #navigator-toolbox > toolbar:not(#TabsToolbar),
-#tab-view-deck[fastcustomizeanimation] #content-deck {
+#tab-view-deck[fastcustomizeanimation] {
   transition-duration: 1ms;
   transition-timing-function: linear;
 }

browser/base/content/browser.js

@@ -4359,6 +4359,8 @@ var TabsInTitlebar = {
     this._menuObserver = new MutationObserver(this._onMenuMutate);
     this._menuObserver.observe(menu, {attributes: true});
 
+    gNavToolbox.addEventListener("customization-transitionend", this);
+
     this.onAreaReset = function(aArea) {
       if (aArea == CustomizableUI.AREA_TABSTRIP || aArea == CustomizableUI.AREA_MENUBAR)
         this._update(true);
@@ -4405,6 +4407,12 @@ var TabsInTitlebar = {
       this._readPref();
   },
 
+  handleEvent: function(ev) {
+    if (ev.type == "customization-transitionend") {
+      this._update(true);
+    }
+  },
+
   _onMenuMutate: function (aMutations) {
     for (let mutation of aMutations) {
       if (mutation.attributeName == "inactive" ||

browser/components/customizableui/src/CustomizeMode.jsm

@@ -427,30 +427,26 @@ CustomizeMode.prototype = {
    */
   _doTransition: function(aEntering) {
     let deferred = Promise.defer();
-    let deck = this.document.getElementById("content-deck");
+    let deck = this.document.getElementById("tab-view-deck");
 
     let customizeTransitionEnd = function(aEvent) {
       if (aEvent != "timedout" &&
-          (aEvent.originalTarget != deck || aEvent.propertyName != "margin-left")) {
+          (aEvent.originalTarget != deck || aEvent.propertyName != "padding-bottom")) {
         return;
       }
       this.window.clearTimeout(catchAllTimeout);
-      // Bug 962677: We let the event loop breathe for before we do the final
-      // stage of the transition to improve perceived performance.
-      this.window.setTimeout(function () {
-        deck.removeEventListener("transitionend", customizeTransitionEnd);
+      deck.removeEventListener("transitionend", customizeTransitionEnd);
 
-        if (!aEntering) {
-          this.document.documentElement.removeAttribute("customize-exiting");
-          this.document.documentElement.removeAttribute("customizing");
-        } else {
-          this.document.documentElement.setAttribute("customize-entered", true);
-          this.document.documentElement.removeAttribute("customize-entering");
-        }
-        this.dispatchToolboxEvent("customization-transitionend", aEntering);
+      if (!aEntering) {
+        this.document.documentElement.removeAttribute("customize-exiting");
+        this.document.documentElement.removeAttribute("customizing");
+      } else {
+        this.document.documentElement.setAttribute("customize-entered", true);
+        this.document.documentElement.removeAttribute("customize-entering");
+      }
+      this.dispatchToolboxEvent("customization-transitionend", aEntering);
 
-        deferred.resolve();
-      }.bind(this), 0);
+      deferred.resolve();
     }.bind(this);
     deck.addEventListener("transitionend", customizeTransitionEnd);
 

browser/themes/linux/browser.css

@@ -1921,6 +1921,10 @@ chatbox {
   background-attachment: fixed;
 }
 
+#main-window:-moz-any([customize-entering],[customize-entered]) #tab-view-deck {
+  padding: 0 2em 2em;
+}
+
 #main-window[customize-entered] #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar),
 #main-window[customize-entered] #customization-container {
   border: 3px solid hsla(0,0%,0%,.1);
@@ -1943,11 +1947,6 @@ chatbox {
   border-left: 3px solid transparent;
 }
 
-#main-window[customizing] #TabsToolbar::after {
-  margin-left: 2em;
-  margin-right: 2em;
-}
-
 /* End customization mode */
 
 

browser/themes/osx/browser.css

@@ -2609,7 +2609,7 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
 /*
  * Draw the bottom border of the tabstrip when core doesn't do it for us:
  */
-#main-window:-moz-any([privatebrowsingmode=temporary],[sizemode="fullscreen"],[customize-entered]) #TabsToolbar::after,
+#main-window:-moz-any([privatebrowsingmode=temporary],[sizemode="fullscreen"],[customizing],[customize-exiting]) #TabsToolbar::after,
 #main-window:not([tabsintitlebar]) #TabsToolbar::after,
 #TabsToolbar:-moz-lwtheme::after {
   content: '';
@@ -4023,9 +4023,8 @@ window > chatbox {
   padding-top: 0;
 }
 
-#main-window[tabsintitlebar][customize-entered] #titlebar-content {
-  margin-bottom: 0px !important;
-  margin-top: 11px !important;
+#main-window:-moz-any([customize-entering],[customize-entered]) #tab-view-deck {
+  padding: 0 2em 2em;
 }
 
 #main-window[customize-entered] #tab-view-deck {
@@ -4072,12 +4071,6 @@ window > chatbox {
   }
 }
 
-#main-window[customizing] #navigator-toolbox::after,
-#main-window[customize-entered] #TabsToolbar::after {
-  margin-left: 2em;
-  margin-right: 2em;
-}
-
 /* End customization mode */
 
 #main-window[privatebrowsingmode=temporary] {

browser/themes/shared/customizableui/customizeMode.inc.css

@@ -3,16 +3,6 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 /* Customization mode */
-
-#main-window:-moz-any([customize-entering],[customize-entered]) #content-deck {
-  margin: 0 2em 2em;
-}
-
-#main-window:-moz-any([customize-entering],[customize-entered]) #navigator-toolbox > toolbar:not(#TabsToolbar) {
-  margin-left: 2em;
-  margin-right: 2em;
-}
-
 #main-window:-moz-any([customize-entering],[customize-exiting]) #tab-view-deck {
   pointer-events: none;
 }

browser/themes/windows/browser-aero.css

@@ -261,7 +261,7 @@
   }
 
   /* Need to constrain the glass fog to avoid overlapping layers, see bug 886281. */
-  #navigator-toolbox:not(:-moz-lwtheme) {
+  #main-window:not([customizing]) #navigator-toolbox:not(:-moz-lwtheme) {
     overflow: -moz-hidden-unscrollable;
   }
 

browser/themes/windows/browser.css

@@ -1479,7 +1479,7 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
   padding: 0;
 }
 
-#main-window:not([customizing]) #TabsToolbar:not(:-moz-lwtheme) {
+#TabsToolbar:not(:-moz-lwtheme) {
   background-image: linear-gradient(to top, @toolbarShadowColor@ 2px, rgba(0,0,0,.05) 2px, transparent 50%);
 }
 
@@ -2441,17 +2441,16 @@ chatbox {
   background-attachment: fixed;
 }
 
+#main-window:-moz-any([customize-entering],[customize-entered]) #tab-view-deck {
+  padding: 0 2em 2em;
+}
+
 #customization-container {
   border-left: 1px solid @toolbarShadowColor@;
   border-right: 1px solid @toolbarShadowColor@;
   background-clip: padding-box;
 }
 
-#main-window[customizing] #navigator-toolbox::after {
-  margin-left: 2em;
-  margin-right: 2em;
-}
-
 /* End customization mode */
 
 #main-window[privatebrowsingmode=temporary] #TabsToolbar::after {