Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

virtualRow will contain one empty item when size is 0 (since v2.2.4) #52

Closed
JReinhold opened this issue Aug 26, 2020 · 2 comments · Fixed by #53
Closed

virtualRow will contain one empty item when size is 0 (since v2.2.4) #52

JReinhold opened this issue Aug 26, 2020 · 2 comments · Fixed by #53
Labels

Comments

@JReinhold
Copy link

Bug Report

I'm experiencing a bug, where when having an empty list (ie. size parameter in useVirtual is 0), the returned virtualRow array still contains a single element. That single element is "empty", as it is an object that only contains a measureRef key, and none of the other keys (index, start, end, size).

Reproduction

I've created a minimal reproduction of the issue at https://codesandbox.io/s/amazing-glade-eo7vw?file=/src/index.js which is a fork of the "Dynamic Rows" example. It starts off with having an empty list, and then after 5 seconds, changes the list to have items. The console log (and the error) shows that we start with an empty virtualRow, and then get correct virtualRows after 5 seconds.
What should happen instead, is that no console logs are present in the beginning, because the virtualRows array should be empty.

Context

I believe this bug was introduced in version 2.2.4 by #48. Downgrading to version 2.2.3 "fixes" the issue. But as the changes in that PR are rather substantial, I haven't been able to pinpoint exactly where the problem is. Pinging @mogelbrod

This might be the same bug as #49.

Workaround

Current workarounds are:

  1. downgrade to version 2.2.3
  2. before mapping through the virtualRows, ensure that you have at least one raw item (and NOT just one virtualRow), eg.
<div>
  {items.length > 0 && rowVirtualizer.virtualItems.map((virtualRow) => {
    ...return rows
  })}
</div>
@mogelbrod
Copy link
Contributor

Thanks for the ping!
I was sure I had tested this rather obvious case, but apparently not with the final code - my bad 😞
This project could definitely use some additional test cases, if anybody's up for writing some 😅

@tannerlinsley
Copy link
Collaborator

🎉 This issue has been resolved in version 2.2.5 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants