chore(*): fix navigation behavior

Author: MonikaKirkova

projects/igniteui-angular/src/lib/grids/cell.component.ts

@@ -1073,7 +1073,7 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy, CellT
         }
         this.selectionService.primaryButton = true;
         if (this.cellSelectionMode === GridSelectionMode.multiple && this.selectionService.activeElement) {
-            if (this.selectionService.isInMap(this.selectionService.activeElement) && (event as any)?.ctrlKey) {
+            if (this.selectionService.isInMap(this.selectionService.activeElement) && (event as any)?.ctrlKey && !(event as any)?.shiftKey) {
                 this.selectionService.remove(this.selectionService.activeElement);
                 shouldEmitSelection = true;
             } else {

projects/igniteui-angular/src/lib/grids/grid-navigation.service.ts

@@ -138,9 +138,6 @@ export class IgxGridNavigationService {
         }
         if (!this.activeNode || !Object.keys(this.activeNode).length || this.activeNode.row < 0 || this.activeNode.row > gridRows - 1) {
             const hasLastActiveNode = Object.keys(this.lastActiveNode).length;
-            if (hasLastActiveNode && this.grid.cellSelection !== GridSelectionMode.none && !this.grid.selectionService.isInMap(this.lastActiveNode)) {
-                return;
-            }
             const shouldClearSelection = hasLastActiveNode && (this.lastActiveNode.row < 0 || this.lastActiveNode.row > gridRows - 1);
             this.setActiveNode(this.lastActiveNode.row >= 0 && this.lastActiveNode.row < gridRows ?
                 this.firstVisibleNode(this.lastActiveNode.row) : this.firstVisibleNode());
@@ -151,6 +148,9 @@ export class IgxGridNavigationService {
                     this.grid.cdr.detectChanges();
                 });
             } else {
+                if (hasLastActiveNode && !this.grid.selectionService.selected(this.lastActiveNode)) {
+                    return;
+                }
                 const range = {
                     rowStart: this.activeNode.row, rowEnd: this.activeNode.row,
                     columnStart: this.activeNode.column, columnEnd: this.activeNode.column

projects/igniteui-angular/src/lib/grids/grid/grid-cell-selection.spec.ts

@@ -225,6 +225,34 @@ describe('IgxGrid - Cell selection #grid', () => {
             GridSelectionFunctions.verifySelectedRange(grid, 0, 0, 0, 0, 2, 3);
         });
 
+        it('Should be able to select cells correctly when focus is returned to the grid', async() => {
+            const firstCell = grid.gridAPI.get_cell_by_index(1, 'ParentID');
+            const secondCell = grid.gridAPI.get_cell_by_index(2, 'Name');
+
+            UIInteractions.simulateClickAndSelectEvent(firstCell);
+            fix.detectChanges();
+
+            GridSelectionFunctions.verifyCellSelected(firstCell);
+            expect(grid.selectedCells.length).toBe(1);
+
+            UIInteractions.simulateClickAndSelectEvent(firstCell, false, true);
+            fix.detectChanges();
+
+            expect(grid.selectedCells.length).toBe(0);
+            
+            grid.navigation.lastActiveNode = grid.navigation.activeNode;
+            grid.navigation.activeNode = null;
+            fix.detectChanges();
+            grid.tbody.nativeElement.focus();
+            fix.detectChanges();
+            
+            UIInteractions.simulateClickAndSelectEvent(secondCell, false, true);
+            fix.detectChanges();
+            GridSelectionFunctions.verifyCellSelected(firstCell, false);
+            GridSelectionFunctions.verifyCellSelected(secondCell, true);
+            expect(grid.selectedCells.length).toBe(1);
+        });
+
         it('Should be able to select range when click on a cell and hold Shift key and click on another Cell', () => {
             const firstCell = grid.gridAPI.get_cell_by_index(3, 'HireDate');
             const secondCell = grid.gridAPI.get_cell_by_index(1, 'ID');