feat: Added support for swiping when scrolling on workspaces, b=(no-bug), c=workspaces

src/toolkit/content/widgets/arrowscrollbox-js.patch

@@ -1,5 +1,5 @@
 diff --git a/toolkit/content/widgets/arrowscrollbox.js b/toolkit/content/widgets/arrowscrollbox.js
-index f9191af09f1b7a1654aff62807e7dad573afc172..f94a8b3dc5871fba5d0dbed5d487d6e32a1ff29a 100644
+index f9191af09f1b7a1654aff62807e7dad573afc172..0b81a2bf5a0e1d745623f9b72fbe57254c1b16dd 100644
 --- a/toolkit/content/widgets/arrowscrollbox.js
 +++ b/toolkit/content/widgets/arrowscrollbox.js
 @@ -98,6 +98,7 @@
@@ -15,7 +15,7 @@ index f9191af09f1b7a1654aff62807e7dad573afc172..f94a8b3dc5871fba5d0dbed5d487d6e3
      on_wheel(event) {
        // Don't consume the event if we can't scroll.
 -      if (!this.overflowing) {
-+      if (!this.overflowing || this.id === 'tabbrowser-arrowscrollbox') { // we handle this on ZenStartup
++      if (!this.overflowing || this.id === 'tabbrowser-arrowscrollbox' || (event.deltaY == 0 && this.classList.contains('workspace-arrowscrollbox'))) {
          return;
        }
  

src/zen/workspaces/ZenWorkspace.mjs

@@ -6,7 +6,7 @@
           <hbox class="zen-current-workspace-indicator-icon"></hbox>
           <hbox class="zen-current-workspace-indicator-name"></hbox>
         </vbox>
-        <arrowscrollbox orient="vertical" tabindex="-1">
+        <arrowscrollbox orient="vertical" tabindex="-1" class="workspace-arrowscrollbox">
           <vbox class="zen-workspace-tabs-section zen-workspace-pinned-tabs-section">
             <html:div class="vertical-pinned-tabs-container-separator"></html:div>
           </vbox>
@@ -77,6 +77,13 @@
         get: () => 36,
       });
 
+      if (
+        Services.prefs.getBoolPref('zen.workspaces.swipe-actions', false) &&
+        gZenWorkspaces.workspaceEnabled
+      ) {
+        gZenWorkspaces.attachGestureHandlers(this);
+      }
+
       // Add them manually since attribute inheritance doesn't work
       // for multiple layers of shadow DOM.
       this.tabsContainer.setAttribute('zen-workspace-id', this.id);

src/zen/workspaces/ZenWorkspaces.mjs

@@ -138,7 +138,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
       Services.prefs.getBoolPref('zen.workspaces.swipe-actions', false) &&
       this.workspaceEnabled
     ) {
-      this.initializeGestureHandlers();
       this.initializeWorkspaceNavigation();
     }
 
@@ -576,21 +575,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
     );
   }
 
-  initializeGestureHandlers() {
-    const elements = [
-      gNavToolbox,
-      // event handlers do not work on elements inside shadow DOM so we need to attach them directly
-      document.getElementById('tabbrowser-arrowscrollbox').shadowRoot.querySelector('scrollbox'),
-    ];
-
-    // Attach gesture handlers to each element
-    for (const element of elements) {
-      if (!element) continue;
-
-      this.attachGestureHandlers(element);
-    }
-  }
-
   attachGestureHandlers(element) {
     element.addEventListener('MozSwipeGestureMayStart', this._handleSwipeMayStart.bind(this), true);
     element.addEventListener('MozSwipeGestureStart', this._handleSwipeStart.bind(this), true);

src/zen/workspaces/zen-workspaces.css

@@ -541,7 +541,7 @@ zen-workspace {
         top: 0;
         left: 0;
         width: 100%;
-        height: 2px;
+        height: 1px;
         opacity: 0;
         pointer-events: none;
         transition: opacity 0.1s;
@@ -554,7 +554,7 @@ zen-workspace {
         bottom: 0;
         left: 0;
         width: 100%;
-        height: 2px;
+        height: 1px;
         opacity: 0;
         pointer-events: none;
         transition: opacity 0.1s;