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

Table rows don't get appended on scroll if height is too large #248

Open
mootari opened this issue Mar 4, 2023 · 3 comments
Open

Table rows don't get appended on scroll if height is too large #248

mootari opened this issue Mar 4, 2023 · 3 comments
Labels
bug Something isn't working

Comments

@mootari
Copy link
Member

mootari commented Mar 4, 2023

Given a table with a fixed height

Inputs.table(penguins, { height: 400 })

scrolling through the table won't append new rows.

The exact height is dependent on various factors like page zoom. I tested (and found) the issue in Chrome, Firefox and Safari. Note that Safari may still load new rows on the first scroll.

Demonstration:

Kapture.2023-03-04.at.11.57.18.mp4
@mootari mootari added the bug Something isn't working label Mar 4, 2023
@tophtucker
Copy link
Contributor

Reproduction: https://observablehq.com/d/686eb071dc56c459. For me, it breaks at ≥ 379px tall, and above ~555px you can see even before you try to scroll that only the first page has loaded.

@mootari
Copy link
Member Author

mootari commented Mar 7, 2024

@simond shared the correct workaround in #261: Increase the number of rows until they expand enough beyond the visible area.

(I used to set - and recommend - {rows: Infinity} because I misunderstood what the option actually does.)

@mootari
Copy link
Member Author

mootari commented Mar 7, 2024

A fix might be to attach an IntersectionObserver to the last row and have that trigger appendRows() for the next chunk.

@mootari mootari changed the title Table rows don't materialize on scroll if height is too large Table rows don't get appended on scroll if height is too large Mar 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants