Don't allow entering edit mode if PrimaryKey is not set - 15.0 (#12425)

* fix(grid): Dont allow edntering edit mode if PrimaryKey is not set

* fix(grid action-strip): Dont focus first cell of the row if grid is non editable

* Update projects/igniteui-angular/src/lib/action-strip/grid-actions/grid-editing-actions.component.ts

* Update projects/igniteui-angular/src/lib/grids/common/crud.service.ts

Co-authored-by: Hristo <[email protected]>
Co-authored-by: Teodosia Hristodorova <[email protected]>

Author: 3 people

projects/igniteui-angular/src/lib/action-strip/grid-actions/grid-editing-actions.component.ts

@@ -117,7 +117,9 @@ export class IgxGridEditingActionsComponent extends IgxGridActionsBaseDirective
         // be sure row is in view
         if (grid.rowList.filter(r => r === row).length !== 0) {
             grid.gridAPI.crudService.enterEditMode(firstEditable, event);
-            firstEditable.activate(event);
+            if (!grid.gridAPI.crudService.nonEditable){
+                firstEditable.activate(event);
+            }
         }
         this.strip.hide();
     }

projects/igniteui-angular/src/lib/grids/common/crud.service.ts

@@ -311,6 +311,10 @@ export class IgxRowCrudState extends IgxCellCrudState {
         return this.grid.rowEditable;
     }
 
+    public get nonEditable(): boolean {
+        return this.grid.rowEditable && (this.grid.primaryKey === undefined || this.grid.primaryKey === null);
+    }
+
     public get rowEditingBlocked() {
         return this._rowEditingBlocked;
     }
@@ -321,10 +325,6 @@ export class IgxRowCrudState extends IgxCellCrudState {
 
     /** Enters row edit mode */
     public beginRowEdit(event?: Event) {
-        if (this.grid.rowEditable && (this.grid.primaryKey === undefined || this.grid.primaryKey === null)) {
-            console.warn('The grid must have a `primaryKey` specified when using `rowEditable`!');
-        }
-
         if (!this.row || !(this.row.getClassName() === IgxEditRow.name)) {
             if (!this.row) {
                 this.createRow(this.cell);
@@ -569,6 +569,11 @@ export class IgxGridCRUDService extends IgxRowAddCrudState {
             return;
         }
 
+        if (this.nonEditable){
+            console.warn('The grid must have a `primaryKey` specified when using `rowEditable`!');
+            return;
+        }
+
         if (this.cellInEditMode) {
             // TODO: case solely for f2/enter nav that uses enterEditMode as toggle. Refactor.
             const canceled = this.endEdit(true, event);

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

@@ -86,15 +86,11 @@ describe('IgxGrid - Row Editing #grid', () => {
             // Throws warning but still sets the property correctly
             expect(grid.rowEditable).toBeTruthy();
 
-            spyOn(grid, 'openRowOverlay');
             UIInteractions.simulateDoubleClickAndSelectEvent(cellElem);
 
-
             fix.detectChanges();
             expect(console.warn).toHaveBeenCalledWith('The grid must have a `primaryKey` specified when using `rowEditable`!');
             expect(console.warn).toHaveBeenCalledTimes(1);
-            // Still calls openRowOverlay, just logs the warning
-            expect(grid.openRowOverlay).toHaveBeenCalled();
         });
 
         it('Should be able to enter edit mode on dblclick, enter and f2', () => {
@@ -126,6 +122,26 @@ describe('IgxGrid - Row Editing #grid', () => {
             expect(row.inEditMode).toBe(false);
         });
 
+        it('Should not be able to enter edit mode on dblclick, enter and f2 when [rowEditable] is set on a grid w/o [primaryKey]', () => {
+            grid.primaryKey = null;
+            grid.rowEditable = true;
+            fix.detectChanges();
+
+            const row = grid.gridAPI.get_row_by_index(2);
+
+            UIInteractions.simulateDoubleClickAndSelectEvent(cellElem);
+            fix.detectChanges();
+            expect(row.inEditMode).toBe(false);
+
+            UIInteractions.triggerEventHandlerKeyDown('enter', gridContent);
+            fix.detectChanges();
+            expect(row.inEditMode).toBe(false);
+
+            UIInteractions.triggerEventHandlerKeyDown('f2', gridContent);
+            fix.detectChanges();
+            expect(row.inEditMode).toBe(false);
+        });
+
         it('Emit all events with proper arguments', () => {
             const row = grid.gridAPI.get_row_by_index(2);
             const initialRowData = { ...cell.row.data };