Skip to content

Commit f6dc3b5

Browse files
vakrilovvakrilov
committed
Tests and Typings for dialogs
1 parent 61b1367 commit f6dc3b5

File tree

10 files changed

+151
-21
lines changed

10 files changed

+151
-21
lines changed

‎ng-sample/app/examples/action-bar/action-bar-test.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ class FirstComponent {
3131

3232

3333
@Component({
34-
selector: "nested-componenet",
34+
selector: "nested-component",
3535
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES],
3636
template: `
3737
@@ -65,7 +65,7 @@ class NestedComponent {
6565
6666
<StackLayout verticalAlignment="center">
6767
<Label text="Second Page is Here" class="title"></Label>
68-
<nested-componenet></nested-componenet>
68+
<nested-component></nested-component>
6969
</StackLayout>
7070
`,
7171
})

‎ng-sample/app/examples/navigation/nav-component.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ class DetailComponent {
7373
directives: [ROUTER_DIRECTIVES, NS_ROUTER_DIRECTIVES],
7474
template: `
7575
<GridLayout rows="auto, auto, auto, *" columns="*, *" margin="10" backgroundColor="lightgreen">
76-
<Label [text]="'Componenet ID: ' + compId" colSpan="2" row="0"
76+
<Label [text]="'Component ID: ' + compId" colSpan="2" row="0"
7777
style="font-size: 30; horizontal-align: center"></Label>
7878
7979
<Label [text]="'Depth: ' + depth" colSpan="2" row="1"
@@ -108,29 +108,29 @@ export class NavComponent implements OnActivate, OnDeactivate {
108108
this.compId = NavComponent.counter;
109109
this.depth = parseInt(params.get("depth"));
110110

111-
console.log("NavComponent.constructor() componenetID: " + this.compId)
111+
console.log("NavComponent.constructor() componentID: " + this.compId)
112112
}
113113

114114
public goBack() {
115115
this.location.back();
116116
}
117117

118118
routerOnActivate(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction): any {
119-
console.log("NavComponent.routerOnActivate() componenetID: " + this.compId)
119+
console.log("NavComponent.routerOnActivate() componentID: " + this.compId)
120120
}
121121

122122
routerOnDeactivate(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction): any {
123-
console.log("NavComponent.routerOnDeactivate() componenetID: " + this.compId)
123+
console.log("NavComponent.routerOnDeactivate() componentID: " + this.compId)
124124
}
125125

126126
routerCanReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction): any {
127127
// Reuse if depth is the same.
128128
var reuse = (prevInstruction.params["depth"] === nextInstruction.params["depth"]);
129-
console.log("NavComponent.routerCanReuse() componenetID: " + this.compId + " return: " + reuse);
129+
console.log("NavComponent.routerCanReuse() componentID: " + this.compId + " return: " + reuse);
130130
return reuse;
131131
}
132132

133133
routerOnReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction): any {
134-
console.log("NavComponent.routerOnReuse() componenetID: " + this.compId);
134+
console.log("NavComponent.routerOnReuse() componentID: " + this.compId);
135135
}
136136
}

‎src/nativescript-angular/directives/dialogs.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -55,12 +55,12 @@ export class ModalDialogService {
5555
})
5656
.then((compRef) => {
5757
//Component loaded. Find its root native view.
58-
const componenetView = <View>compRef.location.nativeElement;
59-
if (componenetView.parent) {
60-
(<any>componenetView.parent).removeChild(componenetView);
58+
const componentView = <View>compRef.location.nativeElement;
59+
if (componentView.parent) {
60+
(<any>componentView.parent).removeChild(componentView);
6161
}
62-
page.content = componenetView;
63-
(<any>page)._showNativeModalView(this.page, options.context, closeCallback, options.fullscreen);
62+
page.content = componentView;
63+
this.page.showModal(page, options.context, closeCallback, options.fullscreen);
6464
});
6565
})
6666
}

‎src/nativescript-angular/modal-dialog.d.ts

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import {Type} from 'angular2/core';
2+
3+
export interface ModalDialogOptions {
4+
context?: any;
5+
fullscreen?: boolean;
6+
}
7+
8+
export class ModalDialogParams {
9+
public context: any;
10+
public closeCallback: (...args) => any;
11+
}
12+
13+
export class ModalDialogService {
14+
public showModal(type: Type, options: ModalDialogOptions): Promise<any>;
15+
}
16+
17+
export class ModalDialogHost {
18+
}

‎src/nativescript-angular/modal-dialog.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
export {
2+
ModalDialogHost,
3+
ModalDialogOptions,
4+
ModalDialogParams,
5+
ModalDialogService
6+
} from "./directives/dialogs";

‎src/nativescript-angular/router/page-router-outlet.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -155,13 +155,13 @@ export class PageRouterOutlet extends RouterOutlet {
155155

156156
private loadComponentInPage(page: Page, componentRef: ComponentRef): Promise<ComponentRef> {
157157
//Component loaded. Find its root native view.
158-
const componenetView = componentRef.location.nativeElement;
158+
const componentView = componentRef.location.nativeElement;
159159
//Remove it from original native parent.
160-
if (<any>componenetView.parent) {
161-
(<any>componenetView.parent).removeChild(componenetView);
160+
if (<any>componentView.parent) {
161+
(<any>componentView.parent).removeChild(componentView);
162162
}
163163
//Add it to the new page
164-
page.content = componenetView;
164+
page.content = componentView;
165165

166166
this.location.navigateToNewPage();
167167
return new Promise((resolve, reject) => {

‎tests/app/tests/modal-dialog.ts

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
//make sure you import mocha-config before angular2/core
2+
import {assert} from "./test-config";
3+
import {Component, ComponentRef} from "angular2/core";
4+
import {TestApp} from "./test-app";
5+
import {Page} from "ui/page";
6+
import {topmost} from "ui/frame";
7+
import {ModalDialogHost, ModalDialogOptions, ModalDialogParams, ModalDialogService} from "../nativescript-angular/directives/dialogs";
8+
9+
@Component({
10+
selector: "modal-comp",
11+
template: `<Label text="this is modal component"></Label>`
12+
})
13+
export class ModalComponent {
14+
constructor(public params: ModalDialogParams) {
15+
// Close after a while
16+
setTimeout(() => {
17+
var result = this.params.context;
18+
this.params.closeCallback(result);
19+
}, 200);
20+
}
21+
}
22+
23+
@Component({
24+
selector: "fail-comp",
25+
providers: [ModalDialogService],
26+
template: `<Label text="This app is doomed"></Label>`
27+
28+
})
29+
export class FailComponent {
30+
constructor(public service: ModalDialogService) {
31+
}
32+
}
33+
34+
@Component({
35+
selector: "sucess-comp",
36+
directives: [ModalDialogHost],
37+
providers: [ModalDialogService],
38+
template: `
39+
<GridLayout modal-dialog-host margin="20">
40+
<Label text="Modal dialogs"></Label>
41+
</GridLayout>`
42+
})
43+
export class SuccessComponent {
44+
constructor(public service: ModalDialogService) {
45+
}
46+
}
47+
48+
describe('modal-dialog', () => {
49+
let testApp: TestApp = null;
50+
51+
before(() => {
52+
return TestApp.create().then((app) => {
53+
testApp = app;
54+
})
55+
});
56+
57+
after(() => {
58+
testApp.dispose();
59+
});
60+
61+
afterEach(() => {
62+
var page = topmost().currentPage;
63+
if (page && page.modal) {
64+
console.log("Warning: closing a leftover modal page!");
65+
page.modal.closeModal();
66+
67+
}
68+
testApp.disposeComponents();
69+
});
70+
71+
72+
it("showModal throws when there is no modal-dialog-host", (done) => {
73+
testApp.loadComponent(FailComponent)
74+
.then((ref) => {
75+
var service = <ModalDialogService>ref.instance.service;
76+
assert.throws(() => service.showModal(ModalComponent, {}), "No elementRef: Make sure you have the modal-dialog-host directive inside your component.");
77+
done();
78+
})
79+
.catch(done)
80+
});
81+
82+
it("showModal succeeds when there is modal-dialog-host", (done) => {
83+
testApp.loadComponent(SuccessComponent)
84+
.then((ref) => {
85+
var service = <ModalDialogService>ref.instance.service;
86+
return service.showModal(ModalComponent, {});
87+
})
88+
.then((res) => done())
89+
.catch(done)
90+
});
91+
92+
93+
it("showModal passes modal params and gets result when resolved", (done) => {
94+
var context = { property: "my context" };
95+
testApp.loadComponent(SuccessComponent)
96+
.then((ref) => {
97+
var service = <ModalDialogService>ref.instance.service;
98+
return service.showModal(ModalComponent, { context: context });
99+
})
100+
.then((res) => {
101+
assert.strictEqual(res, context);
102+
done();
103+
})
104+
.catch(done);
105+
})
106+
});

‎tests/app/tests/renderer-tests.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ describe('Renderer E2E', () => {
120120
});
121121

122122
afterEach(() => {
123-
testApp.disposeComponenets();
123+
testApp.disposeComponents();
124124
});
125125

126126
it("component with a layout", () => {

‎tests/app/tests/router.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -203,7 +203,7 @@ describe('page-router-outlet', () => {
203203
}
204204

205205
it("loads default path", () => {
206-
// App-Root app-componenet first-componenet
206+
// App-Root app-component first-component
207207
// | | |
208208
var expected = "(ROOT (ProxyViewContainer), (ProxyViewContainer (Label[text=First])))";
209209
assert.equal(expected, dumpView(testApp.elementRef.nativeElement, true));

‎tests/app/tests/test-app.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export class TestApp {
3131
});
3232
}
3333

34-
public disposeComponenets() {
34+
public disposeComponents() {
3535
while (this._pendingDispose.length > 0) {
3636
const componentRef = this._pendingDispose.pop()
3737
componentRef.dispose();
@@ -43,7 +43,7 @@ export class TestApp {
4343
}
4444

4545
public dispose() {
46-
this.disposeComponenets();
46+
this.disposeComponents();
4747
destroyTestApp(this);
4848
}
4949
}

0 commit comments

Comments
 (0)