Item/collection tree: Resize using ResizeObserver, not debounce (#5977)

This commit is contained in:
Abe Jellinek 2026-06-30 08:44:18 -04:00 committed by GitHub
parent 9cffc1c7c2
commit f3328b02ee
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 6 additions and 32 deletions

View file

@ -1102,9 +1102,8 @@ class VirtualizedTable extends React.Component {
this._setXulTooltip();
this._topDiv.style.setProperty("--first-column-extra-width", `${this.firstColumnExtraWidth}px`);
window.addEventListener("resize", () => {
this._debouncedRerender();
});
this._resizeObserver = new ResizeObserver(() => this.rerender());
this._resizeObserver.observe(this._jsWindow.targetElement);
if (this.props.stickySectionHeaders) {
this._jsWindow.targetElement.addEventListener('scroll', this._updateStickySectionHeader, { passive: true });
@ -1117,6 +1116,7 @@ class VirtualizedTable extends React.Component {
}
componentWillUnmount() {
this._resizeObserver?.disconnect();
if (this.props.stickySectionHeaders && this._jsWindow) {
this._jsWindow.targetElement.removeEventListener('scroll', this._updateStickySectionHeader);
}
@ -1589,8 +1589,6 @@ class VirtualizedTable extends React.Component {
return parseFloat(height.split('px')[0]);
}
_debouncedRerender = Zotero.Utilities.debounce(this.rerender, 200);
_updateWidth() {
if (!this.props.showHeader) return;
const jsWindow = document.querySelector(`#${this._jsWindowID} .windowed-list`);

View file

@ -252,16 +252,6 @@ var LibraryTree = class LibraryTree extends React.Component {
this.tree && this.tree.scrollToRow(index);
}
updateHeight = () => {
this.forceUpdate(() => {
if (this.tree) {
this.tree.rerender();
}
});
};
updateHeightDebounced = Zotero.Utilities.debounce(this.updateHeight, 200);
updateFontSize() {
this.tree.updateFontSize();
}

View file

@ -1675,9 +1675,6 @@ var ZoteroPane = new function () {
}
this.tagSelector.handleResize();
}
if (this.collectionsView) {
this.collectionsView.updateHeightDebounced();
}
}, 100);
@ -1949,12 +1946,8 @@ var ZoteroPane = new function () {
document.getElementById('zotero-tb-search').updateMode();
let refreshPromise;
if (state === 'open' && oldState === 'collapsed'
|| state === 'collapsed' && oldState === 'open') {
// State change only causes visual refresh - update the tree height
this.itemsView.updateHeight();
}
else {
if (!(state === 'open' && oldState === 'collapsed'
|| state === 'collapsed' && oldState === 'open')) {
// State change changes displayed items - refresh the tree
refreshPromise = this._refreshAdvancedSearchPane();
}
@ -7199,11 +7192,6 @@ var ZoteroPane = new function () {
}
this.updateLayoutConstraints();
if (ZoteroPane.itemsView) {
// Need to immediately rerender the items here without any debouncing
// since tree height will have changed
ZoteroPane.itemsView.updateHeight();
}
ZoteroContextPane.update();
Zotero_Tabs.updateSidebarLayout();
};
@ -7387,9 +7375,6 @@ var ZoteroPane = new function () {
var collectionsPaneWidth = collectionsPane.getBoundingClientRect().width;
tagSelector.style.maxWidth = collectionsPaneWidth + 'px';
if (ZoteroPane.itemsView) {
ZoteroPane.itemsView.updateHeightDebounced();
}
this.handleTagSelectorResize();

View file

@ -131,6 +131,7 @@ function ZoteroLoader({
clearInterval: win.clearInterval,
requestAnimationFrame: win.requestAnimationFrame,
cancelAnimationFrame: win.requestAnimationFrame,
ResizeObserver: win.ResizeObserver,
};
for (const name in injectedGlobals) {
this.loader.globals[name] = injectedGlobals[name];