fix: Flush debounceIncreasePool on loadPage if scrolling (#2131)

Fixes: #2107
Warranty: Fixes TreeGrid regression where blank areas are displayed when an initial scroll happens.

Author: tulioag

src/vaadin-grid-data-provider-mixin.html

@@ -345,7 +345,7 @@
           filters: this._mapFilters(),
           parentItem: cache.parentItem
         };
-
+        this._debounceIncreasePool && this._debounceIncreasePool.flush();
         this.dataProvider(params, (items, size) => {
           if (size !== undefined) {
             cache.size = size;

test/data-provider.html

@@ -366,7 +366,7 @@
             // Effective size should change in between the data requests
             expect(renderSpy.called).to.be.true;
             expect(increasePoolSpy.callCount).to.above(1);
-            expect(updateItemSpy.callCount).to.be.below(90);
+            expect(updateItemSpy.callCount).to.be.below(180);
           });
 
           it('should keep item expanded on itemIdPath change', () => {

test/scroll-to-index.html

@@ -39,6 +39,13 @@
     </template>
   </test-fixture>
 
+  <test-fixture id="treeGrid">
+    <template>
+      <vaadin-grid style="width: 200px; height: 500px;">
+        <vaadin-grid-tree-column path="name" header="foo" item-has-children-path="hasChildren"></vaadin-grid-tree-column>
+      </vaadin-grid>
+    </template>
+  </test-fixture>
   <script>
     describe('Scroll to index', () => {
 
@@ -228,8 +235,39 @@
       });
 
     });
-  </script>
+    describe('Tree grid', () => {
+
+      // Issue https://github.com/vaadin/vaadin-grid/issues/2107
+      it('should display correctly when scrolled to bottom immediately after setting dataProvider', done => {
+        const grid = fixture('treeGrid');
+        grid.size = 1;
+        const numberOfChidren = 250;
+        grid.itemIdPath = 'name';
+        const PARENT = {name: 'PARENT', hasChildren: true};
+        grid.dataProvider = ({page, parentItem}, cb) => {
+          setTimeout(() => {
+            if (!parentItem) {
+              cb([PARENT], 1);
+              return;
+            }
 
+            const scope = parentItem.name;
+            const offset = page * grid.pageSize;
+            cb([...new Array(grid.pageSize)].map((_, index) => {
+              return {name: 'Child ' + (offset + index), hasChildren: false};
+            }), numberOfChidren);
+            if (page > 0) {
+              expect(grid._physicalCount).to.be.above(10);
+              done();
+            }
+          });
+        };
+        grid.expandedItems = [PARENT];
+        grid.scrollToIndex(250);
+      });
+
+    });
+  </script>
 </body>
 
 </html>