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: Scroller is broken when scrollHeight is flex #16246

Open
sotjdisc opened this issue Aug 16, 2024 · 6 comments · May be fixed by #16273
Open

Table: Scroller is broken when scrollHeight is flex #16246

sotjdisc opened this issue Aug 16, 2024 · 6 comments · May be fixed by #16273
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible

Comments

@sotjdisc
Copy link

sotjdisc commented Aug 16, 2024

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

  1. Open stackblitz example and scroll down with mouse wheel
  2. Observe scrollbars on the right while scrolling

Expected behavior

  1. Same as with primeng version prior to 17.18.8
@sotjdisc sotjdisc added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Aug 16, 2024
@SaajRP
Copy link

SaajRP commented Aug 16, 2024

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.

(#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

(#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

@sotjdisc
Copy link
Author

It is not related to changes in virtualScrollItemSize . In the example, i am using the default sizes.

@SaajRP
Copy link

SaajRP commented Aug 16, 2024

@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 #16185

@ZeroZeroOne-dev
Copy link

bump, we're experiencing the same issue

@johannes-wolf johannes-wolf linked a pull request Aug 22, 2024 that will close this issue
johannes-wolf added a commit to Klebert-Engineering/primeng that referenced this issue Aug 22, 2024
@mkutowski
Copy link

Yep most tables using scrollHeight="flex" + virtualScroll="true" are broken. Also the table header disappears halfway when scrolling to 50% of the table.

@Dedme
Copy link

Dedme commented Sep 5, 2024

i want to blame this commit - e7b611b

i believe this PR will fix it - please merge - as all flexheight tables/trees are broken atm.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants