Merging upstream version 125.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

3 files changed, 42 insertions, 75 deletions

diff --git a/browser/components/customizableui/CustomizableUI.sys.mjs b/browser/components/customizableui/CustomizableUI.sys.mjs
index d748b93a92..5b09402dc1 100644
--- a/browser/components/customizableui/CustomizableUI.sys.mjs
+++ b/browser/components/customizableui/CustomizableUI.sys.mjs
@@ -1251,8 +1251,8 @@ var CustomizableUIInternal = {
   },
 
   addPanelCloseListeners(aPanel) {
-    Services.els.addSystemEventListener(aPanel, "click", this, false);
-    Services.els.addSystemEventListener(aPanel, "keypress", this, false);
+    aPanel.addEventListener("click", this, { mozSystemGroup: true });
+    aPanel.addEventListener("keypress", this, { mozSystemGroup: true });
     let win = aPanel.ownerGlobal;
     if (!gPanelsForWindow.has(win)) {
       gPanelsForWindow.set(win, new Set());
@@ -1261,8 +1261,8 @@ var CustomizableUIInternal = {
   },
 
   removePanelCloseListeners(aPanel) {
-    Services.els.removeSystemEventListener(aPanel, "click", this, false);
-    Services.els.removeSystemEventListener(aPanel, "keypress", this, false);
+    aPanel.removeEventListener("click", this, { mozSystemGroup: true });
+    aPanel.removeEventListener("keypress", this, { mozSystemGroup: true });
     let win = aPanel.ownerGlobal;
     let panels = gPanelsForWindow.get(win);
     if (panels) {
@@ -5483,7 +5483,10 @@ class OverflowableToolbar {
       let mainViewId = multiview.getAttribute("mainViewId");
       let mainView = doc.getElementById(mainViewId);
       let contextMenu = doc.getElementById(mainView.getAttribute("context"));
-      Services.els.addSystemEventListener(contextMenu, "command", this, true);
+      contextMenu.addEventListener("command", this, {
+        capture: true,
+        mozSystemGroup: true,
+      });
       let anchor = this.#defaultListButton.icon;
 
       let popupshown = false;
@@ -6082,12 +6085,10 @@ class OverflowableToolbar {
     let contextMenuId = this.#defaultListPanel.getAttribute("context");
     if (contextMenuId) {
       let contextMenu = doc.getElementById(contextMenuId);
-      Services.els.removeSystemEventListener(
-        contextMenu,
-        "command",
-        this,
-        true
-      );
+      contextMenu.removeEventListener("command", this, {
+        capture: true,
+        mozSystemGroup: true,
+      });
     }
   }
 
diff --git a/browser/components/customizableui/PanelMultiView.sys.mjs b/browser/components/customizableui/PanelMultiView.sys.mjs
index a97889f08a..e390bf7bf8 100644
--- a/browser/components/customizableui/PanelMultiView.sys.mjs
+++ b/browser/components/customizableui/PanelMultiView.sys.mjs
@@ -412,7 +412,6 @@ export var PanelMultiView = class extends AssociatedToNode {
     this.openViews = [];
 
     this._panel.addEventListener("popupshowing", this);
-    this._panel.addEventListener("popuppositioned", this);
     this._panel.addEventListener("popuphidden", this);
     this._panel.addEventListener("popupshown", this);
 
@@ -434,7 +433,6 @@ export var PanelMultiView = class extends AssociatedToNode {
 
     this._panel.removeEventListener("mousemove", this);
     this._panel.removeEventListener("popupshowing", this);
-    this._panel.removeEventListener("popuppositioned", this);
     this._panel.removeEventListener("popupshown", this);
     this._panel.removeEventListener("popuphidden", this);
     this.document.documentElement.removeEventListener("keydown", this, true);
@@ -1181,47 +1179,6 @@ export var PanelMultiView = class extends AssociatedToNode {
     }
   }
 
-  _calculateMaxHeight(aEvent) {
-    // While opening the panel, we have to limit the maximum height of any
-    // view based on the space that will be available. We cannot just use
-    // window.screen.availTop and availHeight because these may return an
-    // incorrect value when the window spans multiple screens.
-    let anchor = this._panel.anchorNode;
-    let anchorRect = anchor.getBoundingClientRect();
-    let screen = anchor.screen;
-
-    // GetAvailRect returns screen-device pixels, which we can convert to CSS
-    // pixels here.
-    let availTop = {},
-      availHeight = {};
-    screen.GetAvailRect({}, availTop, {}, availHeight);
-    let cssAvailTop = availTop.value / screen.defaultCSSScaleFactor;
-
-    // The distance from the anchor to the available margin of the screen is
-    // based on whether the panel will open towards the top or the bottom.
-    let maxHeight;
-    if (aEvent.alignmentPosition.startsWith("before_")) {
-      maxHeight = anchor.screenY - cssAvailTop;
-    } else {
-      let anchorScreenBottom = anchor.screenY + anchorRect.height;
-      let cssAvailHeight = availHeight.value / screen.defaultCSSScaleFactor;
-      maxHeight = cssAvailTop + cssAvailHeight - anchorScreenBottom;
-    }
-
-    // To go from the maximum height of the panel to the maximum height of
-    // the view stack, we need to subtract the height of the arrow and the
-    // height of the opposite margin, but we cannot get their actual values
-    // because the panel is not visible yet. However, we know that this is
-    // currently 11px on Mac, 13px on Windows, and 13px on Linux. We also
-    // want an extra margin, both for visual reasons and to prevent glitches
-    // due to small rounding errors. So, we just use a value that makes
-    // sense for all platforms. If the arrow visuals change significantly,
-    // this value will be easy to adjust.
-    const EXTRA_MARGIN_PX = 20;
-    maxHeight -= EXTRA_MARGIN_PX;
-    return maxHeight;
-  }
-
   handleEvent(aEvent) {
     // Only process actual popup events from the panel or events we generate
     // ourselves, but not from menus being shown from within the panel.
@@ -1262,14 +1219,6 @@ export var PanelMultiView = class extends AssociatedToNode {
         }
         break;
       }
-      case "popuppositioned": {
-        if (this._panel.state == "showing") {
-          let maxHeight = this._calculateMaxHeight(aEvent);
-          this._viewStack.style.maxHeight = maxHeight + "px";
-          this._offscreenViewStack.style.maxHeight = maxHeight + "px";
-        }
-        break;
-      }
       case "popupshown":
         // The main view is always open and visible when the panel is first
         // shown, so we can check the height of the description elements it
diff --git a/browser/components/customizableui/test/browser_1856572_ensure_Fluent_works_in_customizeMode.js b/browser/components/customizableui/test/browser_1856572_ensure_Fluent_works_in_customizeMode.js
index 0f89bd5d1c..7187effdb1 100644
--- a/browser/components/customizableui/test/browser_1856572_ensure_Fluent_works_in_customizeMode.js
+++ b/browser/components/customizableui/test/browser_1856572_ensure_Fluent_works_in_customizeMode.js
@@ -10,12 +10,21 @@ const {
   "resource://testing-common/FirefoxViewTestUtils.sys.mjs"
 );
 
+/**
+ * Bug 1856572 - This test is to ensure that fluent strings in Firefox View
+ * can be updated after opening Customize Mode
+ * **/
 add_task(async function test_data_l10n_customize_mode() {
   FirefoxViewTestUtilsInit(this);
   await withFirefoxView({ win: window }, async function (browser) {
     /**
      * Bug 1856572, Bug 1857622: Without requesting two animation frames
      * the "missing Fluent strings" issue will not reproduce.
+     *
+     * Given the precondition that we open Firefox View, then open Customize Mode, then
+     * navigate back to Firefox View in a quick succession, as long as Fluent
+     * controlled strings can be updated by changing their Fluent IDs then this
+     * test is valid.
      */
     await new Promise(r =>
       requestAnimationFrame(() => requestAnimationFrame(r))
@@ -23,39 +32,47 @@ add_task(async function test_data_l10n_customize_mode() {
     await startCustomizing();
     await endCustomizing();
     await openFirefoxViewTab(window);
-
     const { document } = browser.contentWindow;
-    let header = document.querySelector("h1");
-    document.l10n.setAttributes(header, "firefoxview-overview-header");
+    let secondPageNavButton = document.querySelectorAll(
+      "moz-page-nav-button"
+    )[0];
+    document.l10n.setAttributes(
+      secondPageNavButton,
+      "firefoxview-overview-header"
+    );
     let previousText = await document.l10n.formatValue(
-      "firefoxview-page-title"
+      "firefoxview-opentabs-nav"
+    );
+    let translatedText = await window.content.document.l10n.formatValue(
+      "firefoxview-overview-header"
     );
     /**
      * This should be replaced with
-     * BrowserTestUtils.waitForMutationCondition(header, {characterData: true}, ...)
+     * BrowserTestUtils.waitForMutationCondition(secondPageNavButton, {characterData: true}, ...)
      * but apparently Fluent manipulation of textContent doesn't result
      * in a characterData mutation occurring.
      */
     await BrowserTestUtils.waitForCondition(() => {
-      return header.textContent != previousText;
+      return (
+        secondPageNavButton.textContent !== previousText &&
+        secondPageNavButton.textContent === translatedText
+      );
     }, "waiting for text content to change");
 
     Assert.equal(
-      header.getAttribute("data-l10n-id"),
+      secondPageNavButton.getAttribute("data-l10n-id"),
       "firefoxview-overview-header",
       "data-l10n-id should be updated"
     );
     Assert.notEqual(
       previousText,
-      header.textContent,
-      "The header's text content should be updated"
-    );
-    let translatedText = await window.content.document.l10n.formatValue(
-      "firefoxview-overview-header"
+      secondPageNavButton.textContent,
+      "The second page-nav button text content should be updated"
     );
+
     Assert.equal(
       translatedText,
-      header.textContent,
+      secondPageNavButton.textContent,
       "The changed text should be the translated value of 'firefoxview-overview-header"
     );
   });