fix: exit edit mode when a cell becomes non-editable (#7361)

Author: web-padawan

packages/grid-pro/src/vaadin-grid-pro-inline-editing-mixin.js

@@ -536,7 +536,15 @@ export const InlineEditingMixin = (superClass) =>
       }
       // Otherwise, check isCellEditable function
       const model = this.__getRowModel(cell.parentElement);
-      return column.isCellEditable(model);
+      const isEditable = column.isCellEditable(model);
+
+      // Cancel editing if the cell is currently edited one and becomes no longer editable
+      // TODO: should be moved to `_updateItem` when Grid connector is updated to use it.
+      if (this.__edited && this.__edited.cell === cell && !isEditable) {
+        this._stopEdit(true, true);
+      }
+
+      return isEditable;
     }
 
     /**

packages/grid-pro/test/edit-column.common.js

@@ -325,6 +325,18 @@ describe('edit column', () => {
       expect(isCellEditable(1, 2)).to.be.true;
     });
 
+    it('should stop editing when cell becomes non-editable after updating provider function', async () => {
+      // Enable editing
+      amountColumn.isCellEditable = () => true;
+      const cell = getContainerCell(grid.$.items, 1, 2);
+      enter(cell);
+      expect(getCellEditor(cell)).to.be.ok;
+      // Disable editing
+      amountColumn.isCellEditable = () => false;
+      await nextFrame();
+      expect(getCellEditor(cell)).to.be.not.ok;
+    });
+
     it('should not add editable-cell part to non-editable cells', () => {
       expect(hasEditablePart(0, 0)).to.be.false;
       expect(hasEditablePart(0, 1)).to.be.true;