useVirtualList gets no update on test cases

[eliamartani]

Describe the bug

The issue is that the useVirtualList is not providing an updated list when running the application through unit tests. Making the application to behave as if there is no generated content (list) at all.

This issue is captured when the container is changed dynamically, in cases where the container is only visible in certain circumstances. The application starts the composable, the composable gets the reference of container but then the returned list is forever empty.

What happens is that the composable has useWatchForSizes and this function awaits for some change in container, that doesn't happen because it was changed dynamically and the only way to know is through size but size doesn't trigger the watch. Making list always empty.

Reproduction

don't have a link for that yet

System Info

System:
    OS: macOS 14.4.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 84.56 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
    pnpm: 8.14.1 - ~/.nvm/versions/node/v20.10.0/bin/pnpm
  Browsers:
    Brave Browser: 120.1.61.114
    Chrome: 124.0.6367.93
    Chrome Canary: 126.0.6452.0
    Edge: 124.0.2478.67
    Safari: 17.4.1

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• The provided reproduction is a minimal reproducible example of the bug.

[eliamartani]

#3855 contains the fix for the problem I detected