virtualizer.getVirtualItems() return zero items for vanilla js project

[Dugnist]

Describe the bug

I need to implement virtual list in vanilla js.
I used this approach:

<script type="module" defer>
  import { Virtualizer } from 'https://cdn.jsdelivr.net/npm/@tanstack/virtual-core@3.2.0/+esm';
  // other code...
  // Initialize the virtualizer
  const virtualizer = new Virtualizer({
    debug: true,
    count: 10000, // The number of items in the list
    getScrollElement: () => container,
    estimateSize: () => 50, // The estimated size of each item
    overscan: 5, // How many items to render outside of the viewport
  });
  // other code...
  const items = virtualizer.getVirtualItems();
  // items.length always === 0
</script>

No matter what I do, the array of items is always empty. But virtualizer.measurementsCache.length === 10000.

Your minimal, reproducible example

https://codepen.io/Dugnist/pen/LYveoXQ

Steps to reproduce

<script type="module" defer>
  import { Virtualizer } from 'https://cdn.jsdelivr.net/npm/@tanstack/virtual-core@3.2.0/+esm';
</script>

const virtualizer = new Virtualizer({
    debug: true,
    count: 10000, // The number of items in the list
    getScrollElement: () => container,
    estimateSize: () => 50, // The estimated size of each item
    overscan: 5, // How many items to render outside of the viewport
  });

3

const items = virtualizer.getVirtualItems(); // -> []

Expected behavior

const items = virtualizer.getVirtualItems() should return array with more than zero items

How often does this bug happen?

None

Screenshots or Videos

No response

Platform

codepen

tanstack-virtual version

virtual-core@3.2.0

TypeScript version

vanilla js

Additional context

No response

Terms & Code of Conduct

• I agree to follow this project's Code of Conduct
• I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

[andrody]

same problem on safari

[piecyk]

@Dugnist you need to call virtualizer._willUpdate() that will register scroll events and rect size detection.