Fix virtualized table scrollbar width oscillation

The item table mixed fractional and integer widths to calculate scrollbar
padding. At certain pane sizes, changing that padding changed the table
width, causing ResizeObserver to measure and update it again. The loop made
the Info pane and PDF tab flicker and kept CPU busy while idle.

Calculate scrollbar width from matching integer measurements to stop the
feedback loop.

Cause of the reproduced loop: 7df21ed introduced the mixed-width
calculation; f3328b0 made ResizeObserver rerender the table immediately.

Potentially fixes these reports:
- https://forums.zotero.org/discussion/133865/pdf-reader-flickers-shakes-trembles-macos
- https://forums.zotero.org/discussion/133718/bug-after-updating-to-zotero-10-0-2-64-bit-on-windows
- https://forums.zotero.org/discussion/133764/zotero-10-0-2-high-cpu-usage-with-pdf-right-sidebar-open
This commit is contained in:
Martynas Bagdonas 2026-09-23 21:02:10 +01:00
parent ed8ca1bfce
commit 3ff64b658d

View file

@ -1670,7 +1670,9 @@ class VirtualizedTable extends React.Component {
const jsWindow = document.querySelector(`#${this._jsWindowID} .windowed-list`);
if (!jsWindow) return;
const header = document.querySelector(`#${this.props.id} .virtualized-table-header`);
const scrollbarWidth = jsWindow.parentElement.getBoundingClientRect().width - jsWindow.parentElement.clientWidth;
// Use matching integer measurements so fractional flex widths cannot make
// the header padding oscillate around a scrollbar-width boundary.
const scrollbarWidth = Math.max(0, jsWindow.parentElement.offsetWidth - jsWindow.parentElement.clientWidth);
header.style.setProperty('--scrollbar-width', `${scrollbarWidth}px`);
}