primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.21k stars 4.55k forks source link

p-table: Virtual Scroll stops working properly when value updated while hidden #12627

Open conner-fallone opened 1 year ago

conner-fallone commented 1 year ago

Describe the bug

When using the Table with scroll and virtualScroll, the virtualization seems to get screwed up when the Table value is changed while hidden. When the value is set while hidden, when the table is no longer hidden, the table does not even show up. I've also seen some other inconsistencies in our app where the virtualization quickly gets out of sync every time the data is updated while hidden and comes back into view, until the table is no longer visible. Once this happens, there doesn't seem to be a good way to fix it other than refreshing. This also happens on NG15/PrimeNG15 even though my stackblitz is 14.

Environment

Not sure what else to add here. Similar issues are happening in our NG14/PrimeNG14 Angular Hybrid App

Reproducer

https://stackblitz.com/edit/angular-ilbjkh?file=src%2Fmain.ts,angular.json https://stackblitz.com/edit/angular-14-demo-fh71lf?file=src/app/home/home.component.html

Angular version

14.X

PrimeNG version

14.X

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

16.14.0

Browser(s)

No response

Steps to reproduce the behavior

  1. Create a scrollable table with virtualization <p-table [scrollable]="true" scrollHeight="300px" [virtualScroll]="true" [virtualScrollItemSize]="32">
  2. Make the container of the <p-table> hidden
  3. Update the value of <p-table> while its hidden
  4. Make the container of the <p-table> visible
  5. Notice that the <p-table> is not even showing anymore, and appears to have width/height set to 0

Expected behavior

Setting the value of the table should NOT have a negative impact while the table is hidden, and most certainly should not result in the table breaking. When the table is visible again, the virtualization should adjust itself accordingly.

RIDY01 commented 1 year ago

Having the same issue using treetable

conner-fallone commented 1 year ago

Added another example https://stackblitz.com/edit/angular-14-demo-fh71lf?file=src/app/home/home.component.html