Table: Scroller is broken when scrollHeight is flex
Describe the bug
The scrolling experience is broken. Scroll bars are unusable and you cannot scroll to the end of the table with them.
Environment
Chrome: latest
Reproducer
https://stackblitz.com/edit/es8wpw-mesec1
Angular version
17.3.12
PrimeNG version
17.18.9
Build / Runtime
Angular CLI App
Language
TypeScript
Node version (for AoT issues node --version)
whatever stackblitz is using now
Browser(s)
No response
Steps to reproduce the behavior
- Open stackblitz example and scroll down with mouse wheel
- Observe scrollbars on the right while scrolling
Expected behavior
- Same as with primeng version prior to 17.18.8
I can confirm that it's completely broken on PrimeNG 17.8.9 and has made virtual scrolling tables, completely unusable. Once, I scroll past the first "page", all entries after it are stuck in a loading state, and the scroll bar jumps around. Changing the virtualScrollItemSize doesn't seem to make a difference, and is only resolved when setting the scrollHeight to a fixed number of pixels
https://stackblitz.com/edit/oetsny-rdsoxe?file=src%2Fapp%2Fdemo%2Ftable-virtual-scroll-lazy-demo.ts
On PrimeNg 17.8.8, it was also broken, with the bugs stated below.
(https://github.com/primefaces/primeng/issues/16185) If I set the virtualScrollItemSize to be less than 50, when I to scrolled to the very bottom of the virtual scrolling, lazy loaded table, I was unable to see the very last few rows in the table, and scrollbar would jump up when trying to scroll to them
(https://github.com/primefaces/primeng/issues/13370) If the table has the rows attribute set, when I scroll from the top to the bottom of the table (so I effectively skipped some "pages" in the middle), then scroll up to the middle of table, the table would be stuck in a loading state - this has been been a bug for over a year, since at least PrimeNG 15.4.1
I believe the virtual scrolling implementation needs to be be re-evaluated as it has a lot of different bugs
It is not related to changes in virtualScrollItemSize . In the example, i am using the default sizes.
@sotjdisc, I understand, this bug happens when setting the scrollHeight to 'flex'. I was adjusting the virtualScrollItemSize, to see if there was any relation to the existing bug https://github.com/primefaces/primeng/issues/16185
bump, we're experiencing the same issue
Yep most tables using scrollHeight="flex" + virtualScroll="true" are broken. Also the table header disappears halfway when scrolling to 50% of the table.
i want to blame this commit - https://github.com/primefaces/primeng/commit/e7b611ba4c554aa4beeebe7a8a1ac8d74534507e
i believe this PR will fix it - please merge - as all flexheight tables/trees are broken atm.
This issue exists in v19.0.5
Seems that this commit is missing: https://github.com/primefaces/primeng/pull/16273/files#diff-c6cd7998571020577d558a44a0cc68561866f97f2b68ed9a97926e4e102084ef
@mehmetcetin01140 Can we also port this to v19 ?
I see it's working now with 19.1.0 - thank you!
So, it seems like this is broken again in 20.2.0.
This issue exists in v19.0.5
Seems that this commit is missing: https://github.com/primefaces/primeng/pull/16273/files#diff-c6cd7998571020577d558a44a0cc68561866f97f2b68ed9a97926e4e102084ef
This commit seems to be missing again: https://github.com/primefaces/primeng/blob/5c36dd9ea4b45e150bafdda636e0dd6980ff3fd6/packages/primeng/src/scroller/scroller.ts#L938-L954