Skip to content

Commit 81186b8

Browse files
committed
Merge pull request #23 from MayaKirova/master
Adding tests for igHierarchicalGrid
2 parents 4c31075 + f5bdad9 commit 81186b8

File tree

13 files changed

+1081
-17
lines changed

13 files changed

+1081
-17
lines changed

src/igniteui.angular2.ts

Lines changed: 61 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ export class IgControlBase<Model> implements DoCheck {
101101
@Input() set options(v: Model) {
102102
this._config = v;
103103
this._differ = this._differs.find([]).create(null);
104-
this._opts = jQuery.extend(true, {}, this._config);
104+
this._opts = jQuery.extend(true, {}, this._config);
105105
if (this._opts.dataSource) {
106106
delete this._opts.dataSource;
107107
}
@@ -135,7 +135,7 @@ export class IgControlBase<Model> implements DoCheck {
135135
});
136136
}
137137

138-
if(this.changeDetectionInterval === undefined && this.changeDetectionInterval === null){
138+
if(this.changeDetectionInterval === undefined || this.changeDetectionInterval === null){
139139
this.changeDetectionInterval= 500;
140140
}
141141

@@ -149,6 +149,7 @@ export class IgControlBase<Model> implements DoCheck {
149149

150150
ngDoCheck() {
151151
if(this._allowChangeDetection){
152+
this._allowChangeDetection = false;
152153
this.optionChange();
153154
}
154155
}
@@ -377,16 +378,65 @@ export class IgTreeGridComponent extends IgGridBase<IgTreeGrid> {
377378

378379
deleteRow(id) {
379380
var element = jQuery(this._el),
380-
tr = element.find("tr[data-id='" + id + "']");
381+
tr = element.find("tr[data-id='" + id + "']"),
382+
dataLevel = tr.attr("aria-level");
381383
if (tr.length > 0) {
382-
tr.remove();
384+
383385
element.data(this._widgetName).dataSource.deleteRow(id, true);
384386
element.data(this._widgetName).dataSource._removeTransactionsByRecordId(id);
385387

386-
if (tr.attr("aria-owns")) {
387-
jQuery(tr.attr("aria-owns").split(" ")).each(function () {
388-
jQuery("#" + this).remove();
389-
});
388+
var trs = tr.nextUntil("tr[data-level="+dataLevel+"]");
389+
if(trs.length === 0){
390+
trs = tr.nextAll("tr[data-level]");
391+
}
392+
393+
tr.remove();
394+
trs.remove();
395+
}
396+
}
397+
ngDoCheck() {
398+
if (this._differ != null && this._allowChangeDetection) {
399+
this.optionChange();
400+
this._allowChangeDetection = false;
401+
var diff = [],
402+
element = jQuery(this._el),
403+
grid = element.data(this._widgetName),
404+
colIndex, td, i, j, pkKey = this._config.primaryKey, newFormattedVal, record, column;
405+
406+
//check for changes in collection
407+
this._changes = this._differ.diff(this._config.dataSource);
408+
if (this._config.dataSource.length !== this._dataSource.length) {
409+
this._dataSource = JSON.parse(JSON.stringify(this._config.dataSource));
410+
if (this._changes) {
411+
this._changes.forEachAddedItem(r => this.addRow(r.item, r.currentIndex));
412+
this._changes.forEachRemovedItem(r => this.deleteRow(r.item[pkKey]))
413+
}
414+
}
415+
//check for changes in values
416+
if (!this.equalsDiff(this._config.dataSource, this._dataSource, diff)) {
417+
this._dataSource = JSON.parse(JSON.stringify(this._config.dataSource));
418+
for (i = 0; i < diff.length; i++) {
419+
for (j = 0; j < diff[i].txlog.length; j++) {
420+
colIndex = element.data(this._widgetName)._getCellIndexByColumnKey(diff[i].txlog[j].key);
421+
record = this._config.dataSource[diff[i].index];
422+
td = element.find("tr[data-id='" + record[pkKey] + "']").children().get(colIndex);
423+
424+
column = element.data(this._widgetName).columnByKey(diff[i].txlog[j].key);
425+
if (column) {
426+
if (column.template) {
427+
newFormattedVal = grid._renderTemplatedCell(diff[i].txlog[j].newVal, column).substring(1);
428+
} else {
429+
newFormattedVal = grid._renderCell(diff[i].txlog[j].newVal, column, record);
430+
}
431+
jQuery(td).html(newFormattedVal);
432+
grid.dataSource.updateRow(record[pkKey], record);
433+
grid.dataSource._commitTransactionsByRowId(record[pkKey]);
434+
} else if(diff[i].txlog[j].key === this._config.childDataKey){
435+
//we have an hierarchical data source and one of the nested collections has changed.
436+
grid.dataBind();
437+
}
438+
}
439+
}
390440
}
391441
}
392442
}
@@ -436,7 +486,9 @@ export class IgHierarchicalGridComponent extends IgGridBase<IgHierarchicalGrid>
436486
var childGrid = element.data(this._widgetName).allChildrenWidgets().filter(function (indx) {
437487
var parentRow = jQuery(this.element).closest('tr[data-container]').prev();
438488
var parentGridPK = parentRow.closest(".ui-iggrid-table").data("igGrid").options.primaryKey;
439-
return this.options.childrenDataProperty === diff[i].txlog[j].key && parentRow.attr("data-id") == data[diff[i].index][parentGridPK];
489+
return (this.options.childrenDataProperty === diff[i].txlog[j].key ||
490+
parentRow.next("[data-container]").find("table[role='grid']").attr("id").contains("_" + diff[i].txlog[j].key + "_"))
491+
&& parentRow.attr("data-id") == data[diff[i].index][parentGridPK];
440492
});
441493
if (childGrid.length > 0) {
442494
jQuery(childGrid).each(function () {

tests/karma.conf.js

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,14 @@ module.exports = function(config){
44

55
frameworks: ["jasmine"],
66

7-
files : [
8-
9-
"http://code.jquery.com/jquery-1.12.3.js",
10-
"http://code.jquery.com/ui/1.10.3/jquery-ui.min.js",
11-
"http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js",
12-
"http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js",
13-
"https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.js",
7+
files : [
8+
9+
"http://code.jquery.com/jquery-1.12.3.js",
10+
"http://code.jquery.com/ui/1.10.3/jquery-ui.min.js",
11+
"http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js",
12+
"http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js",
13+
"http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.dv.js",
14+
"https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.js",
1415

1516
// IE required polyfills, in this exact order
1617
"node_modules/es6-shim/es6-shim.min.js",
@@ -20,8 +21,10 @@ module.exports = function(config){
2021
"node_modules/systemjs/dist/system.src.js",
2122
"node_modules/rxjs/bundles/Rx.js",
2223
"node_modules/angular2/bundles/angular2.dev.js",
24+
2325
"tests/karma-test-shim.js",
24-
26+
27+
{ pattern: 'samples/data/*.js', included: false, watched: false },
2528
{ pattern: "node_modules/angular2/**/*.js", included: false, watched: false },
2629
{ pattern: "node_modules/rxjs/**/*.js", included: false, watched: false },
2730

tests/unit/igcombo/combo.spec.ts

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
// modeled after https://github.com/angular/angular/blob/cee2318110eeea115e5f6fc5bfc814cbaa7d90d8/modules/angular2/test/common/directives/ng_for_spec.ts
2+
import { it, iit, describe, expect, inject, injectAsync, beforeEachProviders, fakeAsync, tick, TestComponentBuilder, AsyncTestCompleter } from 'angular2/testing_internal';
3+
import {Component, ViewChild, TemplateRef} from 'angular2/core';
4+
import * as Infragistics from '../../../src/igniteui.angular2';
5+
import {Northwind} from "../../../samples/data/northwind";
6+
7+
export function main() {
8+
describe('Infragistics Angular2 Combo', () => {
9+
it('should initialize correctly', injectAsync([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
10+
var template = '<div><ig-combo [(widgetId)]="comboID" [(options)]="options" [changeDetectionInterval]="cdi" [(ngModel)]="combo.value1"></ig-combo></div>';
11+
tcb.overrideTemplate(TestComponent, template)
12+
.createAsync(TestComponent)
13+
.then((fixture) => {
14+
fixture.detectChanges();
15+
expect(fixture.debugElement.componentInstance.viewChild).toBeAnInstanceOf(Infragistics.IgComboComponent);
16+
async.done();
17+
});
18+
}));
19+
20+
it('should be updated correctly if the ngModel value is updated', injectAsync([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
21+
var template = '<div><ig-combo [(widgetId)]="comboID" [(options)]="options" [changeDetectionInterval]="cdi" [(ngModel)]="combo.value1"></ig-combo></div>';
22+
tcb.overrideTemplate(TestComponent, template)
23+
.createAsync(TestComponent)
24+
.then((fixture) => {
25+
fixture.detectChanges();
26+
fixture.componentInstance.combo.value1= 1;
27+
setTimeout(function(){
28+
fixture.detectChanges();
29+
expect( $("#combo1").igCombo("value")).toBe(1);
30+
expect($("#combo1").igCombo("text")).toBe("Chai");
31+
async.done();
32+
},10);
33+
});
34+
}));
35+
36+
it('the ngModel should be updated correctly if the combo selection is updated', injectAsync([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
37+
var template = '<div><ig-combo [(widgetId)]="comboID" [(options)]="options" [changeDetectionInterval]="cdi" [(ngModel)]="combo.value1"></ig-combo></div>';
38+
tcb.overrideTemplate(TestComponent, template)
39+
.createAsync(TestComponent)
40+
.then((fixture) => {
41+
fixture.detectChanges();
42+
var elem = $("#combo1").igCombo("itemsFromIndex", 0)["element"];
43+
44+
$("#combo1").igCombo("select", elem, {}, true);
45+
setTimeout(function(){
46+
fixture.detectChanges();
47+
expect(fixture.componentInstance.combo.value1).toBe(1);
48+
async.done();
49+
},10);
50+
});
51+
}));
52+
53+
it('should reflect changes when a record in the data changes', injectAsync([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
54+
var template = '<div><ig-combo [(widgetId)]="comboID" [(options)]="options" [changeDetectionInterval]="cdi" [(ngModel)]="combo.value1"></ig-combo></div>';
55+
tcb.overrideTemplate(TestComponent, template)
56+
.createAsync(TestComponent)
57+
.then((fixture) => {
58+
fixture.detectChanges();
59+
fixture.componentInstance.northwind[19].ProductName = "Test";
60+
setTimeout(function(){
61+
fixture.detectChanges();
62+
var elem = $("#combo1").igCombo("itemsFromIndex", 19)["element"];
63+
expect(elem.text()).toBe("Test");
64+
expect($("#combo1").igCombo("text")).toBe("Test");
65+
async.done();
66+
},10);
67+
});
68+
}));
69+
70+
});
71+
}
72+
73+
@Component({
74+
selector: 'test-cmp',
75+
template: '<div></div>', //"Component 'TestComponent' must have either 'template' or 'templateUrl' set."
76+
directives: [Infragistics.IgComboComponent]
77+
})
78+
class TestComponent {
79+
private options: IgCombo;
80+
private northwind: any;
81+
private combo: any;
82+
private comboID: string
83+
private cdi = 10;
84+
@ViewChild(Infragistics.IgComboComponent) public viewChild: Infragistics.IgComboComponent;
85+
86+
constructor() {
87+
this.northwind = Northwind.getData();
88+
this.comboID = "combo1";
89+
this.options = {
90+
valueKey: "ProductID",
91+
textKey: "ProductName",
92+
dataSource: this.northwind,
93+
width: "100%"
94+
};
95+
this.combo = {
96+
value1: 20
97+
}
98+
}
99+
}
Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
// modeled after https://github.com/angular/angular/blob/cee2318110eeea115e5f6fc5bfc814cbaa7d90d8/modules/angular2/test/common/directives/ng_for_spec.ts
2+
import { it, iit, describe, expect, inject, injectAsync, beforeEachProviders, fakeAsync, tick, TestComponentBuilder, AsyncTestCompleter } from 'angular2/testing_internal';
3+
import {Component, ViewChild, TemplateRef} from 'angular2/core';
4+
import * as Infragistics from '../../../src/igniteui.angular2';
5+
6+
export function main() {
7+
describe('Infragistics Angular2 DataChart', () => {
8+
it('should initialize correctly', injectAsync([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
9+
var template = '<div><ig-data-chart widgetId="datachart1" [(options)]="opts" [changeDetectionInterval]="cdi"></ig-data-chart></div>';
10+
tcb.overrideTemplate(TestComponent, template)
11+
.createAsync(TestComponent)
12+
.then((fixture) => {
13+
fixture.detectChanges();
14+
expect(fixture.debugElement.componentInstance.viewChild).toBeAnInstanceOf(Infragistics.IgDataChartComponent);
15+
async.done();
16+
});
17+
}));
18+
});
19+
}
20+
21+
@Component({
22+
selector: 'test-cmp',
23+
template: '<div></div>', //"Component 'TestComponent' must have either 'template' or 'templateUrl' set."
24+
directives: [Infragistics.IgDataChartComponent]
25+
})
26+
class TestComponent {
27+
private opts: any;
28+
private zoombarOpts:any;
29+
private data: Array<any>;
30+
private cdi: number;
31+
@ViewChild(Infragistics.IgDataChartComponent) public viewChild: Infragistics.IgDataChartComponent;
32+
33+
constructor() {
34+
this.cdi = 10;
35+
this.data = [{
36+
"CountryName": "China",
37+
"Pop1995": 1216,
38+
"Pop2005": 1297,
39+
"Pop2015": 1361,
40+
"Pop2025": 1394
41+
}];
42+
this.opts = {
43+
dataSource: this.data,
44+
axes: [{
45+
name: "NameAxis",
46+
type: "categoryX",
47+
title: "Country",
48+
label: "CountryName"
49+
},
50+
{
51+
name: "PopulationAxis",
52+
type: "numericY",
53+
minimumvalue: 0,
54+
title: "Milions of People"
55+
}],
56+
series: [{
57+
name: "2015Population",
58+
type: "column",
59+
isHighlightingEnabled: true,
60+
isTransitionInEnabled: true,
61+
xAxis: "NameAxis",
62+
yAxis: "PopulationAxis",
63+
valueMemberPath: "Pop2015"
64+
}]
65+
};
66+
}
67+
}

tests/unit/igdialog/dialog.spec.ts

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
// modeled after https://github.com/angular/angular/blob/cee2318110eeea115e5f6fc5bfc814cbaa7d90d8/modules/angular2/test/common/directives/ng_for_spec.ts
2+
import { it, iit, describe, expect, inject, injectAsync, beforeEachProviders, fakeAsync, tick, TestComponentBuilder, AsyncTestCompleter } from 'angular2/testing_internal';
3+
import {Component, ViewChild, TemplateRef} from 'angular2/core';
4+
import * as Infragistics from '../../../src/igniteui.angular2';
5+
6+
export function main() {
7+
describe('Infragistics Angular2 Dialog', () => {
8+
it('should initialize correctly', injectAsync([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
9+
var template = '<div><ig-dialog widgetId="dialog" [(options)]="opts"><div>Test Content</div></ig-dialog></div>';
10+
tcb.overrideTemplate(TestComponent, template)
11+
.createAsync(TestComponent)
12+
.then((fixture) => {
13+
fixture.detectChanges();
14+
expect(fixture.debugElement.componentInstance.viewChild).toBeAnInstanceOf(Infragistics.IgDialogComponent);
15+
//expect($("#dialog").igDialog("content")).toBe("<div>Test Content</div>");
16+
async.done();
17+
});
18+
}));
19+
20+
});
21+
}
22+
23+
@Component({
24+
selector: 'test-cmp',
25+
template: '<div></div>', //"Component 'TestComponent' must have either 'template' or 'templateUrl' set."
26+
directives: [Infragistics.IgDialogComponent]
27+
})
28+
class TestComponent {
29+
private opts: any;
30+
31+
@ViewChild(Infragistics.IgDialogComponent) public viewChild: Infragistics.IgDialogComponent;
32+
33+
constructor() {
34+
this.opts = {
35+
headerText : "Header Text",
36+
height: "500px"
37+
};
38+
}
39+
}

0 commit comments

Comments
 (0)