fix(grid): return the new rowSelection in correct order

Author: MonikaKirkova

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

@@ -289,6 +289,66 @@ describe('IgxGrid - Row Selection #grid', () => {
             expect(grid.rowSelectionChanging.emit).toHaveBeenCalledWith(args);
         });
 
+        it('Should display the newly selected rows in correct order', () => {
+            const firstRow = grid.gridAPI.get_row_by_index(0);
+            const secondRow = grid.gridAPI.get_row_by_index(1);
+            const thirdRow = grid.gridAPI.get_row_by_index(2);
+            spyOn(grid.rowSelectionChanging, 'emit').and.callThrough();
+
+            GridSelectionFunctions.clickRowCheckbox(thirdRow);
+            fix.detectChanges();
+
+            expect(grid.rowSelectionChanging.emit).toHaveBeenCalledTimes(1);
+            let args: IRowSelectionEventArgs = {
+                added: [gridData[2]],
+                cancel: false,
+                event: jasmine.anything() as any,
+                newSelection: [gridData[2]],
+                oldSelection: [],
+                removed: [],
+                allRowsSelected: false,
+                owner: grid
+            };
+            expect(grid.rowSelectionChanging.emit).toHaveBeenCalledWith(args);
+
+            GridSelectionFunctions.clickRowCheckbox(firstRow);
+            fix.detectChanges();
+
+            expect(grid.rowSelectionChanging.emit).toHaveBeenCalledTimes(2);
+            args = {
+                added: [gridData[0]],
+                cancel: false,
+                event: jasmine.anything() as any,
+                newSelection: [gridData[2], gridData[0]],
+                oldSelection: [gridData[2]],
+                removed: [],
+                allRowsSelected: false,
+                owner: grid
+            };
+            expect(grid.rowSelectionChanging.emit).toHaveBeenCalledWith(args);
+
+            GridSelectionFunctions.clickRowCheckbox(secondRow);
+            fix.detectChanges();
+
+            expect(grid.rowSelectionChanging.emit).toHaveBeenCalledTimes(3);
+            args = {
+                added: [gridData[1]],
+                cancel: false,
+                event: jasmine.anything() as any,
+                newSelection: [gridData[2], gridData[0], gridData[1]],
+                oldSelection: [gridData[2], gridData[0]],
+                removed: [],
+                allRowsSelected: false,
+                owner: grid
+            };
+            expect(grid.rowSelectionChanging.emit).toHaveBeenCalledWith(args);
+
+            expect(grid.selectedRows.length).toEqual(3);
+            GridSelectionFunctions.verifyRowSelected(firstRow);
+            GridSelectionFunctions.verifyRowSelected(secondRow);
+            GridSelectionFunctions.verifyRowSelected(thirdRow);
+        });
+
         it('Should select the row with mouse click ', () => {
             expect(grid.selectRowOnClick).toBe(true);
             spyOn(grid.rowSelectionChanging, 'emit').and.callThrough();

projects/igniteui-angular/src/lib/grids/selection/selection.service.ts

@@ -2,7 +2,6 @@ import { EventEmitter, Injectable, NgZone } from '@angular/core';
 import { Subject } from 'rxjs';
 import { PlatformUtil } from '../../core/utils';
 import { FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree';
-import { GridPagingMode } from '../common/enums';
 import { IRowSelectionEventArgs } from '../common/events';
 import { GridType } from '../common/grid.interface';
 import {
@@ -397,20 +396,17 @@ export class IgxGridSelectionService {
                 return keys.some(k => this.isPivotRowSelected(k));
             });
         }
-        if(this.rowSelection.size && (this.grid as any).totalItemCount || this.grid.pagingMode === GridPagingMode.Remote) {
-            if(!this.grid.primaryKey) {
-                return Array.from(this.rowSelection);
-            }
-            const selection = [];
-            this.rowSelection.forEach(rID =>  {
-                const rData = this.grid.gridAPI.get_all_data(true).find(row => this.getRecordKey(row) === rID);
-                const partialRowData = {};
-                partialRowData[this.grid.primaryKey] = rID;
-                selection.push(rData ? rData : partialRowData);
-            });
-            return selection;
-        }
-        return this.rowSelection.size ? this.grid.gridAPI.get_all_data(true).filter(row => this.rowSelection.has(this.getRecordKey(row))) : [];
+        if (!this.grid.primaryKey) {
+            return Array.from(this.rowSelection);
+        }
+        const selection = [];
+        this.rowSelection.forEach(rID => {
+            const rData = this.grid.gridAPI.get_all_data(true).find(row => this.getRecordKey(row) === rID);
+            const partialRowData = {};
+            partialRowData[this.grid.primaryKey] = rID;
+            selection.push(rData ? rData : partialRowData);
+        });
+        return selection;
     }
 
     /** Returns array of the selected row id's. */

src/app/grid-remote-paging/grid-remote-paging.sample.ts

@@ -9,6 +9,7 @@ import { GridPagingMode, IgxButtonDirective, IgxCardComponent, IgxCardContentDir
 @Component({
     selector: 'app-grid-remote-paging-sample',
     templateUrl: 'grid-remote-paging.sample.html',
+    providers: [RemoteService],
     standalone: true,
     imports: [IgxGridComponent, IgxColumnComponent, NgIf, IgxPaginatorComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardContentDirective, IgxButtonDirective, IgxSelectComponent, FormsModule, NgFor, IgxSelectItemComponent, AsyncPipe]
 })

src/app/grid-remote-virtualization/grid-remote-virtualization.sample.ts

@@ -7,6 +7,7 @@ import { IgxButtonDirective, IgxGridComponent } from 'igniteui-angular';
 @Component({
     selector: 'app-grid-remote-virtualization-sample',
     templateUrl: 'grid-remote-virtualization.sample.html',
+    providers: [RemoteService],
     standalone: true,
     imports: [IgxGridComponent, IgxButtonDirective, AsyncPipe]
 })