Bug 686654 - "Almost stacked" group might switch between stacked and unstacked display r=dietrich

browser/base/content/tabview/groupitems.js

@@ -492,15 +492,15 @@ GroupItem.prototype = Utils.extend(new Item(), new Subscribable(), {
   //   options - an object with additional parameters, see below
   //
   // Possible options:
-  //   forceStacked - true to force content bounds for stacked mode
+  //   stacked - true to get content bounds for stacked mode
   getContentBounds: function GroupItem_getContentBounds(options) {
-    var box = this.getBounds();
-    var titleHeight = this.$titlebar.height();
+    let box = this.getBounds();
+    let titleHeight = this.$titlebar.height();
     box.top += titleHeight;
     box.height -= titleHeight;
 
     let appTabTrayContainer = iQ(this.$appTabTray[0].parentNode);
-    var appTabTrayWidth = appTabTrayContainer.width();
+    let appTabTrayWidth = appTabTrayContainer.width();
     if (appTabTrayWidth)
       appTabTrayWidth += parseInt(appTabTrayContainer.css(UI.rtl ? "left" : "right"));
 
@@ -513,9 +513,8 @@ GroupItem.prototype = Utils.extend(new Item(), new Subscribable(), {
     // themeable --OR-- compute this from actual bounds. Bug 586546
     box.inset(6, 6);
 
-    // make some room for the expand button if we're stacked
-    let isStacked = (options && options.forceStacked) || this.isStacked();
-    if (isStacked)
+    // make some room for the expand button in stacked mode
+    if (options && options.stacked)
       box.height -= this.$expander.height() + 9; // the button height plus padding
 
     return box;
@@ -1296,8 +1295,8 @@ GroupItem.prototype = Utils.extend(new Item(), new Subscribable(), {
     if (count <= 1)
       return false;
 
-    var bb = this.getContentBounds();
-    var options = {
+    let bb = this.getContentBounds();
+    let options = {
       return: 'widthAndColumns',
       count: count || this._children.length,
       hideTitle: false
@@ -1403,7 +1402,7 @@ GroupItem.prototype = Utils.extend(new Item(), new Subscribable(), {
       GroupItems.pushArrange(this, options);
       return false;
     }
-    
+
     let shouldStack = this.shouldStack(childrenToArrange.length + (options.addTab ? 1 : 0));
     let shouldStackArrange = (shouldStack && !this.expanded);
     let box;
@@ -1411,12 +1410,12 @@ GroupItem.prototype = Utils.extend(new Item(), new Subscribable(), {
     // if we should stack and we're not expanded
     if (shouldStackArrange) {
       this.showExpandControl();
-      box = this.getContentBounds({forceStacked: true});
+      box = this.getContentBounds({stacked: true});
       this._stackArrange(childrenToArrange, box, options);
       return false;
     } else {
       this.hideExpandControl();
-      box = this.getContentBounds({forceStacked: false});
+      box = this.getContentBounds();
       // a dropIndex is returned
       return this._gridArrange(childrenToArrange, box, options);
     }

browser/base/content/test/tabview/Makefile.in

@@ -158,6 +158,7 @@ _BROWSER_FILES = \
                  browser_tabview_bug677310.js \
                  browser_tabview_bug679853.js \
                  browser_tabview_bug681599.js \
+                 browser_tabview_bug686654.js \
                  browser_tabview_click_group.js \
                  browser_tabview_dragdrop.js \
                  browser_tabview_exit_button.js \

browser/base/content/test/tabview/browser_tabview_bug686654.js

@@ -0,0 +1,46 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+function test() {
+  waitForExplicitFinish();
+
+  newWindowWithTabView(function(win) {
+    let cw = win.TabView.getContentWindow();
+    let groupItem = cw.GroupItems.groupItems[0];
+
+    // set the group to 180 x 100 so it shows two tab items without going into
+    // the stacked mode
+    groupItem.setBounds(new cw.Rect(100, 0, 180, 100));
+
+    hideTabView(function() {
+      groupItem.addSubscriber("childAdded", function onChildAdded(data) {
+        groupItem.removeSubscriber("childAdded", onChildAdded);
+
+        is(groupItem.getChildren().length, 3, "The number of children in group is 3");
+        ok(groupItem.isStacked(), "The group item is stacked after adding a new tab");
+
+        let tabItem = groupItem.getChild(2);
+        groupItem.addSubscriber("childRemoved", function onChildRemoved() {
+          tabItem.removeSubscriber("childRemoved", onChildRemoved);
+
+          is(groupItem.getChildren().length, 2, "The number of children in group is 2");
+          // give a delay for the active item to be set
+          executeSoon(function() {
+            showTabView(function() {
+              ok(!groupItem.isStacked(), "The group item is not stacked after removing a tab");
+              finish();
+            }, win);
+          });
+        });
+        win.BrowserCloseTabOrWindow();
+      });
+      win.gBrowser.loadOneTab("", {inBackground: true});
+    }, win);
+  }, function(win) {
+    registerCleanupFunction(function () {
+      win.close();
+    });
+
+    win.gBrowser.addTab();
+  });
+}