From 255ce3c7cba8b5e97ee8ef59db0497c97a8e47a1 Mon Sep 17 00:00:00 2001
From: Radoslav Karaivanov <rkaraivanov@infragistics.com>
Date: Tue, 12 May 2020 10:08:39 +0300
Subject: [PATCH] refactor(*): Address review comments

Also while focusing the grid body, call with preventFocus because
Chromium based browsers try to center by scrolling into view the focused
node
---
 .../src/lib/directives/for-of/for_of.directive.ts      | 10 ++++++----
 .../igniteui-angular/src/lib/grids/cell.component.ts   |  2 +-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts b/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts
index 5e3f08ad986..b0dcfd9da92 100644
--- a/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts
+++ b/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts
@@ -864,7 +864,6 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
 
                 // recalculate and apply page size.
                 if (diff && Math.abs(diff) <= this.MAX_PERF_SCROLL_DIFF) {
-                    this.scrollFocus();
                     diff > 0 ? this.moveApplyScrollNext(prevStart) : this.moveApplyScrollPrev(prevStart);
                 } else {
                     this.fixedApplyScroll();
@@ -886,6 +885,8 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
 
         for (let i = start; i < end && this.igxForOf[i] !== undefined; i++) {
             const embView = this._embeddedViews.shift();
+            this.scrollFocus(embView.rootNodes.find(node => node.nodeType === Node.ELEMENT_NODE)
+                || embView.rootNodes[0].nextElementSibling);
             const view = container.detach(0);
 
             this.updateTemplateContext(embView.context, i);
@@ -902,6 +903,8 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
         const container = this.dc.instance._vcr as ViewContainerRef;
         for (let i = prevIndex - 1; i >= this.state.startIndex && this.igxForOf[i] !== undefined; i--) {
             const embView = this._embeddedViews.pop();
+            this.scrollFocus(embView.rootNodes.find(node => node.nodeType === Node.ELEMENT_NODE)
+                || embView.rootNodes[0].nextElementSibling);
             const view = container.detach(container.length - 1);
 
             this.updateTemplateContext(embView.context, i);
@@ -948,8 +951,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
      *
      * Clears focus inside the virtualized container on small scroll swaps.
      */
-    protected scrollFocus(): void {
-        const container = this.dc.instance._viewContainer.element.nativeElement as HTMLElement;
+    protected scrollFocus(node?: HTMLElement): void {
         const activeElement = document.activeElement as HTMLElement;
 
         // Remove focus in case the the active element is inside the view container.
@@ -958,7 +960,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
         //
         // https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild
         // https://bugs.chromium.org/p/chromium/issues/detail?id=432392
-        if (container.contains(document.activeElement)) {
+        if (node && node.contains(document.activeElement)) {
             activeElement.blur();
         }
     }
diff --git a/projects/igniteui-angular/src/lib/grids/cell.component.ts b/projects/igniteui-angular/src/lib/grids/cell.component.ts
index 49987f1ac96..bd4e5d27836 100644
--- a/projects/igniteui-angular/src/lib/grids/cell.component.ts
+++ b/projects/igniteui-angular/src/lib/grids/cell.component.ts
@@ -666,7 +666,7 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
                 }
             }
             crud.end();
-            this.grid.tbody.nativeElement.focus();
+            this.grid.tbody.nativeElement.focus({ preventScroll: true });
             this.grid.notifyChanges();
             crud.begin(this);
             return;