no-bug: Make addons appear on the urlbar (gh-13535)

This commit is contained in:
mr. m
2026-05-03 14:53:37 +02:00
committed by GitHub
parent a71a66c00b
commit c82d314913
5 changed files with 70 additions and 20 deletions

View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml
index edeb473e46b3aa4b12eb4b59ce62e5ae48edd2a1..d2c6c8c150e732b77d65420520ca4905a9d3ea4d 100644
index edeb473e46b3aa4b12eb4b59ce62e5ae48edd2a1..99210f8bb5633d50d2cba24f1e13ca866c5b6959 100644
--- a/browser/base/content/navigator-toolbox.inc.xhtml
+++ b/browser/base/content/navigator-toolbox.inc.xhtml
@@ -2,7 +2,7 @@
@@ -11,7 +11,7 @@ index edeb473e46b3aa4b12eb4b59ce62e5ae48edd2a1..d2c6c8c150e732b77d65420520ca4905
<script src="chrome://browser/content/navigator-toolbox.js" />
<!-- Menu -->
@@ -18,9 +18,12 @@
@@ -18,9 +18,13 @@
#include browser-menubar.inc
</toolbaritem>
<spacer flex="1" skipintoolbarset="true" style="order: 1000;"/>
@@ -22,14 +22,14 @@ index edeb473e46b3aa4b12eb4b59ce62e5ae48edd2a1..d2c6c8c150e732b77d65420520ca4905
+ <html:div id="zen-toolbar-background" class="zen-toolbar-background zen-browser-generic-background">
+ <html:div class="zen-browser-grain" />
+ </html:div>
+ <box id="zen-overflow-extensions-list" skipintoolbarset="true" contextmenu="toolbar-context-menu" />
<toolbar id="TabsToolbar"
class="browser-toolbar browser-titlebar"
fullscreentoolbar="true"
@@ -62,6 +65,9 @@
@@ -62,6 +66,8 @@
<html:sidebar-pins-promo id="drag-to-pin-promo-card"></html:sidebar-pins-promo>
<arrowscrollbox id="pinned-tabs-container" orient="horizontal" clicktoscroll=""></arrowscrollbox>
<splitter orient="vertical" id="vertical-pinned-tabs-splitter" resizebefore="sibling" resizeafter="none" hidden="true"/>
+<html:div id="zen-overflow-extensions-list" skipintoolbarset="true"></html:div>
+<html:div id="zen-essentials" skipintoolbarset="true"></html:div>
+<html:div id="zen-tabs-wrapper">
<hbox class="tab-drop-indicator" hidden="true"/>

View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/customizableui/CustomizableUI.sys.mjs b/browser/components/customizableui/CustomizableUI.sys.mjs
index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f535e9d9e 100644
index db617c65b89643015d91b0f6a20eab7d7a1b598f..1511b785a45ebd084de13b091f56a59e7e737b26 100644
--- a/browser/components/customizableui/CustomizableUI.sys.mjs
+++ b/browser/components/customizableui/CustomizableUI.sys.mjs
@@ -14,6 +14,7 @@ ChromeUtils.defineESModuleGetters(lazy, {
@@ -186,11 +186,33 @@ index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f
});
lazy.log.debug(
@@ -7933,7 +7934,14 @@ class OverflowableToolbar {
@@ -7933,7 +7934,36 @@ class OverflowableToolbar {
Math.max(targetWidth, targetChildrenWidth)
);
totalAvailWidth = Math.ceil(totalAvailWidth);
- let isOverflowing = targetContentWidth > totalAvailWidth;
+ if (this.#target.id == 'nav-bar-customization-target' &&
+ win.gZenVerticalTabsManager._hasSetSingleToolbar &&
+ Services.prefs.getBoolPref("zen.view.overflow-webext-toolbar", true)) {
+ const availSelectors = ":is(#page-action-buttons, #zen-copy-url-button, .unified-extensions-item)";
+ const width = [
+ ...win.gURLBar._inputContainer.querySelectorAll(availSelectors),
+ ...win.document.getElementById("zen-overflow-extensions-list").querySelectorAll(availSelectors)
+ ].length * 26;
+ const urlbarWidth = win.document.getElementById("urlbar-container").getBoundingClientRect().width;
+ let overflowing = width > urlbarWidth * 0.5;
+ let wasOverflowing = win.gURLBar._isOverflowingItems;
+ win.gURLBar._isOverflowingItems = overflowing;
+ if (wasOverflowing !== overflowing) {
+ const items = gPlacements.get("nav-bar");
+ for (let item of items) {
+ let [, node] = CustomizableUIInternal.getWidgetNode(item, win);
+ if (node?.hasAttribute("data-extensionid")) {
+ win.gZenVerticalTabsManager.appendCustomizableItem(win.document.getElementById("zen-sidebar-top-buttons-customization-target"), node);
+ }
+ }
+ }
+ }
+ if (win.gZenVerticalTabsManager._hasSetSingleToolbar && this.#toolbar.id == 'nav-bar') return { isOverflowing: false, targetContentWidth, totalAvailWidth };
+ let isOverflowing = targetContentWidth + (win.gZenVerticalTabsManager._hasSetSingleToolbar ? 0.1 : 0) > totalAvailWidth;
+ if (win.gZenVerticalTabsManager._hasSetSingleToolbar &&
@@ -202,7 +224,7 @@ index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f
return { isOverflowing, targetContentWidth, totalAvailWidth };
}
@@ -7994,7 +8002,11 @@ class OverflowableToolbar {
@@ -7994,7 +8024,11 @@ class OverflowableToolbar {
return;
}
}
@@ -215,7 +237,7 @@ index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f
lazy.log.debug(
`Need ${minSize} but width is ${totalAvailWidth} so bailing`
);
@@ -8027,7 +8039,7 @@ class OverflowableToolbar {
@@ -8027,7 +8061,7 @@ class OverflowableToolbar {
}
}
if (!inserted) {
@@ -224,7 +246,7 @@ index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f
}
child.removeAttribute("cui-anchorid");
child.removeAttribute("overflowedItem");
@@ -8153,6 +8165,9 @@ class OverflowableToolbar {
@@ -8153,6 +8187,9 @@ class OverflowableToolbar {
* if no such list exists.
*/
get #webExtList() {
@@ -234,7 +256,7 @@ index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f
if (!this.#webExtListRef) {
let targetID = this.#toolbar.getAttribute("addon-webext-overflowtarget");
if (!targetID) {
@@ -8164,6 +8179,9 @@ class OverflowableToolbar {
@@ -8164,6 +8201,9 @@ class OverflowableToolbar {
let win = this.#toolbar.ownerGlobal;
let { panel } = win.gUnifiedExtensions;
this.#webExtListRef = panel.querySelector(`#${targetID}`);
@@ -244,7 +266,7 @@ index db617c65b89643015d91b0f6a20eab7d7a1b598f..9acef640800bdc75f477a8e14e73f08f
}
return this.#webExtListRef;
}
@@ -8372,7 +8390,7 @@ class OverflowableToolbar {
@@ -8372,7 +8412,7 @@ class OverflowableToolbar {
break;
}
case "mousedown": {

View File

@@ -1355,7 +1355,7 @@ window.gZenVerticalTabsManager = {
buttonsTarget.append(this._topButtonsSeparatorElement);
}
for (const button of elements) {
this._topButtonsSeparatorElement.after(button);
this.appendCustomizableItem(this._topButtonsSeparatorElement, button);
}
buttonsTarget.prepend(
document.getElementById("unified-extensions-button")
@@ -1558,16 +1558,36 @@ window.gZenVerticalTabsManager = {
Services.prefs.setBoolPref("zen.tabs.vertical.right-side", newVal);
},
appendCustomizableItem(target, child, placements) {
appendCustomizableItem(target, child, placements = []) {
if (
target.id === "zen-sidebar-top-buttons-customization-target" &&
this._hasSetSingleToolbar &&
placements.includes(child.id)
(target.id === "zen-sidebar-top-buttons-customization-target" ||
target === this._topButtonsSeparatorElement)
) {
this._topButtonsSeparatorElement.before(child);
return;
if (placements.includes(child.id)) {
this._topButtonsSeparatorElement.before(child);
return;
} else if (
child.hasAttribute("data-extensionid") &&
Services.prefs.getBoolPref("zen.view.overflow-webext-toolbar", true)
) {
if (gURLBar._isOverflowingItems) {
const overflowElements = document.getElementById(
"zen-overflow-extensions-list"
);
overflowElements.appendChild(child);
} else {
const element = document.getElementById("page-action-buttons");
element.before(child);
}
return;
}
}
if (target === this._topButtonsSeparatorElement) {
this._topButtonsSeparatorElement.after(child);
} else {
target.appendChild(child);
}
target.appendChild(child);
},
async renameTabKeydown(event) {

View File

@@ -139,10 +139,12 @@
}
.identity-box-button,
.urlbar-page-action {
.urlbar-page-action,
.unified-extensions-item {
opacity: 0;
height: 100%; /* To still be able to open popups */
visibility: collapse;
margin: 0 !important;
:root:not([supress-primary-adjustment="true"]) & {
transition:
@@ -189,6 +191,10 @@
}
}
:root[zen-single-toolbar="true"] #urlbar[breakout-extend="true"] .unified-extensions-item {
display: none !important;
}
/* stylelint-disable-next-line media-query-no-invalid */
@media -moz-pref("zen.urlbar.single-toolbar-show-copy-url", false) {
:root[zen-single-toolbar="true"] #zen-copy-url-button {

View File

@@ -6,10 +6,11 @@
#zen-overflow-extensions-list:not(:empty) {
--uei-icon-size: 14px;
display: flex;
display: grid;
gap: 8px;
padding: 8px 2px;
padding-bottom: 0;
grid-template-columns: calc(var(--border-radius-medium) - 4px);
& .unified-extensions-item {
flex: 1;
@@ -26,6 +27,7 @@
}
& .unified-extensions-item-action-button {
appearance: none;
background-color: var(--zen-toolbar-element-bg);
height: 30px;
margin: 0;