From 8bbe8b67d7c4b0f885a60573a480e6fea8b4246b Mon Sep 17 00:00:00 2001
From: Diego Cardoso <diego@vaadin.com>
Date: Wed, 28 Apr 2021 15:10:46 +0300
Subject: [PATCH] fix: flush debouncer to fix timing issue with scroll to index
 (#271)

---
 src/vaadin-grid-data-provider-mixin.js |  5 ++++
 test/scroll-to-index.test.js           | 35 +++++++++++++++++++++++++-
 2 files changed, 39 insertions(+), 1 deletion(-)

diff --git a/src/vaadin-grid-data-provider-mixin.js b/src/vaadin-grid-data-provider-mixin.js
index 0881b565b..17238d3bf 100644
--- a/src/vaadin-grid-data-provider-mixin.js
+++ b/src/vaadin-grid-data-provider-mixin.js
@@ -512,6 +512,11 @@ export const DataProviderMixin = (superClass) =>
       if (this.__pendingScrollToIndex && this.$.items.children.length) {
         const index = this.__pendingScrollToIndex;
         delete this.__pendingScrollToIndex;
+
+        if (this._debounceIncreasePool) {
+          this._debounceIncreasePool.flush();
+        }
+
         this.scrollToIndex(index);
       }
     }
diff --git a/test/scroll-to-index.test.js b/test/scroll-to-index.test.js
index c90c308d4..acb383a5f 100644
--- a/test/scroll-to-index.test.js
+++ b/test/scroll-to-index.test.js
@@ -2,6 +2,7 @@ import { expect } from '@esm-bundle/chai';
 import { fixtureSync, nextFrame } from '@open-wc/testing-helpers';
 import { flushGrid, infiniteDataProvider, listenOnce } from './helpers.js';
 import '../vaadin-grid.js';
+import '../vaadin-grid-tree-column.js';
 
 const fixtures = {
   small: `
@@ -209,9 +210,14 @@ describe('scroll to index', () => {
     });
   });
   describe('Tree grid', () => {
+    let grid;
+
+    beforeEach(() => {
+      grid = fixtureSync(fixtures.treeGrid);
+    });
+
     // Issue https://github.com/vaadin/vaadin-grid/issues/2107
     it('should display correctly when scrolled to bottom immediately after setting dataProvider', (done) => {
-      const grid = fixtureSync(fixtures.treeGrid);
       grid.size = 1;
       const numberOfChidren = 250;
       grid.itemIdPath = 'name';
@@ -239,5 +245,32 @@ describe('scroll to index', () => {
       grid.expandedItems = [PARENT];
       grid.scrollToIndex(250);
     });
+
+    it('should not reuse rows if subitems are loaded while scrolling to bottom', (done) => {
+      grid.size = 25;
+
+      const parents = Array.from({ length: 10 }).map((_, i) => ({ name: i, hasChildren: true }));
+
+      grid.dataProvider = ({ parentItem }, cb) => {
+        setTimeout(() => {
+          if (!parentItem) {
+            cb(parents, parents.length);
+          } else {
+            const { name: parentName } = parentItem;
+            const children = Array.from({ length: 10 }).map((_, i) => ({
+              name: `${parentName * 10 + i}`,
+              hasChildren: false
+            }));
+            cb(children, children.length);
+
+            expect(grid._physicalCount).to.be.above(10);
+            done();
+          }
+        });
+      };
+
+      grid.expandedItems = [parents[parents.length - 1]];
+      grid.scrollToIndex(14);
+    });
   });
 });