Skip to content

Commit fc46739

Browse files
MKirovaMKirova
MKirova
authored and
MKirova
committed
chore(*): Add Hgrid and TreeGrid integration tests.
1 parent f862469 commit fc46739

File tree

1 file changed

+207
-2
lines changed

1 file changed

+207
-2
lines changed

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

Lines changed: 207 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
11
import { Component, TemplateRef, ViewChild } from '@angular/core';
22
import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing';
33
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
4-
import { DefaultMergeStrategy, DefaultSortingStrategy, GridCellMergeMode, GridColumnDataType, GridType, IgxColumnComponent, IgxGridComponent, IgxPaginatorComponent, IgxStringFilteringOperand, SortingDirection } from 'igniteui-angular';
4+
import { ByLevelTreeGridMergeStrategy, DefaultMergeStrategy, DefaultSortingStrategy, GridCellMergeMode, GridColumnDataType, GridType, IgxColumnComponent, IgxGridComponent, IgxHierarchicalGridComponent, IgxPaginatorComponent, IgxStringFilteringOperand, SortingDirection } from 'igniteui-angular';
55
import { DataParent } from '../../test-utils/sample-test-data.spec';
66
import { GridFunctions, GridSelectionFunctions } from '../../test-utils/grid-functions.spec';
77
import { By } from '@angular/platform-browser';
88
import { UIInteractions, wait } from '../../test-utils/ui-interactions.spec';
99
import { hasClass } from '../../test-utils/helper-utils.spec';
1010
import { ColumnLayoutTestComponent } from './grid.multi-row-layout.spec';
11+
import { IgxHierarchicalGridTestBaseComponent } from '../hierarchical-grid/hierarchical-grid.spec';
12+
import { IgxHierarchicalRowComponent } from '../hierarchical-grid/hierarchical-row.component';
13+
import { IgxTreeGridSelectionComponent } from '../../test-utils/tree-grid-components.spec';
1114

1215
describe('IgxGrid - Cell merging #grid', () => {
1316
let fix;
@@ -20,7 +23,8 @@ describe('IgxGrid - Cell merging #grid', () => {
2023
beforeEach(waitForAsync(() => {
2124
TestBed.configureTestingModule({
2225
imports: [
23-
NoopAnimationsModule, DefaultCellMergeGridComponent, ColumnLayoutTestComponent
26+
NoopAnimationsModule, DefaultCellMergeGridComponent, ColumnLayoutTestComponent,
27+
IgxHierarchicalGridTestBaseComponent, IgxTreeGridSelectionComponent
2428
]
2529
}).compileComponents();
2630
}));
@@ -677,6 +681,207 @@ describe('IgxGrid - Cell merging #grid', () => {
677681

678682
});
679683

684+
describe('HierarchicalGrid', () => {
685+
686+
beforeEach(() => {
687+
fix = TestBed.createComponent(IgxHierarchicalGridTestBaseComponent);
688+
fix.componentInstance.data = [
689+
{
690+
ID: 1, ChildLevels: 1, ProductName: 'Product A' , Col1: 1,
691+
childData: [
692+
{
693+
ID: 1, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
694+
},
695+
{
696+
ID: 2, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
697+
},
698+
{
699+
ID: 3, ChildLevels: 2, ProductName: 'Product B' , Col1: 1,
700+
},
701+
{
702+
ID: 4, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
703+
}
704+
]
705+
},
706+
{
707+
ID: 2, ChildLevels: 1, ProductName: 'Product A' , Col1: 1, childData: [
708+
{
709+
ID: 1, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
710+
},
711+
{
712+
ID: 2, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
713+
},
714+
{
715+
ID: 3, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
716+
},
717+
{
718+
ID: 4, ChildLevels: 2, ProductName: 'Product A' , Col1: 1,
719+
}
720+
]
721+
},
722+
{
723+
ID: 3, ChildLevels: 1, ProductName: 'Product B' , Col1: 1
724+
},
725+
{
726+
ID: 4, ChildLevels: 1, ProductName: 'Product B' , Col1: 1
727+
},
728+
{
729+
ID: 5, ChildLevels: 1, ProductName: 'Product C' , Col1: 1
730+
},
731+
{
732+
ID: 6, ChildLevels: 1, ProductName: 'Product B' , Col1: 1
733+
}
734+
];
735+
fix.detectChanges();
736+
grid = fix.componentInstance.hgrid;
737+
// enable merging
738+
grid.cellMergeMode = 'always';
739+
const col = grid.getColumnByName('ProductName');
740+
col.merge = true;
741+
fix.detectChanges();
742+
});
743+
744+
it('should allow configuring and merging cells on each level of hierarchy.', () => {
745+
746+
const col = grid.getColumnByName('ProductName');
747+
// root grid should be merged
748+
GridFunctions.verifyColumnMergedState(grid, col, [
749+
{ value: 'Product A', span: 2 },
750+
{ value: 'Product B', span: 2 },
751+
{ value: 'Product C', span: 1 },
752+
{ value: 'Product B', span: 1 }
753+
]);
754+
755+
const ri = fix.componentInstance.rowIsland;
756+
ri.cellMergeMode = 'always';
757+
ri.getColumnByName('ProductName').merge = true;
758+
fix.detectChanges();
759+
760+
// toggle row
761+
const firstRow = grid.gridAPI.get_row_by_index(0) as IgxHierarchicalRowComponent;
762+
firstRow.toggle();
763+
fix.detectChanges();
764+
765+
const childGrid = grid.gridAPI.getChildGrids(false)[0] as IgxHierarchicalGridComponent;
766+
expect(childGrid).toBeDefined();
767+
768+
// merging enabled
769+
GridFunctions.verifyColumnMergedState(childGrid, childGrid.getColumnByName('ProductName'), [
770+
{ value: 'Product A', span: 2 },
771+
{ value: 'Product B', span: 1 },
772+
{ value: 'Product A', span: 1 }
773+
]);
774+
});
775+
776+
it('should merge cells within their respective grids only.', () => {
777+
const ri = fix.componentInstance.rowIsland;
778+
ri.cellMergeMode = 'always';
779+
ri.getColumnByName('ProductName').merge = true;
780+
fix.detectChanges();
781+
782+
// toggle row 1
783+
const firstRow = grid.gridAPI.get_row_by_index(0) as IgxHierarchicalRowComponent;
784+
firstRow.toggle();
785+
fix.detectChanges();
786+
787+
// toggle row 2
788+
const secondRow = grid.gridAPI.get_row_by_index(2) as IgxHierarchicalRowComponent;
789+
secondRow.toggle();
790+
fix.detectChanges();
791+
792+
const childGrid1 = grid.gridAPI.getChildGrids(false)[0] as IgxHierarchicalGridComponent;
793+
expect(childGrid1).toBeDefined();
794+
795+
GridFunctions.verifyColumnMergedState(childGrid1, childGrid1.getColumnByName('ProductName'), [
796+
{ value: 'Product A', span: 2 },
797+
{ value: 'Product B', span: 1 },
798+
{ value: 'Product A', span: 1 }
799+
]);
800+
801+
const childGrid2 = grid.gridAPI.getChildGrids(false)[1] as IgxHierarchicalGridComponent;
802+
expect(childGrid2).toBeDefined();
803+
804+
GridFunctions.verifyColumnMergedState(childGrid2, childGrid2.getColumnByName('ProductName'), [
805+
{ value: 'Product A', span: 4 }
806+
]);
807+
});
808+
809+
it('should interrupt merge sequence if row is expanded and a child grid is shown between same value cells.', () => {
810+
const col = grid.getColumnByName('ProductName');
811+
// root grid should be merged
812+
GridFunctions.verifyColumnMergedState(grid, col, [
813+
{ value: 'Product A', span: 2 },
814+
{ value: 'Product B', span: 2 },
815+
{ value: 'Product C', span: 1 },
816+
{ value: 'Product B', span: 1 }
817+
]);
818+
819+
// toggle row 1
820+
const firstRow = grid.gridAPI.get_row_by_index(0) as IgxHierarchicalRowComponent;
821+
firstRow.toggle();
822+
fix.detectChanges();
823+
824+
// first merge sequence interrupted due to expanded row
825+
GridFunctions.verifyColumnMergedState(grid, col, [
826+
{ value: 'Product A', span: 1 },
827+
{ value: 'Product A', span: 1 },
828+
{ value: 'Product B', span: 2 },
829+
{ value: 'Product C', span: 1 },
830+
{ value: 'Product B', span: 1 }
831+
]);
832+
});
833+
834+
});
835+
836+
describe('TreeGrid', () => {
837+
838+
beforeEach(() => {
839+
fix = TestBed.createComponent(IgxTreeGridSelectionComponent);
840+
fix.detectChanges();
841+
grid = fix.componentInstance.treeGrid;
842+
// enable merging
843+
grid.cellMergeMode = 'always';
844+
const col = grid.getColumnByName('OnPTO');
845+
col.merge = true;
846+
fix.detectChanges();
847+
});
848+
849+
it('should merge all cells with same values, even if on different levels by default.', () => {
850+
const col = grid.getColumnByName('OnPTO');
851+
GridFunctions.verifyColumnMergedState(grid, col, [
852+
{ value: false, span: 2 },
853+
{ value: true, span: 1 },
854+
{ value: false, span: 1 },
855+
{ value: true, span: 1 },
856+
{ value: false, span: 2 },
857+
{ value: true, span: 1 },
858+
{ value: false, span: 3 },
859+
{ value: true, span: 1 }
860+
]);
861+
});
862+
863+
it('should allow setting the ByLevelTreeGridMergeStrategy as the mergeStrategy to merge only data on the same hierarchy level.', () => {
864+
grid.mergeStrategy = new ByLevelTreeGridMergeStrategy();
865+
fix.detectChanges();
866+
grid.triggerPipes();
867+
fix.detectChanges();
868+
const col = grid.getColumnByName('OnPTO');
869+
GridFunctions.verifyColumnMergedState(grid, col, [
870+
{ value: false, span: 1 },
871+
{ value: false, span: 1 },
872+
{ value: true, span: 1 },
873+
{ value: false, span: 1 },
874+
{ value: true, span: 1 },
875+
{ value: false, span: 1 },
876+
{ value: false, span: 1 },
877+
{ value: true, span: 1 },
878+
{ value: false, span: 1 },
879+
{ value: false, span: 1 },
880+
{ value: false, span: 1 },
881+
{ value: true, span: 1 }
882+
]);
883+
});
884+
});
680885
});
681886
});
682887

0 commit comments

Comments
 (0)