Bug 628732 - Hitting Android Back in Awesome list opens right panel [r=mfinkle]

mobile/chrome/content/tabs.xml

@@ -187,8 +187,10 @@
           <![CDATA[
             let container = this.parentNode.getBoundingClientRect();
             let element   = this.children.getBoundingClientRect();
+            let undo = this._tabsUndo.getBoundingClientRect();
+            let lastChild = this.parentNode.lastChild.getBoundingClientRect();
             
-            let height = (element.top - container.top) + ((container.top + container.height) - (element.top + element.height));
+            let height = window.innerHeight - element.top - (undo.bottom - undo.top) - (lastChild.top - element.bottom) - lastChild.height;
             this.children.style.height = height + "px";
 
             this._updateWidth();
@@ -205,8 +207,10 @@
             let firstBox = this.children.firstChild.getBoundingClientRect();
             let lastBox = this.children.lastChild.getBoundingClientRect();
 
-            // XXX we can do better than using a constant here
-            let columnsCount = Math.ceil(this.children.childNodes.length / Math.floor(this.children.getBoundingClientRect().height / (firstBox.height + 4)));
+            // We can't rely on getBoundingClientRect() for this.children height
+            // it is not synced (sometimes, especially during resize) with the 
+            // style.height rule
+            let columnsCount = Math.ceil(this.children.childNodes.length / Math.floor(parseInt(this.children.style.height) / (firstBox.height + 4)));
             if (this._columnsCount != columnsCount && window.innerWidth > 1) { // > 1 to ignore column resizing while the main window is loading
               this.children.style.width = (columnsCount * (COLUMN_MARGIN + firstBox.width)) + "px";
               this._columnsCount = columnsCount;

mobile/chrome/tests/browser_sidebars.js

@@ -20,6 +20,15 @@ function runNextTest() {
   }
 }
 
+function waitForNavigationPanel(aCallback, aWaitForHide) {
+  let evt = aWaitForHide ? "NavigationPanelHidden" : "NavigationPanelShown";
+  info("waitFor " + evt + "(" + Components.stack.caller + ")");
+  window.addEventListener(evt, function(aEvent) {
+    info("receive " + evt);
+    window.removeEventListener(aEvent.type, arguments.callee, false);
+    Util.executeSoon(aCallback);
+  }, false);
+}
 
 //------------------------------------------------------------------------------
 // Entry point (must be named "test")
@@ -38,27 +47,35 @@ function test() {
 
 function checkSidebars(aLeftVisible, aRightVisible) {
   let [leftVisibility, rightVisibility, leftWidth, rightWidth] = Browser.computeSidebarVisibility();
-  ok(Math.abs(leftVisibility - aLeftVisible) < 0.2, (leftWidth * aLeftVisible) + "px of the left sidebar should be visible");
-  ok(Math.abs(rightVisibility - aRightVisible) < 0.2, (rightWidth * aRightVisible) + "px of the right sidebar should be visible");
+  let left = Math.abs(leftVisibility - aLeftVisible),
+      right = Math.abs(rightVisibility - aRightVisible);
+  ok(left < 0.2, (leftWidth * aLeftVisible) + "px of the left sidebar should be visible (got " + left + ")");
+  ok(right < 0.2, (rightWidth * aRightVisible) + "px of the right sidebar should be visible (got " + right + ")");
 }
 
 function checkOnResize(aCallback) {
   let [leftVisibility, rightVisibility, leftWidth, rightWidth] = Browser.computeSidebarVisibility();
+  let oldLeftWidth = leftWidth;
 
-  window.addEventListener("resize", function() {
-    window.removeEventListener("resize", arguments.callee, false);
-    setTimeout(function() {
+  Elements.browsers.addEventListener("SizeChanged", function() {
+    Elements.browsers.removeEventListener("SizeChanged", arguments.callee, false);
+    setTimeout(function() { Util.executeSoon(function() {
       checkSidebars(leftVisibility, rightVisibility);
-      window.addEventListener("resize", function() {
-        window.removeEventListener("resize", arguments.callee, false);
+
+      Elements.browsers.addEventListener("SizeChanged", function() {
+        Elements.browsers.removeEventListener("SizeChanged", arguments.callee, false);
+
         setTimeout(function() {
           checkSidebars(leftVisibility, rightVisibility);
+          let [, , newLeftWidth, newRightWidth] = Browser.computeSidebarVisibility();
+          is(oldLeftWidth, newLeftWidth, "Size should be the same than the size before resizing");
           aCallback();
         }, 0);
       }, false);
       window.resizeTo(800, 480);
-    }, 0);
-  }, false);
+    }); }, 0)} 
+  , false);
+
   window.resizeTo(480, 800);
 }
 
@@ -96,6 +113,7 @@ gTests.push({
     newTabs.push(Browser.addTab(testURL_01, true));
     newTabs.push(Browser.addTab(testURL_01, true));
     newTabs.push(Browser.addTab(testURL_01, true));
+    newTabs.push(Browser.addTab(testURL_01, true));
     let tabs = document.getElementById("tabs");
     ok(tabs._columnsCount > 1, "Tabs layout should be on multiple columns");
 
@@ -113,9 +131,46 @@ gTests.push({
     let [,, leftWidth, rightWidth] = Browser.computeSidebarVisibility();
     Browser.controlsScrollboxScroller.scrollTo(leftWidth + rightWidth, 0);
     checkSidebars(0, 1);
-    checkOnResize(function() {
-      Browser.hideSidebars();
-      runNextTest();
-    });
+    checkOnResize(gCurrentTest.onFinish);
+  },
+
+  onFinish: function() {
+    Browser.hideSidebars();
+    runNextTest();
   }
 });
+
+gTests.push({
+  desc: "Testing horizontal positionning of the sidebars for multiple columns with awesome screen open",
+
+  run: function() {
+    let tabs = document.getElementById("tabs");
+    ok(tabs._columnsCount > 1, "Tabs layout should be on multiple columns");
+
+    checkSidebars(0, 0);
+    waitForNavigationPanel(function() {
+      checkOnResize(gCurrentTest.checkLeftVisible);
+    });
+    AllPagesList.doCommand();
+  },
+
+
+  checkLeftVisible: function() {
+    Browser.controlsScrollboxScroller.scrollTo(0, 0);
+    checkSidebars(1, 0);
+    checkOnResize(gCurrentTest.checkRightVisible);
+  },
+
+  checkRightVisible: function() {
+    let [,, leftWidth, rightWidth] = Browser.computeSidebarVisibility();
+    Browser.controlsScrollboxScroller.scrollTo(leftWidth + rightWidth, 0);
+    checkSidebars(0, 1);
+    checkOnResize(gCurrentTest.onFinish);
+  },
+
+  onFinish: function() {
+    Browser.hideSidebars();
+    runNextTest();
+  }
+});
+