From 5edc53c872e7b2c5db15852733e27a6c8dfa8747 Mon Sep 17 00:00:00 2001
From: Tomi Virkki <virkki@vaadin.com>
Date: Mon, 8 Nov 2021 12:06:35 +0200
Subject: [PATCH] fix: workaround an IE11 bug

---
 src/vaadin-grid-drag-and-drop-mixin.html | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/vaadin-grid-drag-and-drop-mixin.html b/src/vaadin-grid-drag-and-drop-mixin.html
index f5a905c68..02ca8e32a 100644
--- a/src/vaadin-grid-drag-and-drop-mixin.html
+++ b/src/vaadin-grid-drag-and-drop-mixin.html
@@ -303,13 +303,17 @@
 
       /** @private */
       __getViewportRows() {
-        const headerBottom = this.$.header.getBoundingClientRect().bottom;
-        const footerTop = this.$.footer.getBoundingClientRect().top;
-        return Array.from(this.$.items.children)
-          .filter(row => {
-            const rowRect = row.getBoundingClientRect();
-            return rowRect.bottom > headerBottom && rowRect.top < footerTop;
-          });
+        // Workaround an IE11 bug where the `getBoundingClientRect` for header/footer
+        // might return incorrect values
+        this.$.header.style.outline = '0px solid transparent';
+        const scrollerRect = this.$.scroller.getBoundingClientRect();
+        const headerBottom = Math.max(this.$.header.getBoundingClientRect().bottom, scrollerRect.top);
+        const footerTop = Math.min(this.$.footer.getBoundingClientRect().top, scrollerRect.bottom);
+
+        return Array.from(this.$.items.children).filter((row) => {
+          const rowRect = row.getBoundingClientRect();
+          return rowRect.bottom > headerBottom && rowRect.top < footerTop;
+        });
       }
 
       /** @protected */