Grid with Virtual Scrolling and Detail Rows does not scroll to the bottom

[WissamProgress]

When enabling virtual scrolling for the Grid, and rendering detail rows, scrolling down makes the Grid rows repeat and it does not allow scrolling to the rows below. bugvirtualscrollwithdetailcomponent.gif https://stackblitz.com/edit/react-qvpst4-cwbqhl?file=app%2Fmain.tsx,app%2Finterfaces.ts

Ticket ID: 1614541

[kdikov82]

Currently we do not support detail rows with virtual scrolling, because we do not know the height of each detail row and that makes it impossible for the fake scrollbar to have correct height. In order to support detail rows we need to implement detailRowHeight property as in Kendo UI (we have logged issue for this):

• https://github.com/telerik/kendo-react/issues/299

[WissamProgress]

Also reported in Ticket ID: 1615941

[WissamProgress]

In order to have Virtual Scrolling work with Detail Rows, it is required to set the detailRowHeight property to the detail component height, the total property to the data length, and pageSize to at least twice the number of visible rows in the Grid:

• https://stackblitz.com/edit/react-qvpst4-onxfgq?file=app%2Fmain.tsx

[kdikov82]

I am re-opening the issue, because with expanded detail rows, scrolling through the items will randomly jump and skip items: https://stackblitz.com/edit/react-qvpst4-mdxqn2?file=app%2Fmain.tsx

In the above example, the issue can be observed when you scroll down to item with id 17 (it jumps to id 20); 33 to 37