primefaces / primeng

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

p-tree: Using multiple Trees with Virtual Scroll within TabViews beaks the Virtual Scroll in Chrome #14883

Open bmpv666 opened 6 months ago

bmpv666 commented 6 months ago

Describe the bug

I have an application that uses TabView with several tabs and within each tab there's a Tree component with filter and Virtual Scroll to display some hierarchical data.

All Trees have a scrolling issue, where when scrolling down the scroll bar jumps up, and the Tree returns to the top. Only the Tree in the last Tab does not show any issues.

Tested in Chrome, where the issue was originally noted, and Firefox where everything works as expected.

Environment

-

Reproducer

https://stackblitz.com/edit/tzszub-qaj2mg?file=src%2Fapp%2Fdemo%2Ftree-basic-demo.html

Angular version

16.2.12

PrimeNG version

17.7.0, also tested with 16.9.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.16.0

Browser(s)

Chrome

Steps to reproduce the behavior

  1. In the reproducer open Documents and try to scroll, should see the issue.
  2. Select the second tab, should also see the issue.
  3. Select the third tab, should NOT see the issue.
  4. Uppon returning to the first tab, the scroll is ok (I'm not seeing this behaviour in my application).

Expected behavior

Scrolling should just work.

benmi18 commented 6 months ago

i am having the same issue with primeNG version 14 as well. when using p-tree with virtual scrolling inside a p-dialog. i have added p-tree with p-dialog in the example @bmpv666 provided when all the virtualScroll are true the scrolling in p-tree in the p-dialog starts to jump like crazy, once i switched the tabs virtualScroll to false the p-tree in the p-dialog virtualScroll works as expected https://stackblitz.com/edit/tzszub-yvvrtn?file=src%2Fapp%2Fdemo%2Ftree-basic-demo.ts,src%2Fapp%2Fdemo%2Ftree-basic-demo.html