From 98cd1f13b8859bb6e50d2a9650f10dc8de6aa3f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= <emilio@crisal.io>
Date: Tue, 26 Nov 2024 18:14:23 +0100
Subject: [PATCH] Firefox + standards support for showsScrollIndicator=false

---
 .../src/VirtualizedList/index.js              | 13 ++++++-----
 packages/rax-scrollview/src/web/index.tsx     | 22 ++++++++++---------
 2 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/packages/rax-recyclerview/src/VirtualizedList/index.js b/packages/rax-recyclerview/src/VirtualizedList/index.js
index e5f435d8..30ae0af7 100644
--- a/packages/rax-recyclerview/src/VirtualizedList/index.js
+++ b/packages/rax-recyclerview/src/VirtualizedList/index.js
@@ -121,11 +121,14 @@ export default class VirtualizedList extends BaseList {
 
     let showsScrollIndicator = horizontal ? showsHorizontalScrollIndicator : showsVerticalScrollIndicator;
 
-    if (!showsScrollIndicator && typeof document !== 'undefined' && !document.getElementById(STYLE_NODE_ID)) {
-      let styleNode = document.createElement('style');
-      styleNode.id = STYLE_NODE_ID;
-      document.head.appendChild(styleNode);
-      styleNode.innerHTML = `.${this.props.className}::-webkit-scrollbar{display: none;}`;
+    if (!showsScrollIndicator) {
+      wrapperStyle.scrollbarWidth = 'none';
+      if (typeof document !== 'undefined' && !document.getElementById(STYLE_NODE_ID)) {
+        let styleNode = document.createElement('style');
+        styleNode.id = STYLE_NODE_ID;
+        document.head.appendChild(styleNode);
+        styleNode.innerHTML = `.${this.props.className}::-webkit-scrollbar{display: none;}`;
+      }
     }
 
     // return children when has nested list
diff --git a/packages/rax-scrollview/src/web/index.tsx b/packages/rax-scrollview/src/web/index.tsx
index 11b3ac85..5f11d419 100644
--- a/packages/rax-scrollview/src/web/index.tsx
+++ b/packages/rax-scrollview/src/web/index.tsx
@@ -244,16 +244,18 @@ const ScrollView: ForwardRefExoticComponent<ScrollViewProps> = forwardRef(
       ? showsHorizontalScrollIndicator
       : showsVerticalScrollIndicator;
     {
-      if (
-        !showsScrollIndicator &&
-        typeof document !== 'undefined' &&
-        typeof document.getElementById === 'function' &&
-        !document.getElementById(STYLE_NODE_ID)
-      ) {
-        let styleNode = document.createElement('style');
-        styleNode.id = STYLE_NODE_ID;
-        document.head.appendChild(styleNode);
-        styleNode.innerHTML = `.${baseCls}::-webkit-scrollbar{display: none;}`;
+      if (!showsScrollIndicator) {
+        scrollerStyle.scrollbarWidth = 'none';
+        if (
+          typeof document !== 'undefined' &&
+          typeof document.getElementById === 'function' &&
+          !document.getElementById(STYLE_NODE_ID)
+        ) {
+          let styleNode = document.createElement('style');
+          styleNode.id = STYLE_NODE_ID;
+          document.head.appendChild(styleNode);
+          styleNode.innerHTML = `.${baseCls}::-webkit-scrollbar{display: none;}`;
+        }
       }
 
       scrollerStyle.WebkitOverflowScrolling = 'touch';