Bug 663612 - clicking a group should zoom into the group's active tab; r=sdwilsh, ui-r=limi

browser/base/content/tabview/groupitems.js

@@ -1660,9 +1660,46 @@ GroupItem.prototype = Utils.extend(new Item(), new Subscribable(), {
   // Helper routine for the constructor; adds various event handlers to the container.
   _addHandlers: function GroupItem__addHandlers(container) {
     let self = this;
+    let lastMouseDownTarget;
 
-    var dropIndex = false;
-    var dropSpaceTimer = null;
+    container.mousedown(function(e) {
+      let target = e.target;
+      // only set the last mouse down target if it is a left click, not on the
+      // close button, not on the new tab button, not on the title bar and its
+      // element
+      if (Utils.isLeftClick(e) &&
+          self.$closeButton[0] != target &&
+          self.$ntb[0] != target &&
+          self.$titlebar[0] != target &&
+          !self.$titlebar.contains(target) &&
+          !self.$appTabTray.contains(target)) {
+        lastMouseDownTarget = target;
+      } else {
+        lastMouseDownTarget = null;
+      }
+    });
+    container.mouseup(function(e) {
+      let same = (e.target == lastMouseDownTarget);
+      lastMouseDownTarget = null;
+
+      if (same && !self.isDragging) {
+        if (gBrowser.selectedTab.pinned &&
+            UI.getActiveTab() != self.getActiveTab() &&
+            self.getChildren().length > 0) {
+          UI.setActive(self, { dontSetActiveTabInGroup: true });
+          UI.goToTab(gBrowser.selectedTab);
+        } else {
+          let tabItem = self.getTopChild();
+          if (tabItem)
+            tabItem.zoomIn();
+          else
+            self.newTab();
+        }
+      }
+    });
+
+    let dropIndex = false;
+    let dropSpaceTimer = null;
 
     // When the _dropSpaceActive flag is turned on on a group, and a tab is
     // dragged on top, a space will open up.

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

@@ -150,6 +150,7 @@ _BROWSER_FILES = \
                  browser_tabview_bug663421.js \
                  browser_tabview_bug665502.js \
                  browser_tabview_bug669694.js \
+                 browser_tabview_click_group.js \
                  browser_tabview_dragdrop.js \
                  browser_tabview_exit_button.js \
                  browser_tabview_expander.js \

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

@@ -65,11 +65,6 @@ function test() {
     simulateDoubleClick(container, 2);
     assertNumberOfTabs(1);
 
-    // simulate double click with left mouse button
-    let container = groupItem.container;
-    simulateDoubleClick(container);
-    assertNumberOfTabs(1);
-
     groupItem.close();
     hideTabView(finishTest);
   }

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

@@ -0,0 +1,68 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+let contentWindow;
+let groupItem;
+let groupItemId;
+
+function test() {
+  waitForExplicitFinish();
+
+  registerCleanupFunction(function() {
+    contentWindow.gPrefBranch.clearUserPref("animate_zoom");
+    let createdGroupItem = contentWindow.GroupItems.groupItem(groupItemId)
+    if (createdGroupItem)
+      closeGroupItem(createdGroupItem, function() {});
+    hideTabView(function() {});
+  });
+
+  showTabView(function() {
+    contentWindow = TabView.getContentWindow();
+    groupItem = createEmptyGroupItem(contentWindow, 300, 300, 200);
+    groupItemId = groupItem.id;
+    testMouseClickOnEmptyGroupItem();
+  });
+}
+
+function testMouseClickOnEmptyGroupItem() {
+  whenTabViewIsHidden(function() {
+    is(groupItem.getChildren().length, 1, "The group item contains one tab item now");
+    showTabView(testDraggingWithinGroupItem);
+  });
+  is(groupItem.getChildren().length, 0, "The group item doesn't contain any tab items");
+  EventUtils.sendMouseEvent({ type: "mousedown" }, groupItem.container, contentWindow);
+  EventUtils.sendMouseEvent({ type: "mouseup" }, groupItem.container, contentWindow);
+}
+
+function testDraggingWithinGroupItem() {
+  let target = groupItem.container;
+  contentWindow.gPrefBranch.setBoolPref("animate_zoom", false);
+
+  // stimulate drag and drop
+  EventUtils.sendMouseEvent( {type: "mousedown" }, target, contentWindow);
+  EventUtils.synthesizeMouse(target, 10, 10, { type: "mousemove" }, contentWindow);
+  ok(groupItem.isDragging, "The group item is being dragged")
+
+  EventUtils.sendMouseEvent({ type: "mouseup" }, target, contentWindow);
+  ok(!groupItem.isDragging, "The dragging is competely");
+
+  executeSoon(function() {
+    ok(TabView.isVisible(), "The tab view is still visible after dragging");
+    contentWindow.gPrefBranch.clearUserPref("animate_zoom");
+
+    testMouseClickOnGroupItem();
+  });
+}
+
+function testMouseClickOnGroupItem() {
+  whenTabViewIsHidden(function() {
+    is(groupItem.getChildren().length, 1, "The group item still contains one tab item");
+
+    closeGroupItem(groupItem, function() {
+      hideTabView(finish);
+    });
+  });
+  EventUtils.sendMouseEvent({ type: "mousedown" }, groupItem.container, contentWindow);
+  EventUtils.sendMouseEvent({ type: "mouseup" }, groupItem.container, contentWindow);
+}
+

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

@@ -31,21 +31,26 @@ function test() {
     let transitioned = 0;
 
     let initCallback = function() {
-      tabViewWindow = win.TabView._window;
+      tabViewWindow = win.TabView.getContentWindow();
       function onTransitionEnd(event) {
         transitioned++;
         info(transitioned);
       }
       tabViewWindow.document.addEventListener("transitionend", onTransitionEnd, false);
 
-      showTabView(function() {
+      // don't use showTabView() here because we only want to check whether 
+      // zoom out animation happens. Other animations would happen before
+      // the callback as waitForFocus() was added to showTabView() in head.js
+      let onTabViewShown = function() {
+        tabViewWindow.removeEventListener("tabviewshown", onTabViewShown, false);
+        tabViewWindow.document.removeEventListener("transitionend", onTransitionEnd, false);
+
         ok(!transitioned, "There should be no transitions");
 
-        tabViewWindow.document.removeEventListener(
-          "transitionend", onTransitionEnd, false);
-
         finish();
-      }, win);
+      };
+      tabViewWindow.addEventListener("tabviewshown", onTabViewShown, false);
+      win.TabView.toggle();
     };
 
     win.TabView._initFrame(initCallback);

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

@@ -133,11 +133,13 @@ function showTabView(callback, win) {
   win = win || window;
 
   if (win.TabView.isVisible()) {
-    callback();
+    waitForFocus(callback, win);
     return;
   }
 
-  whenTabViewIsShown(callback, win);
+  whenTabViewIsShown(function() {
+    waitForFocus(callback, win);
+  }, win);
   win.TabView.show();
 }