Naming etc

src/view/com/util/List.web.tsx

@@ -110,7 +110,9 @@ function ListImpl<ItemT>(
   useResizeObserver(containerRef, onContentSizeChange)
 
   // --- onScroll ---
-  const handleScroll = useNonReactiveCallback(() => {
+  const [isInsideVisibleTree, setIsInsideVisibleTree] = React.useState(false)
+  const handleWindowScroll = useNonReactiveCallback(() => {
+    if (isInsideVisibleTree) {
       contextScrollHandlers.onScroll?.(
         {
           contentOffset: {
@@ -120,17 +122,17 @@ function ListImpl<ItemT>(
         } as any, // TODO: Better types.
         null as any,
       )
+    }
   })
-  const [isParentTreeVisible, setIsParentTreeVisible] = React.useState(false)
   React.useEffect(() => {
-    if (!isParentTreeVisible) {
+    if (!isInsideVisibleTree) {
       // Prevents hidden tabs from firing scroll events.
       // Only one list is expected to be firing these at a time.
       return
     }
-    window.addEventListener('scroll', handleScroll)
+    window.addEventListener('scroll', handleWindowScroll)
-    return () => window.removeEventListener('scroll', handleScroll)
+    return () => window.removeEventListener('scroll', handleWindowScroll)
-  }, [isParentTreeVisible, handleScroll])
+  }, [isInsideVisibleTree, handleWindowScroll])
 
   // --- onScrolledDownChange ---
   const isScrolledDown = useRef(false)
@@ -158,8 +160,12 @@ function ListImpl<ItemT>(
   return (
     <View {...props} style={style} ref={nativeRef}>
       <Visibility
-        onVisibleChange={setIsParentTreeVisible}
+        onVisibleChange={setIsInsideVisibleTree}
-        style={styles.parentTreeVisibilityDetector}
+        style={
+          // This has position: fixed, so it should always report as visible
+          // unless we're within a display: none tree (like a hidden tab).
+          styles.parentTreeVisibilityDetector
+        }
       />
       <View
         ref={containerRef}