Skip to content

Commit 784c5d5

Browse files
tachojelevtachojelev
authored
Merge branch '8.1.x' into tzhelev/fix-5238-8.1.x
2 parents 4e5a44b + 1467f5f commit 784c5d5

File tree

6 files changed

+138
-79
lines changed

6 files changed

+138
-79
lines changed

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

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -82,29 +82,19 @@ export class IgxGridAPIService extends GridBaseAPIService<IgxGridComponent> {
8282

8383
public groupBy_toggle_group(groupRow: IGroupByRecord) {
8484
const grid = this.grid;
85-
const expansionState = grid.groupingExpansionState;
86-
let toggleRowEditingOverlay: boolean;
87-
let isEditRowInGroup = false;
88-
if (grid.rowEditable) {
89-
const rowState = this.grid.crudService.row;
90-
91-
// Toggle only row editing overlays that are inside current expanded/collapsed group.
92-
isEditRowInGroup = rowState ? this.groupBy_is_row_in_group(groupRow, rowState.id) : false;
85+
if (grid.crudService.isInEditMode) {
86+
grid.endEdit(true);
9387
}
88+
89+
const expansionState = grid.groupingExpansionState;
9490
const state: IGroupByExpandState = this.groupBy_get_expanded_for_group(groupRow);
9591
if (state) {
9692
state.expanded = !state.expanded;
97-
if (isEditRowInGroup) {
98-
toggleRowEditingOverlay = state.expanded;
99-
}
10093
} else {
10194
expansionState.push({
10295
expanded: !grid.groupsExpanded,
10396
hierarchy: DataUtil.getHierarchy(groupRow)
10497
});
105-
if (isEditRowInGroup) {
106-
toggleRowEditingOverlay = false;
107-
}
10898
}
10999
this.grid.groupingExpansionState = expansionState;
110100
if (grid.rowEditable) {

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

Lines changed: 65 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -4106,7 +4106,7 @@ describe('IgxGrid Component Tests', () => {
41064106
});
41074107

41084108
describe('Row Editing - Grouping', () => {
4109-
it('Hide/show row editing dialog with group collapsing/expanding', fakeAsync(() => {
4109+
it('Hide row editing dialog with group collapsing/expanding', fakeAsync(() => {
41104110
const fix = TestBed.createComponent(IgxGridRowEditingWithFeaturesComponent);
41114111
const grid = fix.componentInstance.instance;
41124112
grid.primaryKey = 'ID';
@@ -4119,86 +4119,85 @@ describe('IgxGrid Component Tests', () => {
41194119
});
41204120
tick(16);
41214121
fix.detectChanges();
4122-
const cell = grid.getCellByColumn(1, 'ProductName');
4122+
4123+
let cell = grid.getCellByColumn(6, 'ProductName');
4124+
expect(grid.crudService.inEditMode).toBeFalsy();
4125+
4126+
// set cell in second group in edit mode
41234127
cell.setEditMode(true);
41244128
tick(16);
41254129
fix.detectChanges();
4130+
4131+
expect(grid.crudService.inEditMode).toBeTruthy();
41264132
const groupRows = grid.groupsRowList.toArray();
4133+
expect(groupRows[0].expanded).toBeTruthy();
41274134

4128-
expect(groupRows[0].expanded).toEqual(true);
4135+
// collapse first group
41294136
grid.toggleGroup(groupRows[0].groupRow);
41304137
tick(16);
41314138
fix.detectChanges();
4132-
expect(groupRows[0].expanded).toEqual(false);
4133-
const overlayContent = grid.rowEditingOverlay.element.parentElement;
4134-
expect(overlayContent.style.display).toEqual('none');
4139+
4140+
expect(groupRows[0].expanded).toBeFalsy();
4141+
expect(grid.crudService.inEditMode).toBeFalsy();
4142+
4143+
// expand first group
41354144
grid.toggleGroup(groupRows[0].groupRow);
41364145
tick(16);
41374146
fix.detectChanges();
4138-
expect(groupRows[0].expanded).toEqual(true);
4139-
expect(overlayContent.style.display).toEqual('');
4140-
}));
41414147

4142-
it('Do not hide/show row editing dialog when another group is collapsing/expanding and check that overlay is moving with row',
4143-
fakeAsync(() => {
4144-
const fix = TestBed.createComponent(IgxGridRowEditingWithFeaturesComponent);
4145-
const grid = fix.componentInstance.instance;
4146-
grid.primaryKey = 'ID';
4147-
fix.detectChanges();
4148-
tick(16);
4148+
expect(groupRows[0].expanded).toBeTruthy();
4149+
expect(grid.crudService.inEditMode).toBeFalsy();
41494150

4150-
grid.groupBy({
4151-
fieldName: 'Released', dir: SortingDirection.Desc, ignoreCase: false,
4152-
strategy: DefaultSortingStrategy.instance()
4153-
});
4154-
tick(16);
4155-
fix.detectChanges();
4156-
let row: HTMLElement;
4157-
const cell = grid.getCellByColumn(7, 'ProductName');
4158-
cell.setEditMode(true);
4159-
tick(16);
4160-
fix.detectChanges();
4161-
const overlayElem: HTMLElement = document.getElementsByClassName(EDIT_OVERLAY_CONTENT)[0] as HTMLElement;
4162-
const groupRows = grid.groupsRowList.toArray();
4151+
// collapse first group
4152+
grid.toggleGroup(groupRows[0].groupRow);
4153+
tick(16);
4154+
fix.detectChanges();
41634155

4164-
grid.toggleGroup(groupRows[0].groupRow);
4165-
tick(16);
4166-
fix.detectChanges();
4167-
const overlayContent = grid.rowEditingOverlay.element.parentElement;
4168-
expect(overlayContent.style.display).toEqual('');
4156+
expect(groupRows[0].expanded).toBeFalsy();
4157+
expect(grid.crudService.inEditMode).toBeFalsy();
41694158

4170-
row = grid.getRowByIndex(3).nativeElement;
4171-
expect(row.getBoundingClientRect().bottom === overlayElem.getBoundingClientRect().top).toBeTruthy();
4172-
grid.toggleGroup(groupRows[0].groupRow);
4173-
tick(16);
4174-
fix.detectChanges();
4175-
expect(overlayContent.style.display).toEqual('');
4176-
row = grid.getRowByIndex(7).nativeElement;
4177-
expect(row.getBoundingClientRect().bottom === overlayElem.getBoundingClientRect().top).toBeTruthy();
4159+
// set cell in second group in edit mode
4160+
cell.setEditMode(true);
4161+
tick(16);
4162+
fix.detectChanges();
41784163

4179-
grid.toggleGroup(groupRows[1].groupRow);
4180-
tick(16);
4181-
fix.detectChanges();
4182-
expect(overlayContent.style.display).toEqual('none');
4164+
expect(grid.crudService.inEditMode).toBeTruthy();
41834165

4184-
grid.toggleGroup(groupRows[0].groupRow);
4185-
tick(16);
4186-
fix.detectChanges();
4187-
expect(overlayContent.style.display).toEqual('none');
4188-
grid.toggleGroup(groupRows[0].groupRow);
4189-
tick(16);
4190-
fix.detectChanges();
4191-
expect(overlayContent.style.display).toEqual('none');
4166+
// expand first group
4167+
grid.toggleGroup(groupRows[0].groupRow);
4168+
tick(16);
4169+
fix.detectChanges();
41924170

4193-
grid.toggleGroup(groupRows[1].groupRow);
4194-
tick(16);
4195-
fix.detectChanges();
4196-
expect(overlayContent.style.display).toEqual('');
4197-
row = grid.getRowByIndex(7).nativeElement;
4198-
expect(row.getBoundingClientRect().bottom === overlayElem.getBoundingClientRect().top).toBeTruthy();
4199-
}));
4171+
expect(groupRows[0].expanded).toBeTruthy();
4172+
expect(grid.crudService.inEditMode).toBeFalsy();
4173+
4174+
// set cell in first group in edit mode
4175+
cell = grid.getCellByColumn(1, 'ProductName');
4176+
cell.setEditMode(true);
4177+
tick(16);
4178+
fix.detectChanges();
4179+
4180+
expect(grid.crudService.inEditMode).toBeTruthy();
4181+
expect(groupRows[0].expanded).toBeTruthy();
4182+
4183+
// collapse first group
4184+
grid.toggleGroup(groupRows[0].groupRow);
4185+
tick(16);
4186+
fix.detectChanges();
4187+
4188+
expect(groupRows[0].expanded).toBeFalsy();
4189+
expect(grid.crudService.inEditMode).toBeFalsy();
4190+
4191+
// expand first group
4192+
grid.toggleGroup(groupRows[0].groupRow);
4193+
tick(16);
4194+
fix.detectChanges();
4195+
4196+
expect(groupRows[0].expanded).toBeTruthy();
4197+
expect(grid.crudService.inEditMode).toBeFalsy();
4198+
}));
42004199

4201-
it('Hide/show row editing dialog when hierarchical group is collapsed/expanded',
4200+
it('Hide row editing dialog when hierarchical group is collapsed/expanded',
42024201
fakeAsync(() => {
42034202
const fix = TestBed.createComponent(IgxGridRowEditingWithFeaturesComponent);
42044203
const grid = fix.componentInstance.instance;
@@ -4217,21 +4216,22 @@ describe('IgxGrid Component Tests', () => {
42174216
});
42184217
tick(16);
42194218
fix.detectChanges();
4219+
expect(grid.crudService.inEditMode).toBeFalsy();
42204220
const cell = grid.getCellByColumn(2, 'ProductName');
42214221
cell.setEditMode(true);
42224222
tick(16);
42234223
fix.detectChanges();
4224+
expect(grid.crudService.inEditMode).toBeTruthy();
42244225
const groupRows = grid.groupsRowList.toArray();
42254226

42264227
grid.toggleGroup(groupRows[0].groupRow);
42274228
tick(16);
42284229
fix.detectChanges();
4229-
const overlayContent = grid.rowEditingOverlay.element.parentElement;
4230-
expect(overlayContent.style.display).toEqual('none');
4230+
expect(grid.crudService.inEditMode).toBeFalsy();
42314231
grid.toggleGroup(groupRows[0].groupRow);
42324232
tick(16);
42334233
fix.detectChanges();
4234-
expect(overlayContent.style.display).toEqual('');
4234+
expect(grid.crudService.inEditMode).toBeFalsy();
42354235
}));
42364236
});
42374237
});

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,7 @@ describe('Basic IgxHierarchicalGrid', () => {
104104
expect(icon.getActive).toBe(false);
105105
expect(hierarchicalGrid.hierarchicalState.length).toEqual(0);
106106
}));
107+
107108
it('should allow applying initial expansions state for certain rows through hierarchicalState option', () => {
108109
// set first row as expanded.
109110
hierarchicalGrid.hierarchicalState = [{rowID: fixture.componentInstance.data[0]}];
@@ -335,6 +336,55 @@ describe('Basic IgxHierarchicalGrid', () => {
335336
expect(childGrid.calcWidth - 170).toBeLessThan(3);
336337
});
337338

339+
it('should exit edit mode on row expand/collapse through the UI', async() => {
340+
hierarchicalGrid.primaryKey = 'ID';
341+
hierarchicalGrid.rowEditable = true;
342+
fixture.detectChanges();
343+
wait();
344+
345+
const masterGridFirstRow = hierarchicalGrid.getRowByIndex(0) as IgxHierarchicalRowComponent;
346+
expect(masterGridFirstRow.expanded).toBeFalsy();
347+
348+
const masterGridSecondCell = masterGridFirstRow.cells.find(c => c.columnIndex === 1);
349+
expect(masterGridSecondCell.editMode).toBeFalsy();
350+
351+
masterGridSecondCell.setEditMode(true);
352+
fixture.detectChanges();
353+
wait();
354+
355+
expect(masterGridSecondCell.editMode).toBeTruthy();
356+
357+
UIInteractions.clickElement(masterGridFirstRow.expander);
358+
fixture.detectChanges();
359+
wait();
360+
361+
expect(masterGridFirstRow.expanded).toBeTruthy();
362+
expect(masterGridSecondCell.editMode).toBeFalsy();
363+
364+
const childGrid = hierarchicalGrid.hgridAPI.getChildGrids(false)[0] as IgxHierarchicalGridComponent;
365+
expect(childGrid).toBeDefined();
366+
367+
childGrid.columnList.find(c => c.index === 1).editable = true;
368+
const childGridSecondRow = childGrid.getRowByIndex(1) as IgxHierarchicalRowComponent;
369+
expect(childGridSecondRow.expanded).toBeFalsy();
370+
371+
const childGridSecondCell = childGridSecondRow.cells.find(c => c.columnIndex === 1);
372+
expect(childGridSecondCell.editMode).toBeFalsy();
373+
374+
childGridSecondCell.setEditMode(true);
375+
fixture.detectChanges();
376+
wait();
377+
378+
expect(childGridSecondCell.editMode).toBeTruthy();
379+
380+
UIInteractions.clickElement(masterGridFirstRow.expander);
381+
fixture.detectChanges();
382+
wait();
383+
384+
expect(childGrid.crudService.inEditMode).toBeFalsy();
385+
expect(childGridSecondRow.inEditMode).toBeFalsy();
386+
});
387+
338388
it('child grid width should be recalculated if parent no longer shows scrollbar.', async () => {
339389
hierarchicalGrid.height = '1000px';
340390
fixture.detectChanges();

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

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@ export class IgxHierarchicalRowComponent extends IgxRowComponent<IgxHierarchical
7878
return;
7979
}
8080
const grid = this.gridAPI.grid;
81+
this.endEdit(grid.rootGrid);
8182
const state = this.gridAPI.grid.hierarchicalState;
8283
if (!this.expanded) {
8384
state.push({ rowID: this.rowID });
@@ -93,6 +94,16 @@ export class IgxHierarchicalRowComponent extends IgxRowComponent<IgxHierarchical
9394
});
9495
}
9596

97+
private endEdit(grid: IgxHierarchicalGridComponent) {
98+
if (grid.crudService.inEditMode) {
99+
grid.endEdit();
100+
}
101+
grid.hgridAPI.getChildGrids(true).forEach(g => {
102+
if (g.crudService.inEditMode) {
103+
g.endEdit();
104+
}});
105+
}
106+
96107
constructor(public gridAPI: GridBaseAPIService<IgxHierarchicalGridComponent>,
97108
public crudService: IgxGridCRUDService,
98109
public selectionService: IgxGridSelectionService,

‎src/app/date-picker/date-picker.sample.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
<h4 class="sample-title">Default Date Picker - dialog mode</h4>
66
<p class="sample-description">Added buttons - today and cancel</p>
77
<div class="preview">
8+
<button (click)="d()">DDD</button>
89
<igx-date-picker #datePicker cancelButtonLabel="cancel" todayButtonLabel="today">
910
</igx-date-picker>
1011
<button igxButton igxRipple type="raised" (click)="deselect(datePicker)">Deselect date</button>

‎src/app/date-picker/date-picker.sample.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,9 @@ export class DatePickerSampleComponent {
3939
@ViewChild('retemplated', { static: true })
4040
private retemplatedDP;
4141

42+
@ViewChild('datePicker', { static: true })
43+
private dp: IgxDatePickerComponent;
44+
4245
formatter = (_: Date) => {
4346
return _.toLocaleString('en');
4447
}
@@ -90,4 +93,8 @@ export class DatePickerSampleComponent {
9093
public selectToday(picker: IgxDatePickerComponent) {
9194
picker.calendar.value = picker.calendar.viewDate = new Date(Date.now());
9295
}
96+
97+
public d() {
98+
this.dp.triggerTodaySelection();
99+
}
93100
}

0 commit comments

Comments
 (0)