Maximum element size prevents scrolling to the bottom for large tables

[pbaern]

trafficstars

Describe the bug

Each browser has a maximum allowable height for div elements. When the height vue-recycle-scroller__item-wrapper div exceeds this number I am no longer able to scroll below a certain index.

Reproduction

RecycleScroller with

• a list of 500.000 items
• an item-size of 80px

Dragging the scrollbar to the bottom, I am able to see the 419432'th row on the bottom but any attempt of scrolling downwards from here fails. The vue-recycle-scroller__item-wrapper has a height of 33.554.428px which is the maximum allowed height of a div for my browser (Chromium)

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
    Memory: 12.36 GB / 31.75 GB
  Binaries:
    Node: 14.19.0 - ~\AppData\Local\Volta\tools\image\node\14.19.0\node.EXE
    Yarn: 1.22.19 - C:\Program Files\Volta\yarn.EXE
    npm: 6.14.16 - ~\AppData\Local\Volta\tools\image\node\14.19.0\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (107.0.1418.26)
    Internet Explorer: 11.0.22000.120
  npmPackages:
    vue: 2.6.* => 2.6.14
    vue-virtual-scroller: 1.0.10 => 1.0.10

Used Package Manager

npm

Validations

• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[wanghenmin]

I meet the same problem，how do you solve the problem , thanks!