Skip to content

Commit 462809b

Browse files
dkamburovdkamburov
committed
test(pivot): Fix failing tests
1 parent 2e5f2c3 commit 462809b

File tree

3 files changed

+93
-50
lines changed

3 files changed

+93
-50
lines changed

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid-keyboard-nav.spec.ts

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@ import { IgxPivotGridComponent, IgxPivotGridModule } from 'igniteui-angular';
55
import { configureTestSuite } from '../../test-utils/configure-suite';
66
import { GridFunctions } from '../../test-utils/grid-functions.spec';
77
import { IgxPivotGridMultipleRowComponent } from '../../test-utils/pivot-grid-samples.spec';
8-
import { UIInteractions } from '../../test-utils/ui-interactions.spec';
8+
import { UIInteractions, wait } from '../../test-utils/ui-interactions.spec';
99

10+
const DEBOUNCE_TIME = 250;
1011
const PIVOT_TBODY_CSS_CLASS = '.igx-grid__tbody';
1112
const PIVOT_ROW_DIMENSION_CONTENT = 'igx-pivot-row-dimension-content';
1213
const PIVOT_HEADER_ROW = 'igx-pivot-header-row';
@@ -43,7 +44,7 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
4344
let activeCells = fixture.debugElement.queryAll(By.css(`${ACTIVE_CELL_CSS_CLASS}`));
4445
expect(activeCells.length).toBe(1);
4546

46-
UIInteractions.triggerKeyDownEvtUponElem('ArrowRight', firstCell.nativeElement);
47+
UIInteractions.triggerKeyDownEvtUponElem('ArrowRight', pivotGrid.theadRow.nativeElement);
4748
fixture.detectChanges();
4849
GridFunctions.verifyHeaderIsFocused(secondCell.parent);
4950
activeCells = fixture.debugElement.queryAll(By.css(`${ACTIVE_CELL_CSS_CLASS}`));
@@ -56,7 +57,7 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
5657
UIInteractions.simulateClickAndSelectEvent(firstCell);
5758
fixture.detectChanges();
5859

59-
UIInteractions.triggerKeyDownEvtUponElem('ArrowLeft', firstCell.nativeElement);
60+
UIInteractions.triggerKeyDownEvtUponElem('ArrowLeft', pivotGrid.theadRow.nativeElement);
6061
fixture.detectChanges();
6162

6263
GridFunctions.verifyHeaderIsFocused(firstCell.parent);
@@ -66,7 +67,7 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
6667
UIInteractions.simulateClickAndSelectEvent(thirdCell);
6768
fixture.detectChanges();
6869

69-
UIInteractions.triggerKeyDownEvtUponElem('ArrowRight', firstCell.nativeElement);
70+
UIInteractions.triggerKeyDownEvtUponElem('ArrowRight', pivotGrid.theadRow.nativeElement);
7071
fixture.detectChanges();
7172

7273
GridFunctions.verifyHeaderIsFocused(thirdCell.parent);
@@ -93,13 +94,13 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
9394
expect(activeCells.length).toBe(1);
9495
});
9596

96-
it('should allow navigating from first to last row headers(Ctrl + End)', () => {
97-
const [firstCell] = fixture.debugElement.queryAll(
97+
it('should allow navigating from first to last row headers(Ctrl + ArrowDown)', () => {
98+
const [_firstCell, _secondCell, thirdCell] = fixture.debugElement.queryAll(
9899
By.css(`${PIVOT_TBODY_CSS_CLASS} ${PIVOT_ROW_DIMENSION_CONTENT} ${HEADER_CELL_CSS_CLASS}`));
99-
UIInteractions.simulateClickAndSelectEvent(firstCell);
100+
UIInteractions.simulateClickAndSelectEvent(thirdCell);
100101
fixture.detectChanges();
101102

102-
UIInteractions.triggerKeyDownEvtUponElem('End', pivotGrid.theadRow.nativeElement, false, false, false, true);
103+
UIInteractions.triggerKeyDownEvtUponElem('ArrowDown', pivotGrid.theadRow.nativeElement, true, false, false, true);
103104
fixture.detectChanges();
104105

105106
const allCells = fixture.debugElement.queryAll(
@@ -108,12 +109,6 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
108109
GridFunctions.verifyHeaderIsFocused(lastCell.parent);
109110
const activeCells = fixture.debugElement.queryAll(By.css(`${ACTIVE_CELL_CSS_CLASS}`));
110111
expect(activeCells.length).toBe(1);
111-
112-
const scrollTop = pivotGrid.verticalScrollContainer.getScroll().scrollTop;
113-
const scrollHeight = pivotGrid.verticalScrollContainer.getScroll().scrollHeight;
114-
const tbody = fixture.debugElement.query(By.css(`${PIVOT_TBODY_CSS_CLASS}`)).nativeElement;
115-
const scrolledToBottom = Math.round(scrollTop + tbody.scrollHeight) === scrollHeight;
116-
expect(scrolledToBottom).toBeTruthy();
117112
});
118113

119114
it('should allow navigating between column headers', () => {
@@ -132,7 +127,7 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
132127
activeCells = fixture.debugElement.queryAll(By.css(`${ACTIVE_CELL_CSS_CLASS}`));
133128
expect(activeCells.length).toBe(1);
134129
});
135-
it('should allow navigating from first to last column headers', () => {
130+
it('should allow navigating from first to last column headers', async () => {
136131
const [firstHeader] = fixture.debugElement.queryAll(
137132
By.css(`${PIVOT_HEADER_ROW} ${HEADER_CELL_CSS_CLASS}`));
138133
UIInteractions.simulateClickAndSelectEvent(firstHeader);
@@ -143,6 +138,7 @@ describe('IgxPivotGrid - Keyboard navigation #pivotGrid', () => {
143138
expect(activeCells.length).toBe(1);
144139

145140
UIInteractions.triggerKeyDownEvtUponElem('End', pivotGrid.theadRow.nativeElement);
141+
await wait(DEBOUNCE_TIME);
146142
fixture.detectChanges();
147143

148144
const allHeaders = fixture.debugElement.queryAll(

‎projects/igniteui-angular/src/lib/test-utils/pivot-grid-samples.spec.ts

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,61 @@ export class IgxPivotGridTestComplexHierarchyComponent extends IgxPivotGridTestB
194194
}
195195
}
196196

197+
@Component({
198+
template: `
199+
<igx-pivot-grid #grid [data]="data" [pivotConfiguration]="pivotConfigHierarchy" [defaultExpandState]="true">
200+
</igx-pivot-grid>`
201+
})
202+
export class IgxPivotGridMultipleRowComponent extends IgxPivotGridTestBaseComponent {
203+
204+
205+
constructor() {
206+
super();
207+
this.pivotConfigHierarchy = {
208+
columns: [{
209+
memberName: 'SellerName',
210+
enabled: true
211+
},
212+
],
213+
rows: [{
214+
memberName: 'ProductCategory',
215+
memberFunction: (data) => data.ProductCategory,
216+
enabled: true
217+
}, {
218+
memberName: 'Country',
219+
enabled: true
220+
}, {
221+
memberName: 'Date',
222+
enabled: true
223+
}],
224+
values: [
225+
{
226+
member: 'UnitsSold',
227+
aggregate: {
228+
aggregator: IgxPivotNumericAggregate.sum,
229+
key: 'UnitsSoldSUM',
230+
label: 'Sum of Units Sold'
231+
},
232+
enabled: true,
233+
// dataType: 'currency',
234+
formatter: (value) => value ? value + '$' : undefined
235+
},
236+
{
237+
member: 'UnitPrice',
238+
aggregate: {
239+
aggregator: IgxPivotNumericAggregate.sum,
240+
key: 'UnitPriceSUM',
241+
label: 'Sum of Unit Price'
242+
},
243+
enabled: true,
244+
dataType: 'currency'
245+
}
246+
],
247+
filters: null
248+
};
249+
}
250+
}
251+
197252
export class IgxTotalSaleAggregate {
198253
public static totalSale: PivotAggregation = (members, data: any) =>
199254
data.reduce((accumulator, value) => accumulator + value.UnitPrice * value.UnitsSold, 0);

‎src/app/pivot-grid/pivot-grid.sample.ts

Lines changed: 27 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -87,56 +87,48 @@ export class PivotGridSampleComponent {
8787
public selected: IPivotDimension[] = [this.dimensions[0], this.dimensions[1], this.dimensions[2]];
8888

8989
public pivotConfigHierarchy: IPivotConfiguration = {
90-
columns: [
91-
this.dimensions[0]
92-
],
93-
rows: [
94-
this.dimensions[1],
95-
this.dimensions[2]
90+
columns: [{
91+
memberName: 'SellerName',
92+
enabled: true
93+
},
9694
],
95+
rows: [{
96+
memberName: 'All',
97+
memberFunction: () => 'All',
98+
enabled: true,
99+
childLevel: {
100+
memberName: 'ProductCategory',
101+
memberFunction: (data) => data.ProductCategory,
102+
enabled: true
103+
}
104+
}, {
105+
memberName: 'Country',
106+
enabled: true
107+
}, {
108+
memberName: 'Date',
109+
enabled: true
110+
}],
97111
values: [
98112
{
99113
member: 'UnitsSold',
100114
aggregate: {
101-
key: 'SUM',
102115
aggregator: IgxPivotNumericAggregate.sum,
103-
label: 'Sum'
116+
key: 'UnitsSoldSUM',
117+
label: 'Sum of Units Sold'
104118
},
105119
enabled: true,
106-
styles: {
107-
upFont: (rowData: any, columnKey: any): boolean => rowData[columnKey] > 300,
108-
downFont: (rowData: any, columnKey: any): boolean => rowData[columnKey] <= 300
109-
},
110120
// dataType: 'currency',
111121
formatter: (value) => value ? value + '$' : undefined
112122
},
113123
{
114-
member: 'AmountOfSale',
115-
displayName: 'Amount of Sale',
124+
member: 'UnitPrice',
116125
aggregate: {
117-
key: 'SUM',
118-
aggregator: IgxTotalSaleAggregate.totalSale,
119-
label: 'Sum of Sale'
126+
aggregator: IgxPivotNumericAggregate.sum,
127+
key: 'UnitPriceSUM',
128+
label: 'Sum of Unit Price'
120129
},
121-
aggregateList: [{
122-
key: 'SUM',
123-
aggregator: IgxTotalSaleAggregate.totalSale,
124-
label: 'Sum of Sale'
125-
}, {
126-
key: 'MIN',
127-
aggregator: IgxTotalSaleAggregate.totalMin,
128-
label: 'Minimum of Sale'
129-
}, {
130-
key: 'MAX',
131-
aggregator: IgxTotalSaleAggregate.totalMax,
132-
label: 'Maximum of Sale'
133-
}],
134130
enabled: true,
135-
dataType: 'currency',
136-
styles: {
137-
upFont1: (rowData: any, columnKey: any): boolean => rowData[columnKey] > 50,
138-
downFont1: (rowData: any, columnKey: any): boolean => rowData[columnKey] <= 50
139-
},
131+
dataType: 'currency'
140132
}
141133
],
142134
filters: null

0 commit comments

Comments
 (0)