[Bug]: Scrollbar thumb desynchronization and "slipping" when dragging with large getRowHeight
Link to reproducible scenario
https://jsfiddle.net/xopa75hd/4/
Describe the bug
There is a significant desynchronization between the mouse cursor and the scrollbar thumb (the draggable part of the scrollbar) when dragging to scroll through the grid. This occurs specifically when using the getRowHeight callback.
As the user drags the scrollbar downwards to reach the end of the dataset, the thumb does not maintain a 1:1 position with the mouse pointer. It "slips" or "lags" behind, or sometimes jumps, because the grid seems to be recalculating the total virtual height dynamically during the scroll action.
Reproduction Steps
- Open a grid with a medium-to-large dataset (e.g., 300+ rows).
- Set a custom row height using the callback:
getRowHeight={() => 100}. - Attempt to grab the vertical scrollbar thumb with the mouse and drag it steadily from top to bottom.
- Observe: The thumb drifts away from the mouse cursor, making it difficult to precisely navigate to the end of the list.
Live Example
The issue is reproducible even in the official AG Grid documentation: AG Grid Row Height Documentation - getRowHeight Example
Expected Behavior
The scrollbar thumb should remain perfectly synchronized with the mouse cursor during a drag operation, providing a smooth and predictable scrolling experience regardless of the row height calculation method.
Actual Behavior
The scrollbar thumb loses synchronization with the mouse cursor. This suggests an issue with how the virtual scroll height is estimated or updated when getRowHeight is used, compared to a static rowHeight property.
Environment
- AG Grid version: 35.2.0 (and reproducible on current docs)
- Framework: React 19.2.4 (also reproducible in Vanilla JS)
- Browser: Tested on Chrome/Edge (latest)
- OS: Windows
Additional Context
The problem becomes more pronounced as the value returned by getRowHeight increases (e.g., 100px vs the default 42px). It appears the virtualization engine struggles to map the scrollbar track percentage to the actual pixel offset when rows are tall and calculated via callback.
Version
35.2.0
Does the issue occur for a specific framework only?
All languages
Is the issue only observable on a specific browser?
Chrome
Source: ag-grid/ag-grid