From 74716b5e646adc4df1dfb901130bdc4c9b289101 Mon Sep 17 00:00:00 2001
From: "Ivan.Yakovlev" <ivan.yakovlev@pochtavip.com>
Date: Fri, 7 Aug 2020 19:42:55 +0300
Subject: [PATCH] fix: rerender on wrapper height change

---
 src/List.tsx       | 10 ++++++++++
 tests/list.test.js | 10 ++++++++++
 2 files changed, 20 insertions(+)

diff --git a/src/List.tsx b/src/List.tsx
index f606b843..3230ed82 100644
--- a/src/List.tsx
+++ b/src/List.tsx
@@ -203,7 +203,17 @@ class List<T = any> extends React.Component<ListProps<T>, ListState<T>> {
       const diff = findListDiffIndex(prevData, data, this.getItemKey);
       changedItemIndex = diff ? diff.index : null;
     }
+    /** check if height changed */
+    if (this.cachedProps.height < height) {
+      const scrollPtg = getElementScrollPercentage(this.listRef.current);
+      const visibleCount = Math.ceil(height / itemHeight);
 
+      const { startIndex, endIndex } = getRangeIndex(scrollPtg, data.length, visibleCount);
+      this.setState({
+        startIndex,
+        endIndex,
+      });
+    }
     if (disabled) {
       // Should trigger `onSkipRender` to tell that diff component is not render in the list
       if (data.length > prevData.length) {
diff --git a/tests/list.test.js b/tests/list.test.js
index 2cd38a6d..419379cd 100644
--- a/tests/list.test.js
+++ b/tests/list.test.js
@@ -110,6 +110,16 @@ describe('List', () => {
       wrapper.setProps({ data, disabled: true });
       expect(onSkipRender).toHaveBeenCalled();
     });
+
+    it('should rerender rows when current height > previous height', () => {
+      scrollTop = 0;
+      const data = genData(100);
+      const wrapper = genList({ itemHeight: 20, height: 100, data, virtual: true });
+
+      wrapper.setProps({ height: 200 });
+      wrapper.update();
+      expect(wrapper.find('li').length).toEqual(11);
+    });
   });
 
   describe('status switch', () => {