From 7e0b2aba1c7b931e457e4eca63bc1f0ba595eb27 Mon Sep 17 00:00:00 2001 From: Rom Grk Date: Tue, 12 Aug 2025 11:45:10 -0400 Subject: [PATCH 1/3] fix: avoid running ResizeObserver effect needlessly --- packages/x-virtualizer/src/features/dimensions.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/x-virtualizer/src/features/dimensions.ts b/packages/x-virtualizer/src/features/dimensions.ts index b5ea7df2d2ad5..61ebe3a24f377 100644 --- a/packages/x-virtualizer/src/features/dimensions.ts +++ b/packages/x-virtualizer/src/features/dimensions.ts @@ -259,7 +259,10 @@ function useDimensions(store: Store, params: VirtualizerParams, _api: ); React.useEffect(() => debouncedUpdateDimensions?.clear, [debouncedUpdateDimensions]); - useLayoutEffect(() => observeRootNode(refs.container.current, store), [refs, store]); + useLayoutEffect( + () => observeRootNode(refs.container.current, store), + [refs.container.current, store], + ); useLayoutEffect(updateDimensions, [updateDimensions]); From d236cd116c6c3e1bd82d41808b8f6bfdc9489e77 Mon Sep 17 00:00:00 2001 From: Rom Grk Date: Tue, 12 Aug 2025 11:57:32 -0400 Subject: [PATCH 2/3] lint --- packages/x-virtualizer/src/features/dimensions.ts | 14 +++++--------- 1 file changed, 5 insertions(+), 9 deletions(-) diff --git a/packages/x-virtualizer/src/features/dimensions.ts b/packages/x-virtualizer/src/features/dimensions.ts index 61ebe3a24f377..f0ce73490db56 100644 --- a/packages/x-virtualizer/src/features/dimensions.ts +++ b/packages/x-virtualizer/src/features/dimensions.ts @@ -121,6 +121,8 @@ function useDimensions(store: Store, params: VirtualizerParams, _api: }, } = params; + const containerNode = refs.container.current; + const updateDimensions = React.useCallback(() => { if (isFirstSizing.current) { return; @@ -132,10 +134,7 @@ function useDimensions(store: Store, params: VirtualizerParams, _api: // All the floating point dimensions should be rounded to .1 decimal places to avoid subpixel rendering issues // https://github.com/mui/mui-x/issues/9550#issuecomment-1619020477 // https://github.com/mui/mui-x/issues/15721 - const scrollbarSize = measureScrollbarSize( - params.refs.container.current, - params.dimensions.scrollbarSize, - ); + const scrollbarSize = measureScrollbarSize(containerNode, params.dimensions.scrollbarSize); const topContainerHeight = topPinnedHeight + rowsMeta.pinnedTopRowsTotalHeight; const bottomContainerHeight = bottomPinnedHeight + rowsMeta.pinnedBottomRowsTotalHeight; @@ -234,7 +233,7 @@ function useDimensions(store: Store, params: VirtualizerParams, _api: store.update({ dimensions: newDimensions }); }, [ store, - params.refs.container, + containerNode, params.dimensions.scrollbarSize, params.autoHeight, rowHeight, @@ -259,10 +258,7 @@ function useDimensions(store: Store, params: VirtualizerParams, _api: ); React.useEffect(() => debouncedUpdateDimensions?.clear, [debouncedUpdateDimensions]); - useLayoutEffect( - () => observeRootNode(refs.container.current, store), - [refs.container.current, store], - ); + useLayoutEffect(() => observeRootNode(containerNode, store), [containerNode, store]); useLayoutEffect(updateDimensions, [updateDimensions]); From 9cfc478403a88734e8cea7312249ddd749d8474d Mon Sep 17 00:00:00 2001 From: Rom Grk Date: Tue, 12 Aug 2025 12:14:12 -0400 Subject: [PATCH 3/3] fix: avoid dimensions warning message --- .../src/hooks/features/dimensions/useGridDimensions.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts b/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts index d11f339a6490d..5ef5d63c3b6bb 100644 --- a/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts +++ b/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts @@ -2,6 +2,7 @@ import * as React from 'react'; import { RefObject } from '@mui/x-internals/types'; import { useStoreEffect } from '@mui/x-internals/store'; +import { Size } from '@mui/x-virtualizer/models'; import { GridEventListener } from '../../../models/events'; import { ElementSize } from '../../../models'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; @@ -136,7 +137,7 @@ export function useGridDimensions(apiRef: RefObject, pr const errorShown = React.useRef(false); useGridEventPriority(apiRef, 'resize', (size) => { - if (!getRootDimensions().isReady) { + if (!getRootDimensions().isReady || size === Size.EMPTY) { return; } if (size.height === 0 && !errorShown.current && !props.autoHeight && !isJSDOM) {