From 2c740b1abfe4a62acd76df3986ecb243a3c40598 Mon Sep 17 00:00:00 2001 From: "mr. m" Date: Wed, 25 Feb 2026 20:19:32 +0100 Subject: [PATCH] feat: Start animating folder closes, b=no-bug, c=common --- .nvmrc | 2 +- .../tabbrowser/content/tabbrowser-js.patch | 4 +-- .../tabbrowser/content/tabgroup-js.patch | 36 ++++++++++++------- src/zen/common/modules/ZenUIManager.mjs | 15 +++++--- 4 files changed, 36 insertions(+), 21 deletions(-) diff --git a/.nvmrc b/.nvmrc index 209e3ef4b..2bd5a0a98 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -20 +22 diff --git a/src/browser/components/tabbrowser/content/tabbrowser-js.patch b/src/browser/components/tabbrowser/content/tabbrowser-js.patch index 13797b6e9..d1cfe8b17 100644 --- a/src/browser/components/tabbrowser/content/tabbrowser-js.patch +++ b/src/browser/components/tabbrowser/content/tabbrowser-js.patch @@ -1,5 +1,5 @@ diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js -index d7765e0adb37216d35f2125abf96025cbb150bab..27202066cef98d9826884806f71e70812457bd78 100644 +index d7765e0adb37216d35f2125abf96025cbb150bab..4913c2e6cfb4f77bd8f2c0f33310c27475172132 100644 --- a/browser/components/tabbrowser/content/tabbrowser.js +++ b/browser/components/tabbrowser/content/tabbrowser.js @@ -405,6 +405,7 @@ @@ -605,7 +605,7 @@ index d7765e0adb37216d35f2125abf96025cbb150bab..27202066cef98d9826884806f71e7081 aTab._closeTimeAnimTimerId = null; - this._endRemoveTab(aTab); + if (animate && !gReduceMotion && !(gZenUIManager.testingEnabled && !gZenUIManager.profilingEnabled)) { -+ gZenVerticalTabsManager.animateTabClose(aTab, (animate && !gReduceMotion)).then(() => { ++ gZenVerticalTabsManager.animateItemClose(aTab, (animate && !gReduceMotion)).then(() => { + this._endRemoveTab(aTab); + }); + } else { diff --git a/src/browser/components/tabbrowser/content/tabgroup-js.patch b/src/browser/components/tabbrowser/content/tabgroup-js.patch index 192df66fe..8d6902d3c 100644 --- a/src/browser/components/tabbrowser/content/tabgroup-js.patch +++ b/src/browser/components/tabbrowser/content/tabgroup-js.patch @@ -1,5 +1,5 @@ diff --git a/browser/components/tabbrowser/content/tabgroup.js b/browser/components/tabbrowser/content/tabgroup.js -index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc2441c48c 100644 +index ebcc072abca51ba9936d0e6d97bbd329427c0231..2b0980a745e2339d3220bb701092f4f621876985 100644 --- a/browser/components/tabbrowser/content/tabgroup.js +++ b/browser/components/tabbrowser/content/tabgroup.js @@ -14,11 +14,11 @@ @@ -100,7 +100,17 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc resetDefaultGroupName = () => { this.#defaultGroupName = ""; -@@ -211,7 +234,10 @@ +@@ -166,7 +189,9 @@ + this.dispatchEvent( + new CustomEvent("TabGroupRemoved", { bubbles: true }) + ); ++ gZenVerticalTabsManager.animateItemClose(this).then(() => { + this.remove(); ++ }); + Services.obs.notifyObservers( + this, + "browser-tabgroup-removed-from-dom" +@@ -211,7 +236,10 @@ } }); } @@ -112,7 +122,7 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc } get color() { -@@ -305,6 +331,9 @@ +@@ -305,6 +333,9 @@ } set collapsed(val) { @@ -122,7 +132,7 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc if (!!val == this.collapsed) { return; } -@@ -391,7 +420,6 @@ +@@ -391,7 +422,6 @@ tabGroupName, }) .then(result => { @@ -130,7 +140,7 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc }); } -@@ -466,13 +494,65 @@ +@@ -466,13 +496,65 @@ * @returns {MozTabbrowserTab[]} */ get tabs() { @@ -145,9 +155,8 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc + tabsCollect.push(item); + if (gBrowser.isTabGroup(item)) { + tabsCollect.push(...item.tabs); - } - } -- return childrenArray.filter(node => node.matches("tab")); ++ } ++ } + return tabsCollect.filter(node => node.matches("tab")); + } + @@ -173,8 +182,9 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc + result.push(labelContainer); + } + result.push(...item.childGroupsAndTabs); -+ } -+ } + } + } +- return childrenArray.filter(node => node.matches("tab")); + return result; + } + @@ -201,7 +211,7 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc } /** -@@ -569,7 +649,6 @@ +@@ -569,7 +651,6 @@ ); } else { if (tabOrSplitView.pinned) { @@ -209,7 +219,7 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc } let tabToMove = this.ownerGlobal === tabOrSplitView.ownerGlobal -@@ -634,7 +713,7 @@ +@@ -634,7 +715,7 @@ */ on_click(event) { let isToggleElement = @@ -218,7 +228,7 @@ index ebcc072abca51ba9936d0e6d97bbd329427c0231..62e8209bbc38fb209340279e5ed3e2cc event.target === this.#overflowCountLabel; if (isToggleElement && event.button === 0) { event.preventDefault(); -@@ -705,5 +784,6 @@ +@@ -705,5 +786,6 @@ } } diff --git a/src/zen/common/modules/ZenUIManager.mjs b/src/zen/common/modules/ZenUIManager.mjs index 4a0714848..c97245211 100644 --- a/src/zen/common/modules/ZenUIManager.mjs +++ b/src/zen/common/modules/ZenUIManager.mjs @@ -929,15 +929,20 @@ window.gZenVerticalTabsManager = { } }, - animateTabClose(aTab) { - if (aTab.hasAttribute("zen-essential") || aTab.group?.hasAttribute("split-view-group")) { + animateItemClose(aItem) { + if ( + aItem.hasAttribute("zen-essential") || + aItem.group?.hasAttribute("split-view-group") || + !gZenUIManager.motion || + gReduceMotion + ) { return Promise.resolve(); } - const height = aTab.getBoundingClientRect().height; + const height = aItem.getBoundingClientRect().height; const visibleItems = gBrowser.tabContainer.ariaFocusableItems; - const isLastItem = visibleItems[visibleItems.length - 1] === aTab; + const isLastItem = visibleItems[visibleItems.length - 1] === aItem; return gZenUIManager.motion.animate( - aTab, + aItem, { opacity: [1, 0], transform: ["scale(1)", "scale(0.95)"],