diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs index b8d3a3460..7b2cff504 100644 --- a/src/browser/base/content/ZenUIManager.mjs +++ b/src/browser/base/content/ZenUIManager.mjs @@ -620,9 +620,9 @@ var gZenVerticalTabsManager = { } gZenCompactModeManager.updateCompactModeContext(isSingleToolbar); - document.getElementById("urlbar").removeAttribute('--urlbar-height'); + document.getElementById('urlbar').removeAttribute('--urlbar-height'); if (!isSingleToolbar) { - document.getElementById("urlbar").style.setProperty('--urlbar-height', '32px'); + document.getElementById('urlbar').style.setProperty('--urlbar-height', '32px'); } else { gURLBar.updateLayoutBreakout(); } diff --git a/src/browser/base/zen-components/ZenViewSplitter.mjs b/src/browser/base/zen-components/ZenViewSplitter.mjs index 200976181..07cb872cf 100644 --- a/src/browser/base/zen-components/ZenViewSplitter.mjs +++ b/src/browser/base/zen-components/ZenViewSplitter.mjs @@ -305,7 +305,8 @@ class ZenViewSplitter extends ZenDOMOperatedFeature { } this.fakeBrowser.classList.add('fade-out'); const side = this.fakeBrowser.getAttribute('side'); - gBrowser.selectedTab = this._draggingTab; + if (this._draggingTab) this._draggingTab.setAttribute('zen-has-splitted', 'true'); + this._lastOpenedTab = gBrowser.selectedTab; this._draggingTab = null; try { Promise.all([ @@ -1522,7 +1523,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature { delete this._hasAnimated; this.fakeBrowser.remove(); this.fakeBrowser = null; - this._draggingTab._visuallySelected = false; + if (this._draggingTab) this._draggingTab._visuallySelected = false; if (select) { gBrowser.selectedTab = this._draggingTab; this._draggingTab = null; @@ -1548,7 +1549,10 @@ class ZenViewSplitter extends ZenDOMOperatedFeature { const dropSide = this.fakeBrowser?.getAttribute('side'); const containerRect = this.fakeBrowser.getBoundingClientRect(); const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0); - const dropTarget = document.elementFromPoint(containerRect.left + containerRect.width + padding + 5, event.clientY); + const dropTarget = document.elementFromPoint( + side == 'left' ? containerRect.left + containerRect.width + padding + 5 : containerRect.left - padding - 5, + event.clientY + ); const browser = dropTarget?.closest('browser'); if (!browser) { diff --git a/src/browser/components/tabbrowser/content/tabs-js.patch b/src/browser/components/tabbrowser/content/tabs-js.patch index 7185fe630..e1507c084 100644 --- a/src/browser/components/tabbrowser/content/tabs-js.patch +++ b/src/browser/components/tabbrowser/content/tabs-js.patch @@ -1,5 +1,5 @@ diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js -index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620036896db 100644 +index fa96568d366fd3608f9bd583fa793150bd815c8b..24071f1bc0d9cb2a4fe66e5e4657a64ab66f29cf 100644 --- a/browser/components/tabbrowser/content/tabs.js +++ b/browser/components/tabbrowser/content/tabs.js @@ -94,7 +94,7 @@ @@ -56,10 +56,14 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if ( (effects == "move" || effects == "copy") && this == draggedTab.container && -@@ -996,6 +1002,14 @@ +@@ -996,6 +1002,18 @@ this._tabDropIndicator.hidden = true; event.stopPropagation(); ++ if (draggedTab.hasAttribute("zen-has-splitted")) { ++ draggedTab.removeAttribute("zen-has-splitted"); ++ draggedTab._visuallySelected = false; ++ } + if (draggedTab && dropEffect == "move") { + let moved = gZenPinnedTabManager.moveToAnotherTabContainerIfNecessary(event, movingTabs); + @@ -71,7 +75,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (draggedTab && dropEffect == "copy") { // copy the dropped tab (wherever it's from) let newIndex = this._getDropIndex(event); -@@ -1034,10 +1048,11 @@ +@@ -1034,10 +1052,11 @@ } } else { let pinned = draggedTab.pinned; @@ -87,7 +91,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 ); let size = this.verticalMode ? "height" : "width"; let screenAxis = this.verticalMode ? "screenY" : "screenX"; -@@ -1114,7 +1129,7 @@ +@@ -1114,7 +1133,7 @@ let postTransitionCleanup = () => { tab.removeAttribute("tabdrop-samewindow"); @@ -96,7 +100,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (dropIndex !== false) { gBrowser.moveTabTo(tab, dropIndex); if (!directionForward) { -@@ -1122,7 +1137,7 @@ +@@ -1122,7 +1141,7 @@ } } }; @@ -105,7 +109,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 postTransitionCleanup(); } else { let onTransitionEnd = transitionendEvent => { -@@ -1249,7 +1264,7 @@ +@@ -1249,7 +1268,7 @@ return; } } @@ -114,7 +118,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 gBrowser.loadTabs(urls, { inBackground, replace, -@@ -1279,13 +1294,23 @@ +@@ -1279,13 +1298,23 @@ return; } @@ -140,7 +144,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 ) { delete draggedTab._dragData; return; -@@ -1517,7 +1542,7 @@ +@@ -1517,7 +1546,7 @@ } get newTabButton() { @@ -149,7 +153,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } get verticalMode() { -@@ -1537,28 +1562,40 @@ +@@ -1537,28 +1566,40 @@ if (this.#allTabs) { return this.#allTabs; } @@ -198,7 +202,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 return children.filter(node => node.tagName == "tab-group"); } -@@ -1579,7 +1616,7 @@ +@@ -1579,7 +1620,7 @@ */ get visibleTabs() { if (!this.#visibleTabs) { @@ -207,7 +211,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } return this.#visibleTabs; } -@@ -1613,10 +1650,8 @@ +@@ -1613,10 +1654,8 @@ return this.#focusableItems; } @@ -220,7 +224,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 let focusableItems = []; for (let child of children) { -@@ -1632,6 +1667,7 @@ +@@ -1632,6 +1671,7 @@ } this.#focusableItems = [ @@ -228,7 +232,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 ...verticalPinnedTabsContainer.children, ...focusableItems, ]; -@@ -1642,6 +1678,7 @@ +@@ -1642,6 +1682,7 @@ _invalidateCachedTabs() { this.#allTabs = null; this._invalidateCachedVisibleTabs(); @@ -236,7 +240,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } _invalidateCachedVisibleTabs() { -@@ -1656,8 +1693,8 @@ +@@ -1656,8 +1697,8 @@ #isContainerVerticalPinnedExpanded(tab) { return ( this.verticalMode && @@ -247,7 +251,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 ); } -@@ -1672,7 +1709,7 @@ +@@ -1672,7 +1713,7 @@ if (node == null) { // We have a container for non-tab elements at the end of the scrollbox. @@ -256,7 +260,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } node.before(tab); -@@ -1772,7 +1809,7 @@ +@@ -1772,7 +1813,7 @@ // There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and // for when the tab strip is overflowed (which is shared by vertical and horizontal tabs); // Attach the long click popup to all of them. @@ -265,7 +269,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 const newTab2 = this.newTabButton; const newTabVertical = document.getElementById( "vertical-tabs-newtab-button" -@@ -1855,7 +1892,7 @@ +@@ -1855,7 +1896,7 @@ let rect = ele => { return window.windowUtils.getBoundsWithoutFlushing(ele); }; @@ -274,7 +278,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (tab && rect(tab).width <= this._tabClipWidth) { this.setAttribute("closebuttons", "activetab"); } else { -@@ -1867,10 +1904,12 @@ +@@ -1867,10 +1908,12 @@ _handleTabSelect(aInstant) { let selectedTab = this.selectedItem; @@ -287,7 +291,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 selectedTab._notselectedsinceload = false; } -@@ -1882,7 +1921,7 @@ +@@ -1882,7 +1925,7 @@ return; } @@ -296,7 +300,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (!tabs.length) { return; } -@@ -1918,7 +1957,7 @@ +@@ -1918,7 +1961,7 @@ if (isEndTab && !this._hasTabTempMaxWidth) { return; } @@ -305,7 +309,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 // Force tabs to stay the same width, unless we're closing the last tab, // which case we need to let them expand just enough so that the overall // tabbar width is the same. -@@ -1933,7 +1972,7 @@ +@@ -1933,7 +1976,7 @@ let tabsToReset = []; for (let i = numPinned; i < tabs.length; i++) { let tab = tabs[i]; @@ -314,7 +318,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (!isEndTab) { // keep tabs the same width tab.style.transition = "none"; -@@ -1999,16 +2038,15 @@ +@@ -1999,16 +2042,15 @@ // Move pinned tabs to another container when the tabstrip is toggled to vertical // and when session restore code calls _positionPinnedTabs; update styling whenever // the number of pinned tabs changes. @@ -337,7 +341,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } } -@@ -2016,9 +2054,7 @@ +@@ -2016,9 +2058,7 @@ } _resetVerticalPinnedTabs() { @@ -348,7 +352,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (!verticalTabsContainer.children.length) { return; -@@ -2031,8 +2067,8 @@ +@@ -2031,8 +2071,8 @@ } _positionPinnedTabs() { @@ -359,7 +363,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 let absPositionHorizontalTabs = this.overflowing && tabs.length > numPinned && numPinned > 0; -@@ -2041,7 +2077,7 @@ +@@ -2041,7 +2081,7 @@ if (this.verticalMode) { this._updateVerticalPinnedTabs(); @@ -368,7 +372,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 let layoutData = this._pinnedTabsLayoutCache; let uiDensity = document.documentElement.getAttribute("uidensity"); if (!layoutData || layoutData.uiDensity != uiDensity) { -@@ -2113,7 +2149,7 @@ +@@ -2113,7 +2153,7 @@ return; } @@ -377,7 +381,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 let directionX = screenX > dragData.animLastScreenX; let directionY = screenY > dragData.animLastScreenY; -@@ -2121,7 +2157,7 @@ +@@ -2121,7 +2161,7 @@ dragData.animLastScreenX = screenX; let { width: tabWidth, height: tabHeight } = @@ -386,7 +390,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 let shiftSizeX = tabWidth * movingTabs.length; let shiftSizeY = tabHeight; dragData.tabWidth = tabWidth; -@@ -2296,10 +2332,11 @@ +@@ -2296,10 +2336,11 @@ } let pinned = draggedTab.pinned; @@ -402,7 +406,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 ); if (this.#rtlMode) { -@@ -2348,7 +2385,11 @@ +@@ -2348,7 +2389,11 @@ translate = Math.min(Math.max(translate, firstBound), lastBound); for (let tab of movingTabs) { @@ -415,7 +419,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } dragData.translatePos = translate; -@@ -2484,12 +2525,16 @@ +@@ -2484,12 +2529,16 @@ // Shift background tabs to leave a gap where the dragged tab // would currently be dropped. for (let tab of tabs) { @@ -433,7 +437,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 if (tab.group?.tabs[0] == tab) { tab.group.style.setProperty( "--tabgroup-dragover-transform", -@@ -2541,8 +2586,9 @@ +@@ -2541,8 +2590,9 @@ ); } @@ -445,7 +449,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 return; } -@@ -2553,6 +2599,7 @@ +@@ -2553,6 +2603,7 @@ tab.style.transform = ""; if (tab.group) { tab.group.style.removeProperty("--tabgroup-dragover-transform"); @@ -453,7 +457,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } tab.removeAttribute("dragover-createGroup"); } -@@ -2604,7 +2651,7 @@ +@@ -2604,7 +2655,7 @@ movingTab._moveTogetherSelectedTabsData.newIndex = movingTabNewIndex; movingTab._moveTogetherSelectedTabsData.animate = false; }; @@ -462,7 +466,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 postTransitionCleanup(); } else { let onTransitionEnd = transitionendEvent => { -@@ -2707,9 +2754,9 @@ +@@ -2707,9 +2758,9 @@ function newIndex(aTab, index) { // Don't allow mixing pinned and unpinned tabs. if (aTab.pinned) { @@ -474,7 +478,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..64e93a414f1544b89af05c636c587620 } } -@@ -2793,7 +2840,7 @@ +@@ -2793,7 +2844,7 @@ } _notifyBackgroundTab(aTab) {