diff --git a/packages/virtualized-lists/Lists/VirtualizedList.js b/packages/virtualized-lists/Lists/VirtualizedList.js index 9d4616f55a96..dec02369f50c 100644 --- a/packages/virtualized-lists/Lists/VirtualizedList.js +++ b/packages/virtualized-lists/Lists/VirtualizedList.js @@ -855,6 +855,7 @@ class VirtualizedList extends StateSafePureComponent< this._unregisterFromParent(false); // $FlowFixMe[incompatible-type] clearTimeout(this._updateCellsToRenderTimeoutID); + this._updateCellsToRenderTimeoutID = null; this._viewabilityTuples.forEach(tuple => { tuple.viewabilityHelper.dispose(); }); diff --git a/packages/virtualized-lists/Lists/__tests__/VirtualizedList-test.js b/packages/virtualized-lists/Lists/__tests__/VirtualizedList-test.js index e270af4649c9..5abd852d52a6 100644 --- a/packages/virtualized-lists/Lists/__tests__/VirtualizedList-test.js +++ b/packages/virtualized-lists/Lists/__tests__/VirtualizedList-test.js @@ -11,7 +11,7 @@ import VirtualizedList from '../VirtualizedList'; import {format} from 'node:util'; import * as React from 'react'; -import {createElement, createRef} from 'react'; +import {Activity, createElement, createRef} from 'react'; import {act, create} from 'react-test-renderer'; jest.useFakeTimers(); @@ -3048,6 +3048,47 @@ it('handles rapid prepends with coalesced scroll event (regression for #53542)', ).toBeGreaterThanOrEqual(0); }); +it('keeps rendering batches after being hidden and shown again', async () => { + const items = generateItems(20); + const ITEM_HEIGHT = 10; + const listRef = createRef(); + const props = { + ...baseItemProps(items), + ...fixedHeightItemLayoutProps(ITEM_HEIGHT), + }; + + const renderList = mode => ( + + + + ); + + let component; + await act(() => { + component = create(renderList('visible')); + }); + const list = listRef.current; + + // Schedules a batch that is still pending when the list gets hidden. + await act(() => { + list._onLayout({nativeEvent: {layout: {width: 10, height: 30}}}); + }); + + await act(() => { + component.update(renderList('hidden')); + }); + await act(() => { + component.update(renderList('visible')); + }); + + await act(() => { + list._onContentSizeChange(10, 200); + performAllBatches(); + }); + + expect(list.state.cellsAroundViewport.last).toBeGreaterThan(4); +}); + function generateItems(count, startKey = 0) { return Array(count) .fill()