fix(grid): call markForCheck when update cell or row #5763

Author: nrobakova

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

@@ -117,10 +117,12 @@ export class GridBaseAPIService <T extends IgxGridBaseComponent & IGridDataBinda
 
     public submit_value() {
         const cell = this.grid.crudService.cell;
-        if (cell) {
-            const args = this.update_cell(cell, cell.editValue);
-            if (args.cancel) {
-                return;
+        if (cell ) {
+            if (!(isEqual(cell.value, cell.editValue))) {
+                const args = this.update_cell(cell, cell.editValue);
+                if (args.cancel) {
+                    return;
+                }
             }
             this.escape_editMode();
         }

projects/igniteui-angular/src/lib/grids/grid-base.component.ts

@@ -3690,8 +3690,7 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
                     }
                     this.gridAPI.escape_editMode();
                 }
-
-                this.notifyChanges();
+                this.cdr.markForCheck();
             }
         }
     }
@@ -3717,7 +3716,7 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
             }
             const row = new IgxRow(rowSelector, -1, this.gridAPI.getRowData(rowSelector));
             this.gridAPI.update_row(row, value);
-            this.notifyChanges();
+            this.cdr.markForCheck();
         }
     }
 

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

@@ -1809,6 +1809,33 @@ describe('IgxGrid - Row Editing #grid', () => {
                 cancel: false
             });
         }));
+
+        it(`Should properly emit 'onCellEdit' event `, fakeAsync(() => {
+            spyOn(grid.onCellEdit, 'emit').and.callThrough();
+            spyOn(grid.onRowEdit, 'emit').and.callThrough();
+
+            let cell = grid.getCellByColumn(0, 'ProductName');
+            const cellArgs = { cellID: cell.cellID, rowID: cell.row.rowID, oldValue: 'Chai', newValue: 'New Value', cancel: false };
+
+            cell.nativeElement.dispatchEvent(new MouseEvent('dblclick'));
+            tick(16);
+            fix.detectChanges();
+
+            expect(cell.editMode).toBe(true);
+            const editTemplate = fix.debugElement.query(By.css('input'));
+            UIInteractions.sendInput(editTemplate, 'New Value');
+            fix.detectChanges();
+
+            // Click on cell in different row
+            cell = grid.getCellByColumn(2, 'ProductName');
+            UIInteractions.simulateClickAndSelectCellEvent(cell);
+            tick(16);
+            fix.detectChanges();
+
+            expect(grid.onRowEdit.emit).toHaveBeenCalledTimes(1);
+            expect(grid.onCellEdit.emit).toHaveBeenCalledTimes(1);
+            expect(grid.onCellEdit.emit).toHaveBeenCalledWith(cellArgs);
+        }));
     });
 
     describe('Column editable property', () => {

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

@@ -566,7 +566,6 @@ export class IgxGridComponent extends IgxGridBaseComponent implements IGridDataB
      */
     public groupBy(expression: IGroupingExpression | Array<IGroupingExpression>): void {
         this.endEdit(true);
-        this._gridAPI.submit_value();
         if (expression instanceof Array) {
             this._gridAPI.groupBy_multiple(expression);
         } else {