From 63b11934d6213dae6c5354f662539d25fb84070a Mon Sep 17 00:00:00 2001
From: Hiroyuki Ikezoe <hikezoe.birchill@mozilla.com>
Date: Wed, 25 Jan 2023 21:03:55 +0000
Subject: [PATCH] Bug 1811871 - Check collapsed attribute rather than computed
 opacity value to tell whether which navigation ison is currently visible.
 r=tnikkel

Differential Revision: https://phabricator.services.mozilla.com/D167740
---
 .../base/content/browser-gestureSupport.js    | 10 +---
 .../mochitest/apz_test_native_event_utils.js  | 14 ++++-
 .../browser/browser_test_swipe_gesture.js     | 53 ++++++++++++++++++-
 3 files changed, 67 insertions(+), 10 deletions(-)

diff --git a/browser/base/content/browser-gestureSupport.js b/browser/base/content/browser-gestureSupport.js
index 0c8d4371a878..0940f67f56d5 100644
--- a/browser/base/content/browser-gestureSupport.js
+++ b/browser/base/content/browser-gestureSupport.js
@@ -713,16 +713,10 @@ var gHistorySwipeAnimation = {
       return;
     }
 
-    let prevOpacity = window
-      .getComputedStyle(this._prevBox)
-      .getPropertyValue("opacity");
-    let nextOpacity = window
-      .getComputedStyle(this._nextBox)
-      .getPropertyValue("opacity");
     let box = null;
-    if (prevOpacity > 0) {
+    if (!this._prevBox.collapsed) {
       box = this._prevBox;
-    } else if (nextOpacity > 0) {
+    } else if (!this._nextBox.collapsed) {
       box = this._nextBox;
     }
     if (box != null) {
diff --git a/gfx/layers/apz/test/mochitest/apz_test_native_event_utils.js b/gfx/layers/apz/test/mochitest/apz_test_native_event_utils.js
index 785a4f3b9b59..2f2f55c7cdbb 100644
--- a/gfx/layers/apz/test/mochitest/apz_test_native_event_utils.js
+++ b/gfx/layers/apz/test/mochitest/apz_test_native_event_utils.js
@@ -1852,7 +1852,7 @@ if (!window.hasOwnProperty("NativePanHandler")) {
   });
 }
 
-async function panRightToLeft(aElement, aX, aY, aMultiplier) {
+async function panRightToLeftBegin(aElement, aX, aY, aMultiplier) {
   await NativePanHandler.promiseNativePanEvent(
     aElement,
     aX,
@@ -1861,6 +1861,9 @@ async function panRightToLeft(aElement, aX, aY, aMultiplier) {
     0,
     NativePanHandler.beginPhase
   );
+}
+
+async function panRightToLeftUpdate(aElement, aX, aY, aMultiplier) {
   await NativePanHandler.promiseNativePanEvent(
     aElement,
     aX,
@@ -1869,6 +1872,9 @@ async function panRightToLeft(aElement, aX, aY, aMultiplier) {
     0,
     NativePanHandler.updatePhase
   );
+}
+
+async function panRightToLeftEnd(aElement, aX, aY, aMultiplier) {
   await NativePanHandler.promiseNativePanEvent(
     aElement,
     aX,
@@ -1879,6 +1885,12 @@ async function panRightToLeft(aElement, aX, aY, aMultiplier) {
   );
 }
 
+async function panRightToLeft(aElement, aX, aY, aMultiplier) {
+  await panRightToLeftBegin(aElement, aX, aY, aMultiplier);
+  await panRightToLeftUpdate(aElement, aX, aY, aMultiplier);
+  await panRightToLeftEnd(aElement, aX, aY, aMultiplier);
+}
+
 async function panLeftToRight(aElement, aX, aY, aMultiplier) {
   await panLeftToRightBegin(aElement, aX, aY, aMultiplier);
   await panLeftToRightUpdate(aElement, aX, aY, aMultiplier);
diff --git a/widget/tests/browser/browser_test_swipe_gesture.js b/widget/tests/browser/browser_test_swipe_gesture.js
index e3152b4bc363..efa30a4557a3 100644
--- a/widget/tests/browser/browser_test_swipe_gesture.js
+++ b/widget/tests/browser/browser_test_swipe_gesture.js
@@ -582,7 +582,14 @@ add_task(async () => {
   let transitionPromise = new Promise(resolve => {
     gHistorySwipeAnimation._prevBox.addEventListener(
       "transitionstart",
-      resolve,
+      event => {
+        if (
+          event.propertyName == "opacity" &&
+          event.target == gHistorySwipeAnimation._prevBox
+        ) {
+          resolve();
+        }
+      },
       { once: true }
     );
   });
@@ -604,6 +611,50 @@ add_task(async () => {
     );
   });
 
+  // Navigate forward and check the forward navigation icon box state.
+  startLoadingPromise = BrowserTestUtils.browserStarted(
+    tab.linkedBrowser,
+    secondPage
+  );
+  stoppedLoadingPromise = BrowserTestUtils.browserStopped(
+    tab.linkedBrowser,
+    secondPage
+  );
+
+  await panRightToLeftBegin(tab.linkedBrowser, 100, 100, 100);
+
+  ok(gHistorySwipeAnimation._nextBox != null, "should have nextbox");
+  transitionPromise = new Promise(resolve => {
+    gHistorySwipeAnimation._nextBox.addEventListener(
+      "transitionstart",
+      event => {
+        if (
+          event.propertyName == "opacity" &&
+          event.target == gHistorySwipeAnimation._nextBox
+        ) {
+          resolve();
+        }
+      }
+    );
+  });
+
+  await panRightToLeftUpdate(tab.linkedBrowser, 100, 100, 100);
+  await panRightToLeftEnd(tab.linkedBrowser, 100, 100, 100);
+
+  // Make sure the gesture triggered going forward to the next page.
+  await Promise.all([startLoadingPromise, stoppedLoadingPromise]);
+
+  ok(gBrowser.webNavigation.canGoBack);
+
+  await transitionPromise;
+
+  await TestUtils.waitForCondition(() => {
+    return (
+      gHistorySwipeAnimation._nextBox == null &&
+      gHistorySwipeAnimation._prevBox == null
+    );
+  });
+
   BrowserTestUtils.removeTab(tab);
   await SpecialPowers.popPrefEnv();
 });