CloudCannon / pagefind

Static low-bandwidth search at scale
https://pagefind.app
MIT License
3.66k stars 120 forks source link

ModularUI results do not update on scroll #625

Open ColeDCrawford opened 6 months ago

ColeDCrawford commented 6 months ago

When I load the Modular UI results, I get the first 5 or 6 results (enough to fill my screen in my layout) and then a bunch of loading components. Scrolling does not update the state of the "loading" results, but oddly, zooming out does. I am not using a placeholderTemplate but adding that makes no difference.

bglw commented 6 months ago

Interesting! Would be good to narrow down if this an issue with the browser or device you're on, or the site the Modular UI is being used on.

For the former — how does the search at https://cloudcannon.com/ behave? That's using the Modular UI, and should be loading correctly on scroll.

For the latter — can you share a link to your case where it isn't working? It's using a fairly standard IntersectionObserver so my only guess would be some outer layout/css that is causing those events to not trigger.

ColeDCrawford commented 6 months ago

The CloudCannon search behaves as expected.

I don't have this pushed anywhere that would be easy to review, but here's a screengrab:

https://github.com/CloudCannon/pagefind/assets/16374762/b98f21c1-e604-4852-81be-c9e5153b29da

The branch of this is at https://github.com/artshumrc/scrolls-astro/tree/improve-search-ui.

ColeDCrawford commented 6 months ago

It definitely seems to be a some sort of view issue. If I reload the page with devtools up, it only loads 2 results, and then if I undock devtools it shows 5 results ...

https://github.com/CloudCannon/pagefind/assets/16374762/9e83462f-e72c-4dec-852d-d9b925ff4595

ColeDCrawford commented 6 months ago

Any thoughts on this one?