From ca888ee816fdd83ac1a82d398487fd1969b7a5db Mon Sep 17 00:00:00 2001 From: Maya Date: Thu, 6 Feb 2025 14:38:44 +0200 Subject: [PATCH] fix(igxTreeGrid): Re-eval correct row after collapsing. Add test. (#15329) --- .../src/lib/grids/common/crud.service.ts | 9 ++-- .../tree-grid/tree-grid-add-row-ui.spec.ts | 43 +++++++++++++++++++ 2 files changed, 48 insertions(+), 4 deletions(-) diff --git a/projects/igniteui-angular/src/lib/grids/common/crud.service.ts b/projects/igniteui-angular/src/lib/grids/common/crud.service.ts index 4f4f45381e6..76d217af1e6 100644 --- a/projects/igniteui-angular/src/lib/grids/common/crud.service.ts +++ b/projects/igniteui-angular/src/lib/grids/common/crud.service.ts @@ -684,12 +684,13 @@ export class IgxGridCRUDService extends IgxRowAddCrudState { return; } this.endEdit(true, event); - - if (parentRow != null && this.grid.expansionStates.get(parentRow.key)) { - this.grid.collapseRow(parentRow.key); + // work with copy of original row, since context may change on collapse. + const parentRowCopy = parentRow ? Object.assign(copyDescriptors(parentRow), parentRow) : null; + if (parentRowCopy != null && this.grid.expansionStates.get(parentRowCopy.key)) { + this.grid.collapseRow(parentRowCopy.key); } - this.createAddRow(parentRow, asChild); + this.createAddRow(parentRowCopy, asChild); this.grid.transactions.startPending(); if (this.addRowParent.isPinned) { diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-add-row-ui.spec.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-add-row-ui.spec.ts index b05a1acd5d5..a39d1e5f610 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-add-row-ui.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-add-row-ui.spec.ts @@ -9,6 +9,7 @@ import { IgxActionStripComponent } from '../../action-strip/public_api'; import { IgxTreeGridRowComponent } from './tree-grid-row.component'; import { first } from 'rxjs/operators'; import { IRowDataCancelableEventArgs } from '../public_api'; +import { wait } from '../../test-utils/ui-interactions.spec'; describe('IgxTreeGrid - Add Row UI #tGrid', () => { configureTestSuite(); @@ -216,5 +217,47 @@ describe('IgxTreeGrid - Add Row UI #tGrid', () => { const addedRow = treeGrid.getRowByKey(newRowId); expect(addedRow.data[treeGrid.foreignKey]).toBe(2); }); + + it('should collapse row when child row adding begins and it added row should go under correct parent.', async() => { + treeGrid.data = [ + { ID: 1, ParentID: -1, Name: 'Casey Houston', JobTitle: 'Vice President', Age: 32 }, + { ID: 2, ParentID: 10, Name: 'Gilberto Todd', JobTitle: 'Director', Age: 41 }, + { ID: 3, ParentID: 10, Name: 'Tanya Bennett', JobTitle: 'Director', Age: 29 }, + { ID: 4, ParentID: 6, Name: 'Jack Simon', JobTitle: 'Software Developer', Age: 33 }, + { ID: 6, ParentID: -1, Name: 'Erma Walsh', JobTitle: 'CEO', Age: 52 }, + { ID: 7, ParentID: 10, Name: 'Debra Morton', JobTitle: 'Associate Software Developer', Age: 35 }, + { ID: 9, ParentID: 10, Name: 'Leslie Hansen', JobTitle: 'Associate Software Developer', Age: 44 }, + { ID: 10, ParentID: -1, Name: 'Eduardo Ramirez', JobTitle: 'Manager', Age: 53 } + ]; + fix.detectChanges(); + treeGrid.collapseAll(); + treeGrid.height = "350px"; + fix.detectChanges(); + const parentRow1 = treeGrid.rowList.toArray()[1] as IgxTreeGridRowComponent; + treeGrid.expandRow(parentRow1.key); + const parentRow2 = treeGrid.rowList.toArray()[3] as IgxTreeGridRowComponent; + treeGrid.expandRow(parentRow2.key); + treeGrid.triggerPipes(); + fix.detectChanges(); + + // scroll bottom + treeGrid.verticalScrollContainer.scrollTo(treeGrid.dataView.length - 1); + await wait(50); + fix.detectChanges(); + // start add row + parentRow2.beginAddChild(); + fix.detectChanges(); + // last row should be add row + const addRow = treeGrid.gridAPI.get_row_by_index(4); + expect(addRow.addRowUI).toBeTrue(); + endTransition(); + + // end edit + treeGrid.gridAPI.crudService.endEdit(true); + fix.detectChanges(); + + // row should be added under correct parent + expect(treeGrid.data[treeGrid.data.length - 1].ParentID).toBe(10); + }); }); });