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

Closed
sotjdisc opened this issue Aug 16, 2024 · 6 comments · Fixed by #16273
Closed

Table: Scroller is broken when scrollHeight is flex #16246

sotjdisc opened this issue Aug 16, 2024 · 6 comments · Fixed by #16273
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working v18-port
Milestone

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

@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.

@cetincakiroglu cetincakiroglu added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Sep 26, 2024
@cetincakiroglu cetincakiroglu added this to the 17.18.11 milestone Sep 26, 2024
cetincakiroglu added a commit that referenced this issue Sep 26, 2024
…ble-scrolling

Fix #16246 TreeTable Spacer Size Calculation
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working v18-port
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants