honeymoose/angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore(router): add tests for interaction between router-outer and

Browse Source 
@ViewChild.

Closes #5164
This commit is contained in:
Jeremy Elbourn 2015-11-06 10:01:03 -08:00 committed by Jeremy Elbourn
parent 837efc2a0f
commit 929abb9aa3
1 changed files with 88 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

125
modules/angular2/test/router/integration/router_integration_spec.ts
View File

@ -1,7 +1,7 @@
import { import {
AsyncTestCompleter, AsyncTestCompleter,
beforeEach, beforeEach,
beforeEachBindings, beforeEachProviders,
ddescribe, ddescribe,
describe, describe,
expect, expect,
@ -17,9 +17,9 @@ import {
import {bootstrap} from 'angular2/bootstrap'; import {bootstrap} from 'angular2/bootstrap';
import {Component, Directive, View} from 'angular2/src/core/metadata'; import {Component, Directive, View} from 'angular2/src/core/metadata';
import {DOM} from 'angular2/src/core/dom/dom_adapter'; import {DOM} from 'angular2/src/core/dom/dom_adapter';
import {provide} from 'angular2/core'; import {provide, ViewChild, AfterViewInit} from 'angular2/core';
import {DOCUMENT} from 'angular2/src/platform/dom/dom_tokens'; import {DOCUMENT} from 'angular2/src/platform/dom/dom_tokens';
import {RouteConfig, Route, Redirect} from 'angular2/src/router/route_config_decorator'; import {RouteConfig, Route, Redirect, AuxRoute} from 'angular2/src/router/route_config_decorator';
import {PromiseWrapper} from 'angular2/src/facade/async'; import {PromiseWrapper} from 'angular2/src/facade/async';
import {BaseException, WrappedException} from 'angular2/src/facade/exceptions'; import {BaseException, WrappedException} from 'angular2/src/facade/exceptions';
import { import {
@ -39,7 +39,7 @@ import {MockApplicationRef} from 'angular2/src/mock/mock_application_ref';
export function main() { export function main() {
describe('router injectables', () => { describe('router injectables', () => {
beforeEachBindings(() => { beforeEachProviders(() => {
return [ return [
ROUTER_PROVIDERS, ROUTER_PROVIDERS,
provide(LocationStrategy, {useClass: MockLocationStrategy}), provide(LocationStrategy, {useClass: MockLocationStrategy}),
@ -74,7 +74,7 @@ export function main() {
}); });
describe('broken app', () => { describe('broken app', () => {
beforeEachBindings( beforeEachProviders(
() => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: BrokenAppCmp})]; }); () => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: BrokenAppCmp})]; });
it('should rethrow exceptions from component constructors', it('should rethrow exceptions from component constructors',
@ -91,7 +91,7 @@ export function main() {
}); });
describe('back button app', () => { describe('back button app', () => {
beforeEachBindings( beforeEachProviders(
() => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: HierarchyAppCmp})]; }); () => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: HierarchyAppCmp})]; });
it('should change the url without pushing a new history state for back navigations', it('should change the url without pushing a new history state for back navigations',
@ -102,40 +102,39 @@ export function main() {
var router = fixture.debugElement.componentInstance.router; var router = fixture.debugElement.componentInstance.router;
var position = 0; var position = 0;
var flipped = false; var flipped = false;
var history = var history = [
[ ['/parent/child', 'root { parent { hello } }', '/super-parent/child'],
['/parent/child', 'root { parent { hello } }', '/super-parent/child'], ['/super-parent/child', 'root { super-parent { hello2 } }', '/parent/child'],
['/super-parent/child', 'root { super-parent { hello2 } }', '/parent/child'], ['/parent/child', 'root { parent { hello } }', false]
['/parent/child', 'root { parent { hello } }', false] ];
]
router.subscribe((_) => { router.subscribe((_) => {
var location = fixture.debugElement.componentInstance.location; var location = fixture.debugElement.componentInstance.location;
var element = fixture.debugElement.nativeElement; var element = fixture.debugElement.nativeElement;
var path = location.path(); var path = location.path();
var entry = history[position]; var entry = history[position];
expect(path).toEqual(entry[0]); expect(path).toEqual(entry[0]);
expect(element).toHaveText(entry[1]); expect(element).toHaveText(entry[1]);
var nextUrl = entry[2]; var nextUrl = entry[2];
if (nextUrl == false) { if (nextUrl == false) {
flipped = true; flipped = true;
} }
if (flipped && position == 0) { if (flipped && position == 0) {
async.done(); async.done();
return; return;
} }
position = position + (flipped ? -1 : 1); position = position + (flipped ? -1 : 1);
if (flipped) { if (flipped) {
location.back(); location.back();
} else { } else {
router.navigateByUrl(nextUrl); router.navigateByUrl(nextUrl);
} }
}); });
router.navigateByUrl(history[0][0]); router.navigateByUrl(history[0][0]);
}); });
@ -143,7 +142,7 @@ export function main() {
}); });
describe('hierarchical app', () => { describe('hierarchical app', () => {
beforeEachBindings( beforeEachProviders(
() => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: HierarchyAppCmp})]; }); () => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: HierarchyAppCmp})]; });
it('should bootstrap an app with a hierarchy', it('should bootstrap an app with a hierarchy',
@ -165,7 +164,7 @@ export function main() {
// TODO(btford): mock out level lower than LocationStrategy once that level exists // TODO(btford): mock out level lower than LocationStrategy once that level exists
xdescribe('custom app base ref', () => { xdescribe('custom app base ref', () => {
beforeEachBindings(() => { return [provide(APP_BASE_HREF, {useValue: '/my/app'})]; }); beforeEachProviders(() => { return [provide(APP_BASE_HREF, {useValue: '/my/app'})]; });
it('should bootstrap', it('should bootstrap',
inject([AsyncTestCompleter, TestComponentBuilder], inject([AsyncTestCompleter, TestComponentBuilder],
(async, tcb: TestComponentBuilder) => { (async, tcb: TestComponentBuilder) => {
@ -188,7 +187,7 @@ export function main() {
// TODO: add a test in which the child component has bindings // TODO: add a test in which the child component has bindings
describe('querystring params app', () => { describe('querystring params app', () => {
beforeEachBindings( beforeEachProviders(
() => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: QueryStringAppCmp})]; }); () => { return [provide(ROUTER_PRIMARY_COMPONENT, {useValue: QueryStringAppCmp})]; });
it('should recognize and return querystring params with the injected RouteParams', it('should recognize and return querystring params with the injected RouteParams',
@ -211,6 +210,35 @@ export function main() {
}); });
})); }));
}); });
describe('retrieving components loaded via outlet via @ViewChild', () => {
let tcb: TestComponentBuilder = null;
beforeEachProviders(() => [provide(ROUTER_PRIMARY_COMPONENT, {useValue: AppCmp})]);
beforeEach(inject([TestComponentBuilder],
(testComponentBuilder) => { tcb = testComponentBuilder; }));
it('should get a reference and pass data to components loaded inside of outlets',
inject([AsyncTestCompleter], (async) => {
tcb.createAsync(AppWithViewChildren)
.then(fixture => {
let appInstance = fixture.debugElement.componentInstance;
let router = appInstance.router;
router.subscribe((_) => {
fixture.detectChanges();
expect(appInstance.helloCmp).toBeAnInstanceOf(HelloCmp);
expect(appInstance.helloCmp.message).toBe('Ahoy');
async.done();
});
router.navigateByUrl('/rainbow(pony)');
});
}));
});
}); });
} }
@ -218,11 +246,13 @@ export function main() {
@Component({selector: 'hello-cmp'}) @Component({selector: 'hello-cmp'})
@View({template: 'hello'}) @View({template: 'hello'})
class HelloCmp { class HelloCmp {
public message: string;
} }
@Component({selector: 'hello2-cmp'}) @Component({selector: 'hello2-cmp'})
@View({template: 'hello2'}) @View({template: 'hello2'})
class Hello2Cmp { class Hello2Cmp {
public greeting: string;
} }
@Component({selector: 'app-cmp'}) @Component({selector: 'app-cmp'})
@ -232,6 +262,27 @@ class AppCmp {
constructor(public router: Router, public location: LocationStrategy) {} constructor(public router: Router, public location: LocationStrategy) {}
} }
@Component({
selector: 'app-cmp',
template: `
Hello routing!
<router-outlet></router-outlet>
<router-outlet name="pony"></router-outlet>`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([
new Route({path: '/rainbow', component: HelloCmp}),
new AuxRoute({name: 'pony', path: 'pony', component: Hello2Cmp})
])
class AppWithViewChildren implements AfterViewInit {
@ViewChild(HelloCmp) helloCmp: HelloCmp;
@ViewChild(Hello2Cmp) hello2Cmp: Hello2Cmp;
constructor(public router: Router, public location: LocationStrategy) {}
afterViewInit() { this.helloCmp.message = 'Ahoy'; }
}
@Component({selector: 'parent-cmp'}) @Component({selector: 'parent-cmp'})
@View({template: `parent { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES}) @View({template: `parent { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@RouteConfig([new Route({path: '/child', component: HelloCmp})]) @RouteConfig([new Route({path: '/child', component: HelloCmp})])