fix: editing occurs error after filter (fix nhn#1456) (nhn#1487)

* fix: editing occurs error after filter * test: add test for focus on editing after filter * fix: not work when rowKey is zero * chore: apply code reviews * chore: apply code reviews on isRowFilt chore: correct typo * chore: apply code reviews * chore: fix lint error
js7309 · Oct 25, 2021 · 92f49d8 · 92f49d8
1 parent 04b669c
commit 92f49d8
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 3 deletions.
diff --git a/packages/toast-ui.grid/cypress/integration/data.spec.ts b/packages/toast-ui.grid/cypress/integration/data.spec.ts
@@ -722,6 +722,24 @@ describe('setRow()', () => {
 
     cy.getCell(1, 'name').should('have.text', 'observable');
   });
+
+  it.only('should destroy the focusing layer, only when row will be filtered', () => {
+    createGrid();
+    cy.gridInstance().invoke('setFilter', 'age', 'number');
+    invokeFilter('age', [{ code: 'gt', value: 5 }]);
+
+    cy.getCellByIdx(0, 0).click();
+
+    cy.gridInstance().invoke('setValue', 0, 'age', '6');
+
+    cy.getByCls('layer-focus').should('exist');
+
+    cy.gridInstance().invoke('setValue', 0, 'age', '0');
+
+    cy.gridInstance()
+      .invoke('getFocusedCell')
+      .should('eql', { columnName: null, rowKey: null, value: null });
+  });
 });
 
 describe('moveRow()', () => {
@@ -895,6 +913,23 @@ describe('setValue()', () => {
       ['Lee', '20'],
     ]);
   });
+
+  it('should destroy the focusing layer, only when row will be filtered', () => {
+    cy.gridInstance().invoke('setFilter', 'age', 'number');
+    invokeFilter('age', [{ code: 'gt', value: 5 }]);
+
+    cy.getCellByIdx(0, 0).click();
+
+    cy.gridInstance().invoke('setValue', 0, 'age', '6');
+
+    cy.getByCls('layer-focus').should('exist');
+
+    cy.gridInstance().invoke('setValue', 0, 'age', '0');
+
+    cy.gridInstance()
+      .invoke('getFocusedCell')
+      .should('eql', { columnName: null, rowKey: null, value: null });
+  });
 });
 
 it('should change the value of the hidden cell', () => {

diff --git a/packages/toast-ui.grid/src/dispatch/data.ts b/packages/toast-ui.grid/src/dispatch/data.ts
@@ -72,7 +72,11 @@ import { setColumnWidthsByText, setAutoResizingColumnWidths } from './column';
 import { fitRowHeightWhenMovingRow } from './renderState';
 
 function updateHeightsWithFilteredData(store: Store) {
-  if (store.data.filters) {
+  const { data, focus } = store;
+  const { filteredRawData } = data;
+  const { rowKey } = focus;
+  // if (isRowFiltered(store, store.focus.rowKey)) {
+  if (!filteredRawData.some((row) => row.rowKey === rowKey)) {
     initFocus(store);
   }
   updateHeights(store);
@@ -180,7 +184,9 @@ export function setValue(
     sort(store, columnName, columns[index].ascending, true, false);
   }
 
-  updateHeightsWithFilteredData(store);
+  setTimeout(() => {
+    updateHeightsWithFilteredData(store);
+  });
   updateSummaryValueByCell(store, columnName, { orgValue, value });
   getDataManager(id).push('UPDATE', targetRow);
 
@@ -693,7 +699,9 @@ export function setRow(store: Store, rowIndex: number, row: OptRow) {
 
   getDataManager(id).push('UPDATE', rawRow);
 
-  updateHeightsWithFilteredData(store);
+  setTimeout(() => {
+    updateHeightsWithFilteredData(store);
+  });
   updateSummaryValueByRow(store, rawRow, { type: 'SET', orgRow });
   postUpdateAfterManipulation(store, rowIndex, 'DONE');
 }