[BUG] followOutput does not scroll al the way to bottom

[singpolyma]

Describe the bug

Setting <Virtuoso followOutput={true} alignToBottom={true} startReached={onYReachStart} firstItemIndex={Number.MAX_SAFE_INTEGER - currentMessages.length} data={currentMessages} itemContent={...} /> adding new items when scrolled to the bottom does scroll down, but often leaves some px away from the bottom that is not scrolled to.

Reproduction https://codesandbox.io/p/sandbox/intelligent-dawn-cn35dz?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clxv2ds2a00062066grxd1p6n%2522%252C%2522sizes%2522%253A%255B100%252C0%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clxv2ds2a0002206600g5clyq%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clxv2ds2a000320666a2pqukk%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clxv2ds2a00052066l4b2byqr%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clxv2ds2a0002206600g5clyq%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clxv2ds2a00012066qs830qb7%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fsrc%252Findex.tsx%2522%257D%255D%252C%2522id%2522%253A%2522clxv2ds2a0002206600g5clyq%2522%252C%2522activeTabId%2522%253A%2522clxv2ds2a00012066qs830qb7%2522%257D%252C%2522clxv2ds2a00052066l4b2byqr%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clxv2ds2a00042066qavivrve%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522id%2522%253A%2522clxv2ds2a00052066l4b2byqr%2522%252C%2522activeTabId%2522%253A%2522clxv2ds2a00042066qavivrve%2522%257D%252C%2522clxv2ds2a000320666a2pqukk%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clxv2ds2a000320666a2pqukk%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Afalse%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

To Reproduce Steps to reproduce the behavior:

1. Go to the sandbox
2. Click on add many times

Expected behavior Should always be scrolled to the complete bottom

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: Debian
• Browser: Firefox

[singpolyma]

Adding a line here https://github.com/petyosi/react-virtuoso/blob/master/src/scrollToIndexSystem.ts#L93 that says top += 1000 fixes my use case, but obviously that's not a real solution.

[petyosi]

If you're going to build a chat interface, I strongly recommend the MessageList component. It covers a bunch of specifics for that particular UI.

As per the problem you experience - please check the troubleshooting section of the docs.

[singpolyma]

I did look at MessageList but as my app is open source, I cannot use it.

Thanks for the pointer, I don't know how I missed this particular troubleshooting section. How embarassing. I removed margin from the outer element and it is working now. thanks so much.