virtua 0.43.6 → 0.44.0

package/lib/solid/index.jsx

@@ -333,8 +333,12 @@ const createVirtualStore = (elementsCount, itemSize = 40, overscan = 4, ssrCount
     };
     const applyJump = (j) => {
         if (j) {
+            if (
             // In iOS WebKit browsers, updating scroll position will stop scrolling so it have to be deferred during scrolling.
-            if (isIOSWebKit() && _scrollDirection !== SCROLL_IDLE) {
+            (isIOSWebKit() && _scrollDirection !== SCROLL_IDLE) ||
+                // Before imperative smooth scrolling, we measure all items which may be visible during scrolling.
+                // However, especially in Firefox, there are rare cases where items resize while scrolling, which can stop smooth scrolling.
+                (_frozenRange && _scrollMode === SCROLL_BY_MANUAL_SCROLL)) {
                 pendingJump += j;
             }
             else {
@@ -373,13 +377,6 @@ const createVirtualStore = (elementsCount, itemSize = 40, overscan = 4, ssrCount
         $findStartIndex: () => findIndex(cache, getVisibleOffset()),
         $findEndIndex: () => findIndex(cache, getVisibleOffset() + viewportSize),
         $isUnmeasuredItem: (index) => cache._sizes[index] === UNCACHED,
-        _hasUnmeasuredItemsInFrozenRange: () => {
-            if (!_frozenRange)
-                return false;
-            return cache._sizes
-                .slice(max(0, _frozenRange[0] - 1), min(cache._length - 1, _frozenRange[1] + 1) + 1)
-                .includes(UNCACHED);
-        },
         $getItemOffset: getItemOffset,
         $getItemSize: getItemSize$1,
         $getItemsLength: () => cache._length,
@@ -391,13 +388,7 @@ const createVirtualStore = (elementsCount, itemSize = 40, overscan = 4, ssrCount
         _flushJump: () => {
             _flushedJump = jump;
             jump = 0;
-            return [
-                _flushedJump,
-                // Use absolute position not to exceed scrollable bounds
-                _scrollMode === SCROLL_BY_SHIFT ||
-                    // https://github.com/inokawa/virtua/discussions/475
-                    getRelativeScrollOffset() + viewportSize >= getTotalSize(),
-            ];
+            return [_flushedJump, _scrollMode === SCROLL_BY_SHIFT];
         },
         $subscribe: (target, cb) => {
             const sub = [target, cb];
@@ -476,10 +467,10 @@ const createVirtualStore = (elementsCount, itemSize = 40, overscan = 4, ssrCount
                         if (
                         // Keep distance from end during shifting
                         _scrollMode === SCROLL_BY_SHIFT ||
-                            (_frozenRange
+                            (_frozenRange && _scrollMode === SCROLL_BY_MANUAL_SCROLL
                                 ? // https://github.com/inokawa/virtua/issues/380
-                                    // https://github.com/inokawa/virtua/issues/590
-                                    !isSSR && index < _frozenRange[0]
+                                    // https://github.com/inokawa/virtua/issues/758
+                                    index < _frozenRange[0]
                                 : // Otherwise we should maintain visible position
                                     getItemOffset(index) +
                                         // https://github.com/inokawa/virtua/issues/385
@@ -740,33 +731,44 @@ const createScroller = (store, isHorizontal) => {
             ];
         };
         if (smooth && isSmoothScrollSupported()) {
-            while (true) {
-                store.$update(ACTION_BEFORE_MANUAL_SMOOTH_SCROLL, getTargetOffset());
-                if (!store._hasUnmeasuredItemsInFrozenRange()) {
-                    break;
-                }
-                const [promise, unsubscribe] = waitForMeasurement();
-                try {
-                    if (!(await promise)) {
-                        // canceled
-                        return;
+            store.$update(ACTION_BEFORE_MANUAL_SMOOTH_SCROLL, getTargetOffset());
+            // https://github.com/inokawa/virtua/issues/590
+            microtask(async () => {
+                while (true) {
+                    let measuring = false;
+                    for (let [i, end] = store.$getRange(); i <= end; i++) {
+                        if (store.$isUnmeasuredItem(i)) {
+                            measuring = true;
+                            break;
+                        }
+                    }
+                    if (!measuring) {
+                        break;
+                    }
+                    const [promise, unsubscribe] = waitForMeasurement();
+                    try {
+                        if (!(await promise)) {
+                            // canceled
+                            return;
+                        }
+                    }
+                    finally {
+                        unsubscribe();
                     }
                 }
-                finally {
-                    unsubscribe();
-                }
-            }
-            viewportElement.scrollTo({
-                [isHorizontal ? "left" : "top"]: normalizeOffset(getTargetOffset(), isHorizontal),
-                behavior: "smooth",
+                store.$update(ACTION_MANUAL_SCROLL);
+                viewportElement.scrollTo({
+                    [isHorizontal ? "left" : "top"]: normalizeOffset(getTargetOffset(), isHorizontal),
+                    behavior: "smooth",
+                });
             });
         }
         else {
             while (true) {
                 const [promise, unsubscribe] = waitForMeasurement();
                 try {
-                    viewportElement[scrollOffsetKey] = normalizeOffset(getTargetOffset(), isHorizontal);
                     store.$update(ACTION_MANUAL_SCROLL);
+                    viewportElement[scrollOffsetKey] = normalizeOffset(getTargetOffset(), isHorizontal);
                     if (!(await promise)) {
                         // canceled or finished
                         return;
@@ -794,14 +796,13 @@ const createScroller = (store, isHorizontal) => {
                         style[overflowKey] = prev;
                     });
                 }
+                // Use absolute position not to exceed scrollable bounds
+                // https://github.com/inokawa/virtua/discussions/475
+                viewport[scrollOffsetKey] = store.$getScrollOffset() + jump;
                 if (shift) {
-                    viewport[scrollOffsetKey] = store.$getScrollOffset() + jump;
                     // https://github.com/inokawa/virtua/issues/357
                     cancelScroll && cancelScroll();
                 }
-                else {
-                    viewport[scrollOffsetKey] += jump;
-                }
             });
             initialized[1](true);
         },
@@ -905,34 +906,46 @@ const createWindowScroller = (store, isHorizontal) => {
         };
         const window = getCurrentWindow(getCurrentDocument(containerElement));
         if (smooth && isSmoothScrollSupported()) {
-            while (true) {
-                store.$update(ACTION_BEFORE_MANUAL_SMOOTH_SCROLL, getTargetOffset());
-                if (!store._hasUnmeasuredItemsInFrozenRange()) {
-                    break;
-                }
-                const [promise, unsubscribe] = waitForMeasurement();
-                try {
-                    if (!(await promise)) {
-                        return;
+            store.$update(ACTION_BEFORE_MANUAL_SMOOTH_SCROLL, getTargetOffset());
+            // https://github.com/inokawa/virtua/issues/590
+            microtask(async () => {
+                while (true) {
+                    let measuring = false;
+                    for (let [i, end] = store.$getRange(); i <= end; i++) {
+                        if (store.$isUnmeasuredItem(i)) {
+                            measuring = true;
+                            break;
+                        }
+                    }
+                    if (!measuring) {
+                        break;
+                    }
+                    const [promise, unsubscribe] = waitForMeasurement();
+                    try {
+                        if (!(await promise)) {
+                            // canceled
+                            return;
+                        }
+                    }
+                    finally {
+                        unsubscribe();
                     }
                 }
-                finally {
-                    unsubscribe();
-                }
-            }
-            window.scroll({
-                [isHorizontal ? "left" : "top"]: normalizeOffset(getTargetOffset(), isHorizontal),
-                behavior: "smooth",
+                store.$update(ACTION_MANUAL_SCROLL);
+                window.scroll({
+                    [isHorizontal ? "left" : "top"]: normalizeOffset(getTargetOffset(), isHorizontal),
+                    behavior: "smooth",
+                });
             });
         }
         else {
             while (true) {
                 const [promise, unsubscribe] = waitForMeasurement();
                 try {
+                    store.$update(ACTION_MANUAL_SCROLL);
                     window.scroll({
                         [isHorizontal ? "left" : "top"]: normalizeOffset(getTargetOffset(), isHorizontal),
                     });
-                    store.$update(ACTION_MANUAL_SCROLL);
                     if (!(await promise)) {
                         return;
                     }
@@ -950,16 +963,13 @@ const createWindowScroller = (store, isHorizontal) => {
             const document = getCurrentDocument(container);
             const window = getCurrentWindow(document);
             const documentBody = document.body;
-            scrollObserver = createScrollObserver(store, window, isHorizontal, () => normalizeOffset(window[scrollOffsetKey], isHorizontal), (jump, shift) => {
+            scrollObserver = createScrollObserver(store, window, isHorizontal, () => normalizeOffset(window[scrollOffsetKey], isHorizontal), (jump) => {
+                // Use absolute position not to exceed scrollable bounds
+                // https://github.com/inokawa/virtua/discussions/475
                 // TODO support case two window scrollers exist in the same view
-                if (shift) {
-                    window.scroll({
-                        [isHorizontal ? "left" : "top"]: store.$getScrollOffset() + jump,
-                    });
-                }
-                else {
-                    window.scrollBy(isHorizontal ? jump : 0, isHorizontal ? 0 : jump);
-                }
+                window.scroll({
+                    [isHorizontal ? "left" : "top"]: store.$getScrollOffset() + jump,
+                });
             }, () => calcOffsetToViewport(container, documentBody, window, isHorizontal));
             initialized[1](true);
         },