Bug 1908416: gBrowser.visibleTabs handles tab groups r=dao,tabbrowser-reviewers

Differential Revision: https://phabricator.services.mozilla.com/D218796

browser/components/tabbrowser/content/tabgroup.js

@@ -70,6 +70,8 @@
 
     set collapsed(val) {
       this.toggleAttribute("collapsed", val);
+      const eventName = val ? "TabGroupCollapse" : "TabGroupExpand";
+      this.dispatchEvent(new CustomEvent(eventName, { bubbles: true }));
     }
 
     get tabs() {

browser/components/tabbrowser/content/tabs.js

@@ -25,6 +25,8 @@
       this.addEventListener("TabUnpinned", this);
       this.addEventListener("TabHoverStart", this);
       this.addEventListener("TabHoverEnd", this);
+      this.addEventListener("TabGroupExpand", this);
+      this.addEventListener("TabGroupCollapse", this);
       this.addEventListener("transitionend", this);
       this.addEventListener("dblclick", this);
       this.addEventListener("click", this);
@@ -215,6 +217,14 @@
       this._previewPanel?.deactivate(event.target);
     }
 
+    on_TabGroupExpand() {
+      this._invalidateCachedVisibleTabs();
+    }
+
+    on_TabGroupCollapse() {
+      this._invalidateCachedVisibleTabs();
+    }
+
     on_transitionend(event) {
       if (event.propertyName != "max-width") {
         return;
@@ -1163,7 +1173,7 @@
       if (!this._visibleTabs) {
         this._visibleTabs = Array.prototype.filter.call(
           this.allTabs,
-          tab => !tab.hidden && !tab.closing
+          tab => !tab.hidden && !tab.closing && !tab.group?.collapsed
         );
       }
       return this._visibleTabs;

browser/components/tabbrowser/test/browser/tabs/browser_tab_groups.js

@@ -34,3 +34,28 @@ add_task(async function test_tabGroupCollapseAndExpand() {
   BrowserTestUtils.removeTab(tab1);
   group.remove();
 });
+
+add_task(async function test_tabGroupCollapsedTabsNotVisible() {
+  let group = gBrowser.addTabGroup("blue", "test");
+  let tab1 = BrowserTestUtils.addTab(gBrowser, "about:blank");
+  group.addTabs([tab1]);
+
+  Assert.ok(!group.collapsed, "group is expanded by default");
+
+  Assert.ok(
+    gBrowser.visibleTabs.includes(tab1),
+    "tab in expanded tab group is visible"
+  );
+
+  group.collapsed = true;
+  Assert.ok(
+    !gBrowser.visibleTabs.includes(tab1),
+    "tab in collapsed tab group is not visible"
+  );
+
+  // TODO add API to remove group
+  // TODO BrowserTestUtils.removeTab breaks if the tab is not in a visible state
+  group.collapsed = false;
+  BrowserTestUtils.removeTab(tab1);
+  group.remove();
+});