Fallback to default cache if specified cache is shorter/longer

src/core/cache.spec.ts

@@ -782,9 +782,52 @@ describe(initCache.name, () => {
  `);
  });
 
- it("should create cache from snapshot", () => {
- expect(initCache(10, 23, [[0, 1, 2, 3, 4, 5, 6, 7, 8, 9], 123]))
- .toMatchInlineSnapshot(`
+ it("should restore cache from snapshot", () => {
+ const itemLength = 10;
+ const cache = initCache(itemLength, 23, [
+ [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
+ 123,
+ ]);
+ expect(cache).toMatchInlineSnapshot(`
+ {
+ "_computedOffsetIndex": -1,
+ "_defaultItemSize": 123,
+ "_length": 10,
+ "_offsets": [
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ ],
+ "_sizes": [
+ 0,
+ 1,
+ 2,
+ 3,
+ 4,
+ 5,
+ 6,
+ 7,
+ 8,
+ 9,
+ ],
+ }
+ `);
+ expect(cache._length).toBe(itemLength);
+ expect(cache._sizes.length).toBe(itemLength);
+ expect(cache._offsets.length).toBe(itemLength);
+ });
+
+ it("should restore cache from snapshot which has shorter length", () => {
+ const itemLength = 10;
+ const cache = initCache(itemLength, 23, [[0, 1, 2, 3, 4], 123]);
+ expect(cache).toMatchInlineSnapshot(`
  {
  "_computedOffsetIndex": -1,
  "_defaultItemSize": 123,
@@ -807,14 +850,59 @@ describe(initCache.name, () => {
  2,
  3,
  4,
- 5,
- 6,
- 7,
- 8,
- 9,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
  ],
  }
  `);
+ expect(cache._length).toBe(itemLength);
+ expect(cache._sizes.length).toBe(itemLength);
+ expect(cache._offsets.length).toBe(itemLength);
+ });
+
+ it("should restore cache from snapshot which has longer length", () => {
+ const itemLength = 10;
+ const cache = initCache(itemLength, 23, [
+ [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
+ 123,
+ ]);
+ expect(cache).toMatchInlineSnapshot(`
+ {
+ "_computedOffsetIndex": -1,
+ "_defaultItemSize": 123,
+ "_length": 10,
+ "_offsets": [
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ -1,
+ ],
+ "_sizes": [
+ 0,
+ 1,
+ 2,
+ 3,
+ 4,
+ 5,
+ 6,
+ 7,
+ 8,
+ 9,
+ ],
+ }
+ `);
+ expect(cache._length).toBe(itemLength);
+ expect(cache._sizes.length).toBe(itemLength);
+ expect(cache._offsets.length).toBe(itemLength);
  });
 });
 

src/core/cache.ts

@@ -167,7 +167,14 @@ export const initCache = (
 ): Cache => {
  return {
  _defaultItemSize: snapshot ? snapshot[1] : itemSize,
- _sizes: snapshot ? snapshot[0] : fill([], length),
+ _sizes:
+ snapshot && snapshot[0]
+ ? // https://github.com/inokawa/virtua/issues/441
+ fill(
+ snapshot[0].slice(0, min(length, snapshot[0].length)),
+ max(0, length - snapshot[0].length)
+ )
+ : fill([], length),
  _length: length,
  _computedOffsetIndex: -1,
  _offsets: fill([], length),

src/react/Virtualizer.tsx

@@ -114,6 +114,8 @@
  horizontal?: boolean;
  /**
  * You can restore cache by passing a {@link CacheSnapshot} on mount. This is useful when you want to restore scroll position after navigation. The snapshot can be obtained from {@link VirtualizerHandle.cache}.
+ *
+ * **The length of items should be the same as when you take the cache, otherwise restoration may not work as expected.**
  */
  cache?: CacheSnapshot;
  /**
@@ -307,7 +309,7 @@
  if (!onRangeChangeProp) return;
 
  onRangeChangeProp(startIndex, endIndex);
  }, [startIndex, endIndex]);
 
  useImperativeHandle(
  ref,
@@ -331,7 +333,7 @@
  scrollBy: scroller._scrollBy,
  };
  },
  []
  );
 
  for (let i = overscanedRangeStart, j = overscanedRangeEnd; i <= j; i++) {

src/react/WindowVirtualizer.tsx

@@ -73,6 +73,8 @@
  horizontal?: boolean;
  /**
  * You can restore cache by passing a {@link CacheSnapshot} on mount. This is useful when you want to restore scroll position after navigation. The snapshot can be obtained from {@link WindowVirtualizerHandle.cache}.
+ *
+ * **The length of items should be the same as when you take the cache, otherwise restoration may not work as expected.**
  */
  cache?: CacheSnapshot;
  /**
@@ -213,7 +215,7 @@
  if (!onRangeChangeProp) return;
 
  onRangeChangeProp(startIndex, endIndex);
  }, [startIndex, endIndex]);
 
  useImperativeHandle(
  ref,
@@ -224,7 +226,7 @@
  },
  };
  },
  []
  );
 
  for (