chore: remove deprecated router 1/2
This commit is contained in:
parent
beadf6167a
commit
a20a420be6
|
@ -1,60 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF} from '@angular/common';
|
||||
import {Component, ComponentRef} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {CanActivate, ComponentInstruction, ROUTER_DIRECTIVES, RouteConfig} from '@angular/router-deprecated';
|
||||
|
||||
function checkIfWeHavePermission(instruction: ComponentInstruction) {
|
||||
return instruction.params['id'] == '1';
|
||||
}
|
||||
|
||||
// #docregion canActivate
|
||||
@Component({selector: 'control-panel-cmp', template: `<div>Settings: ...</div>`})
|
||||
@CanActivate(checkIfWeHavePermission)
|
||||
class ControlPanelCmp {
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'home-cmp',
|
||||
template: `
|
||||
<h1>Welcome Home!</h1>
|
||||
<div>
|
||||
Edit <a [routerLink]="['/ControlPanelCmp', {id: 1}]" id="user-1-link">User 1</a> |
|
||||
Edit <a [routerLink]="['/ControlPanelCmp', {id: 2}]" id="user-2-link">User 2</a>
|
||||
</div>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
class HomeCmp {
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>My App</h1>
|
||||
<router-outlet></router-outlet>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/user-settings/:id', component: ControlPanelCmp, name: 'ControlPanelCmp'},
|
||||
{path: '/', component: HomeCmp, name: 'HomeCmp'}
|
||||
])
|
||||
export class AppCmp {
|
||||
}
|
||||
|
||||
|
||||
export function main(): Promise<ComponentRef<AppCmp>> {
|
||||
return bootstrap(
|
||||
AppCmp, [{provide: APP_BASE_HREF, useValue: '/@angular/examples/router/ts/can_activate'}]);
|
||||
}
|
|
@ -1,43 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
|
||||
|
||||
function waitForElement(selector: string) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
describe('reuse example app', function() {
|
||||
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
var URL = '@angular/examples/router/ts/can_activate/';
|
||||
|
||||
it('should navigate to user 1', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('home-cmp');
|
||||
|
||||
element(by.css('#user-1-link')).click();
|
||||
waitForElement('control-panel-cmp');
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/user-settings\/1$/);
|
||||
|
||||
expect(element(by.css('control-panel-cmp')).getText()).toContain('Settings');
|
||||
});
|
||||
|
||||
it('should not navigate to user 2', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('home-cmp');
|
||||
|
||||
element(by.css('#user-2-link')).click();
|
||||
waitForElement('home-cmp');
|
||||
|
||||
expect(element(by.css('home-cmp')).getText()).toContain('Welcome Home!');
|
||||
});
|
||||
});
|
|
@ -1,23 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Routing canActivate Lifecycle Example</title>
|
||||
<base href="/">
|
||||
|
||||
<script src="http://cdnjs.cloudflare.com/ajax/libs/systemjs/0.18.4/system.js"></script>
|
||||
<script>System.config({ baseURL: '/', defaultJSExtensions: true});</script>
|
||||
<script src="/bundle/angular2.dev.js"></script>
|
||||
<script src="/bundle/router.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<example-app>
|
||||
Loading...
|
||||
</example-app>
|
||||
<script>
|
||||
var filename = '@angular/examples/router/ts/can_activate/can_activate_example';
|
||||
System.import(filename).then(function(m) {
|
||||
m.main();
|
||||
}, console.error.bind(console));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,70 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF} from '@angular/common';
|
||||
import {Component, ComponentRef, provide} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {CanDeactivate, ComponentInstruction, ROUTER_DIRECTIVES, RouteConfig, RouteParams} from '@angular/router-deprecated';
|
||||
|
||||
|
||||
// #docregion routerCanDeactivate
|
||||
@Component({
|
||||
selector: 'note-cmp',
|
||||
template: `
|
||||
<div>
|
||||
<h2>id: {{id}}</h2>
|
||||
<textarea cols="40" rows="10"></textarea>
|
||||
</div>`
|
||||
})
|
||||
class NoteCmp implements CanDeactivate {
|
||||
id: string;
|
||||
|
||||
constructor(params: RouteParams) { this.id = params.get('id'); }
|
||||
|
||||
routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
return confirm('Are you sure you want to leave?');
|
||||
}
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'note-index-cmp',
|
||||
template: `
|
||||
<h1>Your Notes</h1>
|
||||
<div>
|
||||
Edit <a [routerLink]="['/NoteCmp', {id: 1}]" id="note-1-link">Note 1</a> |
|
||||
Edit <a [routerLink]="['/NoteCmp', {id: 2}]" id="note-2-link">Note 2</a>
|
||||
</div>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
class NoteIndexCmp {
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>My App</h1>
|
||||
<router-outlet></router-outlet>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/note/:id', component: NoteCmp, name: 'NoteCmp'},
|
||||
{path: '/', component: NoteIndexCmp, name: 'NoteIndexCmp'}
|
||||
])
|
||||
export class AppCmp {
|
||||
}
|
||||
|
||||
|
||||
export function main(): Promise<ComponentRef<AppCmp>> {
|
||||
return bootstrap(
|
||||
AppCmp, [{provide: APP_BASE_HREF, useValue: '/@angular/examples/router/ts/can_deactivate'}]);
|
||||
}
|
|
@ -1,59 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
|
||||
|
||||
function waitForElement(selector: string) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
function waitForAlert() {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
browser.wait(EC.alertIsPresent(), 1000);
|
||||
}
|
||||
|
||||
describe('can deactivate example app', function() {
|
||||
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
var URL = '@angular/examples/router/ts/can_deactivate/';
|
||||
|
||||
it('should not navigate away when prompt is cancelled', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('note-index-cmp');
|
||||
|
||||
element(by.css('#note-1-link')).click();
|
||||
waitForElement('note-cmp');
|
||||
|
||||
browser.navigate().back();
|
||||
waitForAlert();
|
||||
|
||||
browser.switchTo().alert().dismiss(); // Use to simulate cancel button
|
||||
|
||||
expect(element(by.css('note-cmp')).getText()).toContain('id: 1');
|
||||
});
|
||||
|
||||
it('should navigate away when prompt is confirmed', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('note-index-cmp');
|
||||
|
||||
element(by.css('#note-1-link')).click();
|
||||
waitForElement('note-cmp');
|
||||
|
||||
browser.navigate().back();
|
||||
waitForAlert();
|
||||
|
||||
browser.switchTo().alert().accept();
|
||||
|
||||
waitForElement('note-index-cmp');
|
||||
|
||||
expect(element(by.css('note-index-cmp')).getText()).toContain('Your Notes');
|
||||
});
|
||||
});
|
|
@ -1,24 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Routing routerCanDeactivate Lifecycle Example</title>
|
||||
<base href="/">
|
||||
|
||||
<script src="http://cdn.rawgit.com/google/traceur-compiler/90da568c7aa8e53ea362db1fc211fbb4f65b5e94/bin/traceur-runtime.js"></script>
|
||||
<script src="http://cdnjs.cloudflare.com/ajax/libs/systemjs/0.18.4/system.js"></script>
|
||||
<script>System.config({ baseURL: '/', defaultJSExtensions: true});</script>
|
||||
<script src="/bundle/angular2.dev.js"></script>
|
||||
<script src="/bundle/router.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<example-app>
|
||||
Loading...
|
||||
</example-app>
|
||||
<script>
|
||||
var filename = '@angular/examples/router/ts/can_deactivate/can_deactivate_example';
|
||||
System.import(filename).then(function(m) {
|
||||
m.main();
|
||||
}, console.error.bind(console));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,61 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF} from '@angular/common';
|
||||
import {Component, ComponentRef, provide} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {ComponentInstruction, OnActivate, ROUTER_DIRECTIVES, RouteConfig} from '@angular/router-deprecated';
|
||||
|
||||
|
||||
// #docregion routerOnActivate
|
||||
@Component({template: `Child`})
|
||||
class ChildCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<h2>Parent</h2> (<router-outlet></router-outlet>)
|
||||
<p>{{log}}</p>`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([{path: '/child', name: 'Child', component: ChildCmp}])
|
||||
class ParentCmp implements OnActivate {
|
||||
log: string = '';
|
||||
|
||||
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
this.log = `Finished navigating from "${prev ? prev.urlPath : 'null'}" to "${next.urlPath}"`;
|
||||
|
||||
return new Promise(resolve => {
|
||||
// The ChildCmp gets instantiated only when the Promise is resolved
|
||||
setTimeout(() => resolve(null), 1000);
|
||||
});
|
||||
}
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>My app</h1>
|
||||
|
||||
<nav>
|
||||
<a [routerLink]="['Parent', 'Child']">Child</a>
|
||||
</nav>
|
||||
<router-outlet></router-outlet>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([{path: '/parent/...', name: 'Parent', component: ParentCmp}])
|
||||
export class AppCmp {
|
||||
}
|
||||
|
||||
export function main(): Promise<ComponentRef<AppCmp>> {
|
||||
return bootstrap(
|
||||
AppCmp, [{provide: APP_BASE_HREF, useValue: '/@angular/examples/router/ts/on_activate'}]);
|
||||
}
|
|
@ -1,24 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Routing Reuse Lifecycle Example</title>
|
||||
<base href="/">
|
||||
|
||||
<script src="http://cdn.rawgit.com/google/traceur-compiler/90da568c7aa8e53ea362db1fc211fbb4f65b5e94/bin/traceur-runtime.js"></script>
|
||||
<script src="http://cdnjs.cloudflare.com/ajax/libs/systemjs/0.18.4/system.js"></script>
|
||||
<script>System.config({ baseURL: '/', defaultJSExtensions: true});</script>
|
||||
<script src="/bundle/angular2.dev.js"></script>
|
||||
<script src="/bundle/router.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<example-app>
|
||||
Loading...
|
||||
</example-app>
|
||||
<script>
|
||||
var filename = '@angular/examples/router/ts/on_deactivate/on_deactivate_example';
|
||||
System.import(filename).then(function(m) {
|
||||
m.main();
|
||||
}, console.error.bind(console));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,65 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF} from '@angular/common';
|
||||
import {Component, ComponentRef, Injectable} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {ComponentInstruction, OnDeactivate, ROUTER_DIRECTIVES, RouteConfig} from '@angular/router-deprecated';
|
||||
|
||||
|
||||
@Injectable()
|
||||
export class LogService {
|
||||
logs: string[] = [];
|
||||
|
||||
addLog(message: string): void { this.logs.push(message); }
|
||||
}
|
||||
|
||||
|
||||
// #docregion routerOnDeactivate
|
||||
@Component({selector: 'my-cmp', template: `<div>hello</div>`})
|
||||
class MyCmp implements OnDeactivate {
|
||||
constructor(private logService: LogService) {}
|
||||
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
this.logService.addLog(
|
||||
`Navigating from "${prev ? prev.urlPath : 'null'}" to "${next.urlPath}"`);
|
||||
}
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>My App</h1>
|
||||
<nav>
|
||||
<a [routerLink]="['/HomeCmp']" id="home-link">Navigate Home</a> |
|
||||
<a [routerLink]="['/ParamCmp', {param: 1}]" id="param-link">Navigate with a Param</a>
|
||||
</nav>
|
||||
<router-outlet></router-outlet>
|
||||
<div id="log">
|
||||
<h2>Log:</h2>
|
||||
<p *ngFor="let logItem of logService.logs">{{ logItem }}</p>
|
||||
</div>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/', component: MyCmp, name: 'HomeCmp'},
|
||||
{path: '/:param', component: MyCmp, name: 'ParamCmp'}
|
||||
])
|
||||
export class AppCmp {
|
||||
constructor(public logService: LogService) {}
|
||||
}
|
||||
|
||||
|
||||
export function main(): Promise<ComponentRef<AppCmp>> {
|
||||
return bootstrap(AppCmp, [
|
||||
{provide: APP_BASE_HREF, useValue: '/@angular/examples/router/ts/on_deactivate'}, LogService
|
||||
]);
|
||||
}
|
|
@ -1,39 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
|
||||
|
||||
function waitForElement(selector: string) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
describe('on activate example app', function() {
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
var URL = '@angular/examples/router/ts/on_deactivate/';
|
||||
|
||||
it('should update the text when navigating between routes', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('my-cmp');
|
||||
|
||||
expect(element(by.css('#log')).getText()).toEqual('Log:');
|
||||
|
||||
element(by.css('#param-link')).click();
|
||||
waitForElement('my-cmp');
|
||||
|
||||
expect(element(by.css('#log')).getText()).toEqual('Log:\nNavigating from "" to "1"');
|
||||
|
||||
browser.navigate().back();
|
||||
waitForElement('my-cmp');
|
||||
|
||||
expect(element(by.css('#log')).getText())
|
||||
.toEqual('Log:\nNavigating from "" to "1"\nNavigating from "./1" to ""');
|
||||
});
|
||||
});
|
|
@ -1,24 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Routing Reuse Lifecycle Example</title>
|
||||
<base href="/">
|
||||
|
||||
<script src="http://cdn.rawgit.com/google/traceur-compiler/90da568c7aa8e53ea362db1fc211fbb4f65b5e94/bin/traceur-runtime.js"></script>
|
||||
<script src="http://cdnjs.cloudflare.com/ajax/libs/systemjs/0.18.4/system.js"></script>
|
||||
<script>System.config({ baseURL: '/', defaultJSExtensions: true});</script>
|
||||
<script src="/bundle/angular2.dev.js"></script>
|
||||
<script src="/bundle/router.dev.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<example-app>
|
||||
Loading...
|
||||
</example-app>
|
||||
<script>
|
||||
var filename = '@angular/examples/router/ts/reuse/reuse_example';
|
||||
System.import(filename).then(function(m) {
|
||||
m.main();
|
||||
}, console.error.bind(console));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,59 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF} from '@angular/common';
|
||||
import {Component, ComponentRef} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {CanReuse, ComponentInstruction, OnReuse, ROUTER_DIRECTIVES, RouteConfig, RouteParams} from '@angular/router-deprecated';
|
||||
|
||||
|
||||
|
||||
// #docregion reuseCmp
|
||||
@Component({
|
||||
selector: 'my-cmp',
|
||||
template: `
|
||||
<div>hello {{name}}!</div>
|
||||
<div>message: <input id="message"></div>
|
||||
`
|
||||
})
|
||||
class MyCmp implements CanReuse,
|
||||
OnReuse {
|
||||
name: string;
|
||||
constructor(params: RouteParams) { this.name = params.get('name') || 'NOBODY'; }
|
||||
|
||||
routerCanReuse(next: ComponentInstruction, prev: ComponentInstruction) { return true; }
|
||||
|
||||
routerOnReuse(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
this.name = next.params['name'];
|
||||
}
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>Say hi to...</h1>
|
||||
<a [routerLink]="['/HomeCmp', {name: 'naomi'}]" id="naomi-link">Naomi</a> |
|
||||
<a [routerLink]="['/HomeCmp', {name: 'brad'}]" id="brad-link">Brad</a>
|
||||
<router-outlet></router-outlet>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/', component: MyCmp, name: 'HomeCmp'},
|
||||
{path: '/:name', component: MyCmp, name: 'HomeCmp'}
|
||||
])
|
||||
export class AppCmp {
|
||||
}
|
||||
|
||||
|
||||
export function main(): Promise<ComponentRef<AppCmp>> {
|
||||
return bootstrap(
|
||||
AppCmp, [{provide: APP_BASE_HREF, useValue: '/@angular/examples/router/ts/reuse'}]);
|
||||
}
|
|
@ -1,43 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
|
||||
|
||||
function waitForElement(selector: string) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
describe('reuse example app', function() {
|
||||
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
var URL = '@angular/examples/router/ts/reuse/';
|
||||
|
||||
it('should build a link which points to the detail page', function() {
|
||||
browser.get(URL);
|
||||
waitForElement('my-cmp');
|
||||
|
||||
element(by.css('#naomi-link')).click();
|
||||
waitForElement('my-cmp');
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/naomi$/);
|
||||
|
||||
// type something into input
|
||||
element(by.css('#message')).sendKeys('long time no see!');
|
||||
|
||||
// navigate to Brad
|
||||
element(by.css('#brad-link')).click();
|
||||
waitForElement('my-cmp');
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/brad$/);
|
||||
|
||||
// check that typed input is the same
|
||||
expect(element(by.css('#message')).getAttribute('value')).toEqual('long time no see!');
|
||||
});
|
||||
|
||||
});
|
|
@ -1,12 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {__core_private__ as _} from '@angular/core';
|
||||
|
||||
export var makeDecorator: typeof _.makeDecorator = _.makeDecorator;
|
||||
export var reflector: typeof _.reflector = _.reflector;
|
|
@ -1,9 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
export * from './router';
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"name": "@angular/router-deprecated",
|
||||
"version": "0.0.0-PLACEHOLDER",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"jsnext:main": "esm/index.js",
|
||||
"typins": "index.d.ts",
|
||||
"author": "angular",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"@angular/core": "0.0.0-PLACEHOLDER",
|
||||
"@angular/common": "0.0.0-PLACEHOLDER",
|
||||
"@angular/platform-browser": "0.0.0-PLACEHOLDER"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/angular/angular.git"
|
||||
}
|
||||
}
|
|
@ -1,19 +0,0 @@
|
|||
|
||||
export default {
|
||||
entry: '../../../dist/packages-dist/router-deprecated/esm/index.js',
|
||||
dest: '../../../dist/packages-dist/router-deprecated/esm/router-deprecated.umd.js',
|
||||
format: 'umd',
|
||||
moduleName: 'ng.router_deprecated',
|
||||
globals: {
|
||||
'@angular/core': 'ng.core',
|
||||
'@angular/common': 'ng.common',
|
||||
'@angular/platform-browser': 'ng.platformBrowser',
|
||||
'rxjs/Subject': 'Rx',
|
||||
'rxjs/observable/PromiseObservable': 'Rx', // this is wrong, but this stuff has changed in rxjs b.6 so we need to fix it when we update.
|
||||
'rxjs/operator/toPromise': 'Rx.Observable.prototype',
|
||||
'rxjs/Observable': 'Rx'
|
||||
},
|
||||
plugins: [
|
||||
// nodeResolve({ jsnext: true, main: true }),
|
||||
]
|
||||
}
|
|
@ -1,55 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
/**
|
||||
* @module
|
||||
* @description
|
||||
* Maps application URLs into application states, to support deep-linking and navigation.
|
||||
*/
|
||||
|
||||
export {RouterLink} from './src/directives/router_link';
|
||||
export {RouterOutlet} from './src/directives/router_outlet';
|
||||
export {RouteData, RouteParams} from './src/instruction';
|
||||
export {ROUTER_PRIMARY_COMPONENT, RouteRegistry} from './src/route_registry';
|
||||
export {RootRouter, Router} from './src/router';
|
||||
|
||||
export * from './src/route_config/route_config_decorator';
|
||||
export * from './src/route_definition';
|
||||
export {OnActivate, OnDeactivate, OnReuse, CanDeactivate, CanReuse} from './src/interfaces';
|
||||
export {CanActivate} from './src/lifecycle/lifecycle_annotations';
|
||||
export {Instruction, ComponentInstruction} from './src/instruction';
|
||||
export {OpaqueToken} from '@angular/core';
|
||||
export {ROUTER_PROVIDERS_COMMON} from './src/router_providers_common';
|
||||
export {ROUTER_PROVIDERS, ROUTER_BINDINGS} from './src/router_providers';
|
||||
|
||||
import {RouterOutlet} from './src/directives/router_outlet';
|
||||
import {RouterLink} from './src/directives/router_link';
|
||||
|
||||
/**
|
||||
* A list of directives. To use the router directives like {@link RouterOutlet} and
|
||||
* {@link RouterLink}, add this to your `directives` array in the {@link Component} decorator
|
||||
* of your component.
|
||||
*
|
||||
* ### Example ([live demo](http://plnkr.co/edit/iRUP8B5OUbxCWQ3AcIDm))
|
||||
*
|
||||
* ```
|
||||
* import {Component} from '@angular/core';
|
||||
* import {ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig} from '@angular/router-deprecated';
|
||||
*
|
||||
* @Component({directives: [ROUTER_DIRECTIVES]})
|
||||
* @RouteConfig([
|
||||
* {...},
|
||||
* ])
|
||||
* class AppCmp {
|
||||
* // ...
|
||||
* }
|
||||
*
|
||||
* bootstrap(AppCmp, [ROUTER_PROVIDERS]);
|
||||
* ```
|
||||
*/
|
||||
export const ROUTER_DIRECTIVES: any[] = [RouterOutlet, RouterLink];
|
|
@ -1,93 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {Directive} from '@angular/core';
|
||||
|
||||
import {isString} from '../facade/lang';
|
||||
import {Instruction} from '../instruction';
|
||||
import {Router} from '../router';
|
||||
|
||||
|
||||
/**
|
||||
* The RouterLink directive lets you link to specific parts of your app.
|
||||
*
|
||||
* Consider the following route configuration:
|
||||
|
||||
* ```
|
||||
* @RouteConfig([
|
||||
* { path: '/user', component: UserCmp, name: 'User' }
|
||||
* ]);
|
||||
* class MyComp {}
|
||||
* ```
|
||||
*
|
||||
* When linking to this `User` route, you can write:
|
||||
*
|
||||
* ```
|
||||
* <a [routerLink]="['./User']">link to user component</a>
|
||||
* ```
|
||||
*
|
||||
* RouterLink expects the value to be an array of route names, followed by the params
|
||||
* for that level of routing. For instance `['/Team', {teamId: 1}, 'User', {userId: 2}]`
|
||||
* means that we want to generate a link for the `Team` route with params `{teamId: 1}`,
|
||||
* and with a child route `User` with params `{userId: 2}`.
|
||||
*
|
||||
* The first route name should be prepended with `/`, `./`, or `../`.
|
||||
* If the route begins with `/`, the router will look up the route from the root of the app.
|
||||
* If the route begins with `./`, the router will instead look in the current component's
|
||||
* children for the route. And if the route begins with `../`, the router will look at the
|
||||
* current component's parent.
|
||||
*/
|
||||
@Directive({
|
||||
selector: '[routerLink]',
|
||||
inputs: ['routeParams: routerLink', 'target'],
|
||||
host: {
|
||||
'(click)': 'onClick()',
|
||||
'[attr.href]': 'visibleHref',
|
||||
'[class.router-link-active]': 'isRouteActive'
|
||||
}
|
||||
})
|
||||
export class RouterLink {
|
||||
private _routeParams: any[];
|
||||
|
||||
// the url displayed on the anchor element.
|
||||
visibleHref: string;
|
||||
target: string;
|
||||
|
||||
// the instruction passed to the router to navigate
|
||||
private _navigationInstruction: Instruction;
|
||||
|
||||
constructor(private _router: Router, private _location: Location) {
|
||||
// we need to update the link whenever a route changes to account for aux routes
|
||||
this._router.subscribe((_) => this._updateLink());
|
||||
}
|
||||
|
||||
// because auxiliary links take existing primary and auxiliary routes into account,
|
||||
// we need to update the link whenever params or other routes change.
|
||||
private _updateLink(): void {
|
||||
this._navigationInstruction = this._router.generate(this._routeParams);
|
||||
var navigationHref = this._navigationInstruction.toLinkUrl();
|
||||
this.visibleHref = this._location.prepareExternalUrl(navigationHref);
|
||||
}
|
||||
|
||||
get isRouteActive(): boolean { return this._router.isRouteActive(this._navigationInstruction); }
|
||||
|
||||
set routeParams(changes: any[]) {
|
||||
this._routeParams = changes;
|
||||
this._updateLink();
|
||||
}
|
||||
|
||||
onClick(): boolean {
|
||||
// If no target, or if target is _self, prevent default browser behavior
|
||||
if (!isString(this.target) || this.target == '_self') {
|
||||
this._router.navigateByInstruction(this._navigationInstruction);
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
|
@ -1,176 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Attribute, ComponentRef, Directive, DynamicComponentLoader, OnDestroy, Output, ReflectiveInjector, ViewContainerRef, provide} from '@angular/core';
|
||||
|
||||
import {EventEmitter} from '../facade/async';
|
||||
import {StringMapWrapper} from '../facade/collection';
|
||||
import {isBlank, isPresent} from '../facade/lang';
|
||||
import {ComponentInstruction, RouteData, RouteParams} from '../instruction';
|
||||
import {CanDeactivate, CanReuse, OnActivate, OnDeactivate, OnReuse} from '../interfaces';
|
||||
import * as hookMod from '../lifecycle/lifecycle_annotations';
|
||||
import {hasLifecycleHook} from '../lifecycle/route_lifecycle_reflector';
|
||||
import * as routerMod from '../router';
|
||||
|
||||
let _resolveToTrue = Promise.resolve(true);
|
||||
|
||||
/**
|
||||
* A router outlet is a placeholder that Angular dynamically fills based on the application's route.
|
||||
*
|
||||
* ## Use
|
||||
*
|
||||
* ```
|
||||
* <router-outlet></router-outlet>
|
||||
* ```
|
||||
*/
|
||||
@Directive({selector: 'router-outlet'})
|
||||
export class RouterOutlet implements OnDestroy {
|
||||
name: string = null;
|
||||
private _componentRef: Promise<ComponentRef<any>> = null;
|
||||
private _currentInstruction: ComponentInstruction = null;
|
||||
|
||||
@Output('activate') public activateEvents = new EventEmitter<any>();
|
||||
|
||||
constructor(
|
||||
private _viewContainerRef: ViewContainerRef, private _loader: DynamicComponentLoader,
|
||||
private _parentRouter: routerMod.Router, @Attribute('name') nameAttr: string) {
|
||||
if (isPresent(nameAttr)) {
|
||||
this.name = nameAttr;
|
||||
this._parentRouter.registerAuxOutlet(this);
|
||||
} else {
|
||||
this._parentRouter.registerPrimaryOutlet(this);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Called by the Router to instantiate a new component during the commit phase of a navigation.
|
||||
* This method in turn is responsible for calling the `routerOnActivate` hook of its child.
|
||||
*/
|
||||
activate(nextInstruction: ComponentInstruction): Promise<any> {
|
||||
var previousInstruction = this._currentInstruction;
|
||||
this._currentInstruction = nextInstruction;
|
||||
var componentType = nextInstruction.componentType;
|
||||
var childRouter = this._parentRouter.childRouter(componentType);
|
||||
|
||||
var providers = ReflectiveInjector.resolve([
|
||||
{provide: RouteData, useValue: nextInstruction.routeData},
|
||||
{provide: RouteParams, useValue: new RouteParams(nextInstruction.params)},
|
||||
{provide: routerMod.Router, useValue: childRouter}
|
||||
]);
|
||||
this._componentRef =
|
||||
this._loader.loadNextToLocation(componentType, this._viewContainerRef, providers);
|
||||
return this._componentRef.then((componentRef) => {
|
||||
this.activateEvents.emit(componentRef.instance);
|
||||
if (hasLifecycleHook(hookMod.routerOnActivate, componentType)) {
|
||||
return this._componentRef.then(
|
||||
(ref: ComponentRef<any>) =>
|
||||
(<OnActivate>ref.instance).routerOnActivate(nextInstruction, previousInstruction));
|
||||
} else {
|
||||
return componentRef;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Called by the {@link Router} during the commit phase of a navigation when an outlet
|
||||
* reuses a component between different routes.
|
||||
* This method in turn is responsible for calling the `routerOnReuse` hook of its child.
|
||||
*/
|
||||
reuse(nextInstruction: ComponentInstruction): Promise<any> {
|
||||
var previousInstruction = this._currentInstruction;
|
||||
this._currentInstruction = nextInstruction;
|
||||
|
||||
// it's possible the component is removed before it can be reactivated (if nested withing
|
||||
// another dynamically loaded component, for instance). In that case, we simply activate
|
||||
// a new one.
|
||||
if (isBlank(this._componentRef)) {
|
||||
return this.activate(nextInstruction);
|
||||
} else {
|
||||
return Promise.resolve(
|
||||
hasLifecycleHook(hookMod.routerOnReuse, this._currentInstruction.componentType) ?
|
||||
this._componentRef.then(
|
||||
(ref: ComponentRef<any>) =>
|
||||
(<OnReuse>ref.instance).routerOnReuse(nextInstruction, previousInstruction)) :
|
||||
true);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Called by the {@link Router} when an outlet disposes of a component's contents.
|
||||
* This method in turn is responsible for calling the `routerOnDeactivate` hook of its child.
|
||||
*/
|
||||
deactivate(nextInstruction: ComponentInstruction): Promise<any> {
|
||||
var next = _resolveToTrue;
|
||||
if (isPresent(this._componentRef) && isPresent(this._currentInstruction) &&
|
||||
hasLifecycleHook(hookMod.routerOnDeactivate, this._currentInstruction.componentType)) {
|
||||
next = this._componentRef.then(
|
||||
(ref: ComponentRef<any>) =>
|
||||
(<OnDeactivate>ref.instance)
|
||||
.routerOnDeactivate(nextInstruction, this._currentInstruction));
|
||||
}
|
||||
return next.then((_) => {
|
||||
if (isPresent(this._componentRef)) {
|
||||
var onDispose = this._componentRef.then((ref: ComponentRef<any>) => ref.destroy());
|
||||
this._componentRef = null;
|
||||
return onDispose;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Called by the {@link Router} during recognition phase of a navigation.
|
||||
*
|
||||
* If this resolves to `false`, the given navigation is cancelled.
|
||||
*
|
||||
* This method delegates to the child component's `routerCanDeactivate` hook if it exists,
|
||||
* and otherwise resolves to true.
|
||||
*/
|
||||
routerCanDeactivate(nextInstruction: ComponentInstruction): Promise<boolean> {
|
||||
if (isBlank(this._currentInstruction)) {
|
||||
return _resolveToTrue;
|
||||
}
|
||||
if (hasLifecycleHook(hookMod.routerCanDeactivate, this._currentInstruction.componentType)) {
|
||||
return this._componentRef.then(
|
||||
(ref: ComponentRef<any>) =>
|
||||
(<CanDeactivate>ref.instance)
|
||||
.routerCanDeactivate(nextInstruction, this._currentInstruction));
|
||||
} else {
|
||||
return _resolveToTrue;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Called by the {@link Router} during recognition phase of a navigation.
|
||||
*
|
||||
* If the new child component has a different Type than the existing child component,
|
||||
* this will resolve to `false`. You can't reuse an old component when the new component
|
||||
* is of a different Type.
|
||||
*
|
||||
* Otherwise, this method delegates to the child component's `routerCanReuse` hook if it exists,
|
||||
* or resolves to true if the hook is not present.
|
||||
*/
|
||||
routerCanReuse(nextInstruction: ComponentInstruction): Promise<boolean> {
|
||||
var result: any /** TODO #9100 */;
|
||||
|
||||
if (isBlank(this._currentInstruction) ||
|
||||
this._currentInstruction.componentType != nextInstruction.componentType) {
|
||||
result = false;
|
||||
} else if (hasLifecycleHook(hookMod.routerCanReuse, this._currentInstruction.componentType)) {
|
||||
result = this._componentRef.then(
|
||||
(ref: ComponentRef<any>) =>
|
||||
(<CanReuse>ref.instance).routerCanReuse(nextInstruction, this._currentInstruction));
|
||||
} else {
|
||||
result = nextInstruction == this._currentInstruction ||
|
||||
(isPresent(nextInstruction.params) && isPresent(this._currentInstruction.params) &&
|
||||
StringMapWrapper.equals(nextInstruction.params, this._currentInstruction.params));
|
||||
}
|
||||
return <Promise<boolean>>Promise.resolve(result);
|
||||
}
|
||||
|
||||
ngOnDestroy(): void { this._parentRouter.unregisterPrimaryOutlet(this); }
|
||||
}
|
|
@ -1 +0,0 @@
|
|||
../../facade/src
|
|
@ -1,329 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {StringMapWrapper} from '../src/facade/collection';
|
||||
import {isBlank, isPresent, normalizeBlank} from '../src/facade/lang';
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* `RouteParams` is an immutable map of parameters for the given route
|
||||
* based on the url matcher and optional parameters for that route.
|
||||
*
|
||||
* You can inject `RouteParams` into the constructor of a component to use it.
|
||||
*
|
||||
* ### Example
|
||||
*
|
||||
* ```
|
||||
* import {Component} from '@angular/core';
|
||||
* import {bootstrap} from '@angular/platform-browser/browser';
|
||||
* import {Router, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig, RouteParams} from
|
||||
* 'angular2/router';
|
||||
*
|
||||
* @Component({directives: [ROUTER_DIRECTIVES]})
|
||||
* @RouteConfig([
|
||||
* {path: '/user/:id', component: UserCmp, name: 'UserCmp'},
|
||||
* ])
|
||||
* class AppCmp {}
|
||||
*
|
||||
* @Component({ template: 'user: {{id}}' })
|
||||
* class UserCmp {
|
||||
* id: string;
|
||||
* constructor(params: RouteParams) {
|
||||
* this.id = params.get('id');
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* bootstrap(AppCmp, ROUTER_PROVIDERS);
|
||||
* ```
|
||||
*/
|
||||
export class RouteParams {
|
||||
constructor(public params: {[key: string]: string}) {}
|
||||
|
||||
get(param: string): string { return normalizeBlank(StringMapWrapper.get(this.params, param)); }
|
||||
}
|
||||
|
||||
/**
|
||||
* `RouteData` is an immutable map of additional data you can configure in your {@link Route}.
|
||||
*
|
||||
* You can inject `RouteData` into the constructor of a component to use it.
|
||||
*
|
||||
* ### Example
|
||||
*
|
||||
* ```
|
||||
* import {Component} from '@angular/core';
|
||||
* import {bootstrap} from '@angular/platform-browser/browser';
|
||||
* import {Router, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig, RouteData} from
|
||||
* 'angular2/router';
|
||||
*
|
||||
* @Component({directives: [ROUTER_DIRECTIVES]})
|
||||
* @RouteConfig([
|
||||
* {path: '/user/:id', component: UserCmp, name: 'UserCmp', data: {isAdmin: true}},
|
||||
* ])
|
||||
* class AppCmp {}
|
||||
*
|
||||
* @Component({
|
||||
* ...,
|
||||
* template: 'user: {{isAdmin}}'
|
||||
* })
|
||||
* class UserCmp {
|
||||
* string: isAdmin;
|
||||
* constructor(data: RouteData) {
|
||||
* this.isAdmin = data.get('isAdmin');
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* bootstrap(AppCmp, ROUTER_PROVIDERS);
|
||||
* ```
|
||||
*/
|
||||
export class RouteData {
|
||||
constructor(public data: {[key: string]: any} = {}) {}
|
||||
|
||||
get(key: string): any { return normalizeBlank(StringMapWrapper.get(this.data, key)); }
|
||||
}
|
||||
|
||||
export var BLANK_ROUTE_DATA = new RouteData();
|
||||
|
||||
/**
|
||||
* `Instruction` is a tree of {@link ComponentInstruction}s with all the information needed
|
||||
* to transition each component in the app to a given route, including all auxiliary routes.
|
||||
*
|
||||
* `Instruction`s can be created using {@link Router#generate}, and can be used to
|
||||
* perform route changes with {@link Router#navigateByInstruction}.
|
||||
*
|
||||
* ### Example
|
||||
*
|
||||
* ```
|
||||
* import {Component} from '@angular/core';
|
||||
* import {bootstrap} from '@angular/platform-browser/browser';
|
||||
* import {Router, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig} from
|
||||
* '@angular/router-deprecated';
|
||||
*
|
||||
* @Component({directives: [ROUTER_DIRECTIVES]})
|
||||
* @RouteConfig([
|
||||
* {...},
|
||||
* ])
|
||||
* class AppCmp {
|
||||
* constructor(router: Router) {
|
||||
* var instruction = router.generate(['/MyRoute']);
|
||||
* router.navigateByInstruction(instruction);
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* bootstrap(AppCmp, ROUTER_PROVIDERS);
|
||||
* ```
|
||||
*/
|
||||
export abstract class Instruction {
|
||||
constructor(
|
||||
public component: ComponentInstruction, public child: Instruction,
|
||||
public auxInstruction: {[key: string]: Instruction}) {}
|
||||
|
||||
get urlPath(): string { return isPresent(this.component) ? this.component.urlPath : ''; }
|
||||
|
||||
get urlParams(): string[] { return isPresent(this.component) ? this.component.urlParams : []; }
|
||||
|
||||
get specificity(): string {
|
||||
var total = '';
|
||||
if (isPresent(this.component)) {
|
||||
total += this.component.specificity;
|
||||
}
|
||||
if (isPresent(this.child)) {
|
||||
total += this.child.specificity;
|
||||
}
|
||||
return total;
|
||||
}
|
||||
|
||||
abstract resolveComponent(): Promise<ComponentInstruction>;
|
||||
|
||||
/**
|
||||
* converts the instruction into a URL string
|
||||
*/
|
||||
toRootUrl(): string { return this.toUrlPath() + this.toUrlQuery(); }
|
||||
|
||||
/** @internal */
|
||||
_toNonRootUrl(): string {
|
||||
return this._stringifyPathMatrixAuxPrefixed() +
|
||||
(isPresent(this.child) ? this.child._toNonRootUrl() : '');
|
||||
}
|
||||
|
||||
toUrlQuery(): string { return this.urlParams.length > 0 ? ('?' + this.urlParams.join('&')) : ''; }
|
||||
|
||||
/**
|
||||
* Returns a new instruction that shares the state of the existing instruction, but with
|
||||
* the given child {@link Instruction} replacing the existing child.
|
||||
*/
|
||||
replaceChild(child: Instruction): Instruction {
|
||||
return new ResolvedInstruction(this.component, child, this.auxInstruction);
|
||||
}
|
||||
|
||||
/**
|
||||
* If the final URL for the instruction is ``
|
||||
*/
|
||||
toUrlPath(): string {
|
||||
return this.urlPath + this._stringifyAux() +
|
||||
(isPresent(this.child) ? this.child._toNonRootUrl() : '');
|
||||
}
|
||||
|
||||
// default instructions override these
|
||||
toLinkUrl(): string {
|
||||
return this.urlPath + this._stringifyAux() +
|
||||
(isPresent(this.child) ? this.child._toLinkUrl() : '') + this.toUrlQuery();
|
||||
}
|
||||
|
||||
// this is the non-root version (called recursively)
|
||||
/** @internal */
|
||||
_toLinkUrl(): string {
|
||||
return this._stringifyPathMatrixAuxPrefixed() +
|
||||
(isPresent(this.child) ? this.child._toLinkUrl() : '');
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_stringifyPathMatrixAuxPrefixed(): string {
|
||||
var primary = this._stringifyPathMatrixAux();
|
||||
if (primary.length > 0) {
|
||||
primary = '/' + primary;
|
||||
}
|
||||
return primary;
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_stringifyMatrixParams(): string {
|
||||
return this.urlParams.length > 0 ? (';' + this.urlParams.join(';')) : '';
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_stringifyPathMatrixAux(): string {
|
||||
if (isBlank(this.component) && isBlank(this.urlPath)) {
|
||||
return '';
|
||||
}
|
||||
return this.urlPath + this._stringifyMatrixParams() + this._stringifyAux();
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_stringifyAux(): string {
|
||||
var routes: any[] /** TODO #9100 */ = [];
|
||||
StringMapWrapper.forEach(this.auxInstruction, (auxInstruction: Instruction, _: string) => {
|
||||
routes.push(auxInstruction._stringifyPathMatrixAux());
|
||||
});
|
||||
if (routes.length > 0) {
|
||||
return '(' + routes.join('//') + ')';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* a resolved instruction has an outlet instruction for itself, but maybe not for...
|
||||
*/
|
||||
export class ResolvedInstruction extends Instruction {
|
||||
constructor(
|
||||
component: ComponentInstruction, child: Instruction,
|
||||
auxInstruction: {[key: string]: Instruction}) {
|
||||
super(component, child, auxInstruction);
|
||||
}
|
||||
|
||||
resolveComponent(): Promise<ComponentInstruction> { return Promise.resolve(this.component); }
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Represents a resolved default route
|
||||
*/
|
||||
export class DefaultInstruction extends ResolvedInstruction {
|
||||
constructor(component: ComponentInstruction, child: DefaultInstruction) {
|
||||
super(component, child, {});
|
||||
}
|
||||
|
||||
toLinkUrl(): string { return ''; }
|
||||
|
||||
/** @internal */
|
||||
_toLinkUrl(): string { return ''; }
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Represents a component that may need to do some redirection or lazy loading at a later time.
|
||||
*/
|
||||
export class UnresolvedInstruction extends Instruction {
|
||||
constructor(
|
||||
private _resolver: () => Promise<Instruction>, private _urlPath: string = '',
|
||||
private _urlParams: string[] = []) {
|
||||
super(null, null, {});
|
||||
}
|
||||
|
||||
get urlPath(): string {
|
||||
if (isPresent(this.component)) {
|
||||
return this.component.urlPath;
|
||||
}
|
||||
if (isPresent(this._urlPath)) {
|
||||
return this._urlPath;
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
get urlParams(): string[] {
|
||||
if (isPresent(this.component)) {
|
||||
return this.component.urlParams;
|
||||
}
|
||||
if (isPresent(this._urlParams)) {
|
||||
return this._urlParams;
|
||||
}
|
||||
return [];
|
||||
}
|
||||
|
||||
resolveComponent(): Promise<ComponentInstruction> {
|
||||
if (isPresent(this.component)) {
|
||||
return Promise.resolve(this.component);
|
||||
}
|
||||
return this._resolver().then((instruction: Instruction) => {
|
||||
this.child = isPresent(instruction) ? instruction.child : null;
|
||||
return this.component = isPresent(instruction) ? instruction.component : null;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export class RedirectInstruction extends ResolvedInstruction {
|
||||
constructor(
|
||||
component: ComponentInstruction, child: Instruction,
|
||||
auxInstruction: {[key: string]: Instruction}, private _specificity: string) {
|
||||
super(component, child, auxInstruction);
|
||||
}
|
||||
|
||||
get specificity(): string { return this._specificity; }
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* A `ComponentInstruction` represents the route state for a single component.
|
||||
*
|
||||
* `ComponentInstructions` is a public API. Instances of `ComponentInstruction` are passed
|
||||
* to route lifecycle hooks, like {@link CanActivate}.
|
||||
*
|
||||
* `ComponentInstruction`s are [hash consed](https://en.wikipedia.org/wiki/Hash_consing). You should
|
||||
* never construct one yourself with "new." Instead, rely on router's internal recognizer to
|
||||
* construct `ComponentInstruction`s.
|
||||
*
|
||||
* You should not modify this object. It should be treated as immutable.
|
||||
*/
|
||||
export class ComponentInstruction {
|
||||
reuse: boolean = false;
|
||||
public routeData: RouteData;
|
||||
|
||||
/**
|
||||
* @internal
|
||||
*/
|
||||
constructor(
|
||||
public urlPath: string, public urlParams: string[], data: RouteData,
|
||||
public componentType: any /** TODO #9100 */, public terminal: boolean,
|
||||
public specificity: string, public params: {[key: string]: string} = null,
|
||||
public routeName: string) {
|
||||
this.routeData = isPresent(data) ? data : BLANK_ROUTE_DATA;
|
||||
}
|
||||
}
|
|
@ -1,131 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {global} from '../src/facade/lang';
|
||||
|
||||
import {ComponentInstruction} from './instruction';
|
||||
|
||||
|
||||
// This is here only so that after TS transpilation the file is not empty.
|
||||
// TODO(rado): find a better way to fix this, or remove if likely culprit
|
||||
// https://github.com/systemjs/systemjs/issues/487 gets closed.
|
||||
var __ignore_me = global;
|
||||
|
||||
/**
|
||||
* Defines route lifecycle method `routerOnActivate`, which is called by the router at the end of a
|
||||
* successful route navigation.
|
||||
*
|
||||
* For a single component's navigation, only one of either {@link OnActivate} or {@link OnReuse}
|
||||
* will be called depending on the result of {@link CanReuse}.
|
||||
*
|
||||
* The `routerOnActivate` hook is called with two {@link ComponentInstruction}s as parameters, the
|
||||
* first
|
||||
* representing the current route being navigated to, and the second parameter representing the
|
||||
* previous route or `null`.
|
||||
*
|
||||
* If `routerOnActivate` returns a promise, the route change will wait until the promise settles to
|
||||
* instantiate and activate child components.
|
||||
*
|
||||
* ### Example
|
||||
* {@example router_deprecated/ts/on_activate/on_activate_example.ts region='routerOnActivate'}
|
||||
*/
|
||||
export interface OnActivate {
|
||||
routerOnActivate(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction):
|
||||
any|Promise<any>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines route lifecycle method `routerOnReuse`, which is called by the router at the end of a
|
||||
* successful route navigation when {@link CanReuse} is implemented and returns or resolves to true.
|
||||
*
|
||||
* For a single component's navigation, only one of either {@link OnActivate} or {@link OnReuse}
|
||||
* will be called, depending on the result of {@link CanReuse}.
|
||||
*
|
||||
* The `routerOnReuse` hook is called with two {@link ComponentInstruction}s as parameters, the
|
||||
* first
|
||||
* representing the current route being navigated to, and the second parameter representing the
|
||||
* previous route or `null`.
|
||||
*
|
||||
* ### Example
|
||||
* {@example router_deprecated/ts/reuse/reuse_example.ts region='reuseCmp'}
|
||||
*/
|
||||
export interface OnReuse {
|
||||
routerOnReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction): any
|
||||
|Promise<any>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines route lifecycle method `routerOnDeactivate`, which is called by the router before
|
||||
* destroying
|
||||
* a component as part of a route change.
|
||||
*
|
||||
* The `routerOnDeactivate` hook is called with two {@link ComponentInstruction}s as parameters, the
|
||||
* first
|
||||
* representing the current route being navigated to, and the second parameter representing the
|
||||
* previous route.
|
||||
*
|
||||
* If `routerOnDeactivate` returns a promise, the route change will wait until the promise settles.
|
||||
*
|
||||
* ### Example
|
||||
* {@example router_deprecated/ts/on_deactivate/on_deactivate_example.ts
|
||||
* region='routerOnDeactivate'}
|
||||
*/
|
||||
export interface OnDeactivate {
|
||||
routerOnDeactivate(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction):
|
||||
any|Promise<any>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines route lifecycle method `routerCanReuse`, which is called by the router to determine
|
||||
* whether a
|
||||
* component should be reused across routes, or whether to destroy and instantiate a new component.
|
||||
*
|
||||
* The `routerCanReuse` hook is called with two {@link ComponentInstruction}s as parameters, the
|
||||
* first
|
||||
* representing the current route being navigated to, and the second parameter representing the
|
||||
* previous route.
|
||||
*
|
||||
* If `routerCanReuse` returns or resolves to `true`, the component instance will be reused and the
|
||||
* {@link OnDeactivate} hook will be run. If `routerCanReuse` returns or resolves to `false`, a new
|
||||
* component will be instantiated, and the existing component will be deactivated and removed as
|
||||
* part of the navigation.
|
||||
*
|
||||
* If `routerCanReuse` throws or rejects, the navigation will be cancelled.
|
||||
*
|
||||
* ### Example
|
||||
* {@example router_deprecated/ts/reuse/reuse_example.ts region='reuseCmp'}
|
||||
*/
|
||||
export interface CanReuse {
|
||||
routerCanReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction):
|
||||
boolean|Promise<boolean>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines route lifecycle method `routerCanDeactivate`, which is called by the router to determine
|
||||
* if a component can be removed as part of a navigation.
|
||||
*
|
||||
* The `routerCanDeactivate` hook is called with two {@link ComponentInstruction}s as parameters,
|
||||
* the
|
||||
* first representing the current route being navigated to, and the second parameter
|
||||
* representing the previous route.
|
||||
*
|
||||
* If `routerCanDeactivate` returns or resolves to `false`, the navigation is cancelled. If it
|
||||
* returns or
|
||||
* resolves to `true`, then the navigation continues, and the component will be deactivated
|
||||
* (the {@link OnDeactivate} hook will be run) and removed.
|
||||
*
|
||||
* If `routerCanDeactivate` throws or rejects, the navigation is also cancelled.
|
||||
*
|
||||
* ### Example
|
||||
* {@example router_deprecated/ts/can_deactivate/can_deactivate_example.ts
|
||||
* region='routerCanDeactivate'}
|
||||
*/
|
||||
export interface CanDeactivate {
|
||||
routerCanDeactivate(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction):
|
||||
boolean|Promise<boolean>;
|
||||
}
|
|
@ -1,51 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
/**
|
||||
* This indirection is needed to free up Component, etc symbols in the public API
|
||||
* to be used by the decorator versions of these annotations.
|
||||
*/
|
||||
|
||||
import {makeDecorator} from '../../core_private';
|
||||
import {ComponentInstruction} from '../instruction';
|
||||
|
||||
import {CanActivate as CanActivateAnnotation} from './lifecycle_annotations_impl';
|
||||
|
||||
export {routerCanDeactivate, routerCanReuse, routerOnActivate, routerOnDeactivate, routerOnReuse} from './lifecycle_annotations_impl';
|
||||
|
||||
|
||||
/**
|
||||
* Defines route lifecycle hook `CanActivate`, which is called by the router to determine
|
||||
* if a component can be instantiated as part of a navigation.
|
||||
*
|
||||
* <aside class="is-right">
|
||||
* Note that unlike other lifecycle hooks, this one uses an annotation rather than an interface.
|
||||
* This is because the `CanActivate` function is called before the component is instantiated.
|
||||
* </aside>
|
||||
*
|
||||
* The `CanActivate` hook is called with two {@link ComponentInstruction}s as parameters, the first
|
||||
* representing the current route being navigated to, and the second parameter representing the
|
||||
* previous route or `null`.
|
||||
*
|
||||
* ```typescript
|
||||
* @CanActivate((next, prev) => boolean | Promise<boolean>)
|
||||
* ```
|
||||
*
|
||||
* If `CanActivate` returns or resolves to `false`, the navigation is cancelled.
|
||||
* If `CanActivate` throws or rejects, the navigation is also cancelled.
|
||||
* If `CanActivate` returns or resolves to `true`, navigation continues, the component is
|
||||
* instantiated, and the {@link OnActivate} hook of that component is called if implemented.
|
||||
*
|
||||
* ### Example
|
||||
*
|
||||
* {@example router_deprecated/ts/can_activate/can_activate_example.ts region='canActivate' }
|
||||
* @Annotation
|
||||
*/
|
||||
export var CanActivate:
|
||||
(hook: (next: ComponentInstruction, prev: ComponentInstruction) => Promise<boolean>| boolean) =>
|
||||
ClassDecorator = makeDecorator(CanActivateAnnotation);
|
|
@ -1,23 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
|
||||
export class RouteLifecycleHook {
|
||||
constructor(public name: string) {}
|
||||
}
|
||||
|
||||
export class CanActivate {
|
||||
constructor(public fn: Function) {}
|
||||
}
|
||||
|
||||
export const routerCanReuse: RouteLifecycleHook = new RouteLifecycleHook('routerCanReuse');
|
||||
export const routerCanDeactivate: RouteLifecycleHook =
|
||||
new RouteLifecycleHook('routerCanDeactivate');
|
||||
export const routerOnActivate: RouteLifecycleHook = new RouteLifecycleHook('routerOnActivate');
|
||||
export const routerOnReuse: RouteLifecycleHook = new RouteLifecycleHook('routerOnReuse');
|
||||
export const routerOnDeactivate: RouteLifecycleHook = new RouteLifecycleHook('routerOnDeactivate');
|
|
@ -1,30 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Type} from '@angular/core';
|
||||
|
||||
import {reflector} from '../../core_private';
|
||||
|
||||
import {CanActivate, RouteLifecycleHook} from './lifecycle_annotations_impl';
|
||||
|
||||
export function hasLifecycleHook(e: RouteLifecycleHook, type: any /** TODO #9100 */): boolean {
|
||||
if (!(type instanceof Type)) return false;
|
||||
return e.name in (<any>type).prototype;
|
||||
}
|
||||
|
||||
export function getCanActivateHook(type: any /** TODO #9100 */): Function {
|
||||
var annotations = reflector.annotations(type);
|
||||
for (let i = 0; i < annotations.length; i += 1) {
|
||||
let annotation = annotations[i];
|
||||
if (annotation instanceof CanActivate) {
|
||||
return annotation.fn;
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
|
@ -1,4 +0,0 @@
|
|||
{
|
||||
"name": "@angular/router",
|
||||
"version": "0.2.0"
|
||||
}
|
|
@ -1,24 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {makeDecorator} from '../../core_private';
|
||||
|
||||
import {RouteConfig as RouteConfigAnnotation, RouteDefinition} from './route_config_impl';
|
||||
|
||||
export {AsyncRoute, AuxRoute, Redirect, Route, RouteDefinition} from './route_config_impl';
|
||||
|
||||
|
||||
// Copied from RouteConfig in route_config_impl.
|
||||
/**
|
||||
* The `RouteConfig` decorator defines routes for a given component.
|
||||
*
|
||||
* It takes an array of {@link RouteDefinition}s.
|
||||
* @Annotation
|
||||
*/
|
||||
export var RouteConfig: (configs: RouteDefinition[]) => ClassDecorator =
|
||||
makeDecorator(RouteConfigAnnotation);
|
|
@ -1,204 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Type} from '../facade/lang';
|
||||
import {RouteDefinition} from '../route_definition';
|
||||
import {RegexSerializer} from '../rules/route_paths/regex_route_path';
|
||||
|
||||
export {RouteDefinition} from '../route_definition';
|
||||
|
||||
/**
|
||||
* The `RouteConfig` decorator defines routes for a given component.
|
||||
*
|
||||
* It takes an array of {@link RouteDefinition}s.
|
||||
*/
|
||||
export class RouteConfig {
|
||||
constructor(public configs: RouteDefinition[]) {}
|
||||
}
|
||||
|
||||
export abstract class AbstractRoute implements RouteDefinition {
|
||||
name: string;
|
||||
useAsDefault: boolean;
|
||||
path: string;
|
||||
regex: string;
|
||||
regex_group_names: string[];
|
||||
serializer: RegexSerializer;
|
||||
data: {[key: string]: any};
|
||||
|
||||
constructor({name, useAsDefault, path, regex, regex_group_names, serializer,
|
||||
data}: RouteDefinition) {
|
||||
this.name = name;
|
||||
this.useAsDefault = useAsDefault;
|
||||
this.path = path;
|
||||
this.regex = regex;
|
||||
this.regex_group_names = regex_group_names;
|
||||
this.serializer = serializer;
|
||||
this.data = data;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* `Route` is a type of {@link RouteDefinition} used to route a path to a component.
|
||||
*
|
||||
* It has the following properties:
|
||||
* - `path` is a string that uses the route matcher DSL.
|
||||
* - `component` a component type.
|
||||
* - `name` is an optional `CamelCase` string representing the name of the route.
|
||||
* - `data` is an optional property of any type representing arbitrary route metadata for the given
|
||||
* route. It is injectable via {@link RouteData}.
|
||||
* - `useAsDefault` is a boolean value. If `true`, the child route will be navigated to if no child
|
||||
* route is specified during the navigation.
|
||||
*
|
||||
* ### Example
|
||||
* ```
|
||||
* import {RouteConfig, Route} from '@angular/router-deprecated';
|
||||
*
|
||||
* @RouteConfig([
|
||||
* new Route({path: '/home', component: HomeCmp, name: 'HomeCmp' })
|
||||
* ])
|
||||
* class MyApp {}
|
||||
* ```
|
||||
*/
|
||||
export class Route extends AbstractRoute {
|
||||
component: any;
|
||||
aux: string = null;
|
||||
|
||||
constructor({name, useAsDefault, path, regex, regex_group_names, serializer, data,
|
||||
component}: RouteDefinition) {
|
||||
super({
|
||||
name: name,
|
||||
useAsDefault: useAsDefault,
|
||||
path: path,
|
||||
regex: regex,
|
||||
regex_group_names: regex_group_names,
|
||||
serializer: serializer,
|
||||
data: data
|
||||
});
|
||||
this.component = component;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* `AuxRoute` is a type of {@link RouteDefinition} used to define an auxiliary route.
|
||||
*
|
||||
* It takes an object with the following properties:
|
||||
* - `path` is a string that uses the route matcher DSL.
|
||||
* - `component` a component type.
|
||||
* - `name` is an optional `CamelCase` string representing the name of the route.
|
||||
* - `data` is an optional property of any type representing arbitrary route metadata for the given
|
||||
* route. It is injectable via {@link RouteData}.
|
||||
*
|
||||
* ### Example
|
||||
* ```
|
||||
* import {RouteConfig, AuxRoute} from '@angular/router-deprecated';
|
||||
*
|
||||
* @RouteConfig([
|
||||
* new AuxRoute({path: '/home', component: HomeCmp})
|
||||
* ])
|
||||
* class MyApp {}
|
||||
* ```
|
||||
*/
|
||||
export class AuxRoute extends AbstractRoute {
|
||||
component: any;
|
||||
|
||||
constructor({name, useAsDefault, path, regex, regex_group_names, serializer, data,
|
||||
component}: RouteDefinition) {
|
||||
super({
|
||||
name: name,
|
||||
useAsDefault: useAsDefault,
|
||||
path: path,
|
||||
regex: regex,
|
||||
regex_group_names: regex_group_names,
|
||||
serializer: serializer,
|
||||
data: data
|
||||
});
|
||||
this.component = component;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* `AsyncRoute` is a type of {@link RouteDefinition} used to route a path to an asynchronously
|
||||
* loaded component.
|
||||
*
|
||||
* It has the following properties:
|
||||
* - `path` is a string that uses the route matcher DSL.
|
||||
* - `loader` is a function that returns a promise that resolves to a component.
|
||||
* - `name` is an optional `CamelCase` string representing the name of the route.
|
||||
* - `data` is an optional property of any type representing arbitrary route metadata for the given
|
||||
* route. It is injectable via {@link RouteData}.
|
||||
* - `useAsDefault` is a boolean value. If `true`, the child route will be navigated to if no child
|
||||
* route is specified during the navigation.
|
||||
*
|
||||
* ### Example
|
||||
* ```
|
||||
* import {RouteConfig, AsyncRoute} from '@angular/router-deprecated';
|
||||
*
|
||||
* @RouteConfig([
|
||||
* new AsyncRoute({path: '/home', loader: () => Promise.resolve(MyLoadedCmp), name:
|
||||
* 'MyLoadedCmp'})
|
||||
* ])
|
||||
* class MyApp {}
|
||||
* ```
|
||||
*/
|
||||
export class AsyncRoute extends AbstractRoute {
|
||||
loader: () => Promise<Type>;
|
||||
aux: string = null;
|
||||
|
||||
constructor({name, useAsDefault, path, regex, regex_group_names, serializer, data,
|
||||
loader}: RouteDefinition) {
|
||||
super({
|
||||
name: name,
|
||||
useAsDefault: useAsDefault,
|
||||
path: path,
|
||||
regex: regex,
|
||||
regex_group_names: regex_group_names,
|
||||
serializer: serializer,
|
||||
data: data
|
||||
});
|
||||
this.loader = loader;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* `Redirect` is a type of {@link RouteDefinition} used to route a path to a canonical route.
|
||||
*
|
||||
* It has the following properties:
|
||||
* - `path` is a string that uses the route matcher DSL.
|
||||
* - `redirectTo` is an array representing the link DSL.
|
||||
*
|
||||
* Note that redirects **do not** affect how links are generated. For that, see the `useAsDefault`
|
||||
* option.
|
||||
*
|
||||
* ### Example
|
||||
* ```
|
||||
* import {RouteConfig, Route, Redirect} from '@angular/router-deprecated';
|
||||
*
|
||||
* @RouteConfig([
|
||||
* new Redirect({path: '/', redirectTo: ['/Home'] }),
|
||||
* new Route({path: '/home', component: HomeCmp, name: 'Home'})
|
||||
* ])
|
||||
* class MyApp {}
|
||||
* ```
|
||||
*/
|
||||
export class Redirect extends AbstractRoute {
|
||||
redirectTo: any[];
|
||||
|
||||
constructor({name, useAsDefault, path, regex, regex_group_names, serializer, data,
|
||||
redirectTo}: RouteDefinition) {
|
||||
super({
|
||||
name: name,
|
||||
useAsDefault: useAsDefault,
|
||||
path: path,
|
||||
regex: regex,
|
||||
regex_group_names: regex_group_names,
|
||||
serializer: serializer,
|
||||
data: data
|
||||
});
|
||||
this.redirectTo = redirectTo;
|
||||
}
|
||||
}
|
|
@ -1,114 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {BaseException} from '../facade/exceptions';
|
||||
import {Type, isType} from '../facade/lang';
|
||||
import {ComponentDefinition} from '../route_definition';
|
||||
import {RouteRegistry} from '../route_registry';
|
||||
|
||||
import {AsyncRoute, AuxRoute, Redirect, Route, RouteDefinition} from './route_config_decorator';
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Given a JS Object that represents a route config, returns a corresponding Route, AsyncRoute,
|
||||
* AuxRoute or Redirect object.
|
||||
*
|
||||
* Also wraps an AsyncRoute's loader function to add the loaded component's route config to the
|
||||
* `RouteRegistry`.
|
||||
*/
|
||||
export function normalizeRouteConfig(
|
||||
config: RouteDefinition, registry: RouteRegistry): RouteDefinition {
|
||||
if (config instanceof AsyncRoute) {
|
||||
var wrappedLoader = wrapLoaderToReconfigureRegistry(config.loader, registry);
|
||||
return new AsyncRoute({
|
||||
path: config.path,
|
||||
loader: wrappedLoader,
|
||||
name: config.name,
|
||||
data: config.data,
|
||||
useAsDefault: config.useAsDefault
|
||||
});
|
||||
}
|
||||
if (config instanceof Route || config instanceof Redirect || config instanceof AuxRoute) {
|
||||
return <RouteDefinition>config;
|
||||
}
|
||||
|
||||
if ((+!!config.component) + (+!!config.redirectTo) + (+!!config.loader) != 1) {
|
||||
throw new BaseException(
|
||||
`Route config should contain exactly one "component", "loader", or "redirectTo" property.`);
|
||||
}
|
||||
|
||||
if (config.loader) {
|
||||
var wrappedLoader = wrapLoaderToReconfigureRegistry(config.loader, registry);
|
||||
return new AsyncRoute({
|
||||
path: config.path,
|
||||
loader: wrappedLoader,
|
||||
name: config.name,
|
||||
data: config.data,
|
||||
useAsDefault: config.useAsDefault
|
||||
});
|
||||
}
|
||||
if (config.aux) {
|
||||
return new AuxRoute({path: config.aux, component: <Type>config.component, name: config.name});
|
||||
}
|
||||
if (config.component) {
|
||||
if (typeof config.component == 'object') {
|
||||
let componentDefinitionObject = <ComponentDefinition>config.component;
|
||||
if (componentDefinitionObject.type == 'constructor') {
|
||||
return new Route({
|
||||
path: config.path,
|
||||
component: <Type>componentDefinitionObject.constructor,
|
||||
name: config.name,
|
||||
data: config.data,
|
||||
useAsDefault: config.useAsDefault
|
||||
});
|
||||
} else if (componentDefinitionObject.type == 'loader') {
|
||||
return new AsyncRoute({
|
||||
path: config.path,
|
||||
loader: componentDefinitionObject.loader,
|
||||
name: config.name,
|
||||
data: config.data,
|
||||
useAsDefault: config.useAsDefault
|
||||
});
|
||||
} else {
|
||||
throw new BaseException(
|
||||
`Invalid component type "${componentDefinitionObject.type}". Valid types are "constructor" and "loader".`);
|
||||
}
|
||||
}
|
||||
return new Route(<{
|
||||
path: string;
|
||||
component: Type;
|
||||
name?: string;
|
||||
data?: {[key: string]: any};
|
||||
useAsDefault?: boolean;
|
||||
}>config);
|
||||
}
|
||||
|
||||
if (config.redirectTo) {
|
||||
return new Redirect({path: config.path, redirectTo: config.redirectTo});
|
||||
}
|
||||
|
||||
return config;
|
||||
}
|
||||
|
||||
|
||||
function wrapLoaderToReconfigureRegistry(loader: Function, registry: RouteRegistry): () =>
|
||||
Promise<Type> {
|
||||
return () => {
|
||||
return loader().then((componentType: any /** TODO #9100 */) => {
|
||||
registry.configFromComponent(componentType);
|
||||
return componentType;
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export function assertComponentExists(component: Type, path: string): void {
|
||||
if (!isType(component)) {
|
||||
throw new BaseException(`Component for route "${path}" is not defined, or is not a class.`);
|
||||
}
|
||||
}
|
|
@ -1,47 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Type} from '../src/facade/lang';
|
||||
import {RegexSerializer} from './rules/route_paths/regex_route_path';
|
||||
|
||||
/**
|
||||
* `RouteDefinition` defines a route within a {@link RouteConfig} decorator.
|
||||
*
|
||||
* Supported keys:
|
||||
* - `path` or `aux` (requires exactly one of these)
|
||||
* - `component`, `loader`, `redirectTo` (requires exactly one of these)
|
||||
* - `name` (optional)
|
||||
* - `data` (optional)
|
||||
*
|
||||
* See also {@link Route}, {@link AsyncRoute}, {@link AuxRoute}, and {@link Redirect}.
|
||||
*/
|
||||
export interface RouteDefinition {
|
||||
path?: string;
|
||||
aux?: string;
|
||||
regex?: string;
|
||||
regex_group_names?: string[];
|
||||
serializer?: RegexSerializer;
|
||||
component?: Type|ComponentDefinition;
|
||||
loader?: () => Promise<Type>;
|
||||
redirectTo?: any[];
|
||||
name?: string;
|
||||
data?: any;
|
||||
useAsDefault?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* Represents either a component type (`type` is `component`) or a loader function
|
||||
* (`type` is `loader`).
|
||||
*
|
||||
* See also {@link RouteDefinition}.
|
||||
*/
|
||||
export interface ComponentDefinition {
|
||||
type: string;
|
||||
loader?: () => Promise<Type>;
|
||||
component?: Type;
|
||||
}
|
|
@ -1,541 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Inject, Injectable, OpaqueToken} from '@angular/core';
|
||||
|
||||
import {reflector} from '../core_private';
|
||||
import {ListWrapper, Map, StringMapWrapper} from '../src/facade/collection';
|
||||
import {BaseException} from '../src/facade/exceptions';
|
||||
import {Math, StringWrapper, Type, getTypeNameForDebugging, isArray, isBlank, isPresent, isString, isStringMap, isType} from '../src/facade/lang';
|
||||
|
||||
import {DefaultInstruction, Instruction, RedirectInstruction, ResolvedInstruction, UnresolvedInstruction} from './instruction';
|
||||
import {AuxRoute, Route, RouteConfig, RouteDefinition} from './route_config/route_config_impl';
|
||||
import {assertComponentExists, normalizeRouteConfig} from './route_config/route_config_normalizer';
|
||||
import {GeneratedUrl} from './rules/route_paths/route_path';
|
||||
import {RuleSet} from './rules/rule_set';
|
||||
import {PathMatch, RedirectMatch, RouteMatch} from './rules/rules';
|
||||
import {Url, convertUrlParamsToArray, parser} from './url_parser';
|
||||
|
||||
var _resolveToNull = Promise.resolve(null);
|
||||
|
||||
// A LinkItemArray is an array, which describes a set of routes
|
||||
// The items in the array are found in groups:
|
||||
// - the first item is the name of the route
|
||||
// - the next items are:
|
||||
// - an object containing parameters
|
||||
// - or an array describing an aux route
|
||||
// export type LinkRouteItem = string | Object;
|
||||
// export type LinkItem = LinkRouteItem | Array<LinkRouteItem>;
|
||||
// export type LinkItemArray = Array<LinkItem>;
|
||||
|
||||
/**
|
||||
* Token used to bind the component with the top-level {@link RouteConfig}s for the
|
||||
* application.
|
||||
*
|
||||
* ### Example ([live demo](http://plnkr.co/edit/iRUP8B5OUbxCWQ3AcIDm))
|
||||
*
|
||||
* ```
|
||||
* import {Component} from '@angular/core';
|
||||
* import {
|
||||
* ROUTER_DIRECTIVES,
|
||||
* ROUTER_PROVIDERS,
|
||||
* RouteConfig
|
||||
* } from '@angular/router-deprecated';
|
||||
*
|
||||
* @Component({directives: [ROUTER_DIRECTIVES]})
|
||||
* @RouteConfig([
|
||||
* {...},
|
||||
* ])
|
||||
* class AppCmp {
|
||||
* // ...
|
||||
* }
|
||||
*
|
||||
* bootstrap(AppCmp, [ROUTER_PROVIDERS]);
|
||||
* ```
|
||||
*/
|
||||
export const ROUTER_PRIMARY_COMPONENT: OpaqueToken = new OpaqueToken('RouterPrimaryComponent');
|
||||
|
||||
|
||||
/**
|
||||
* The RouteRegistry holds route configurations for each component in an Angular app.
|
||||
* It is responsible for creating Instructions from URLs, and generating URLs based on route and
|
||||
* parameters.
|
||||
*/
|
||||
@Injectable()
|
||||
export class RouteRegistry {
|
||||
private _rules = new Map<any, RuleSet>();
|
||||
|
||||
constructor(@Inject(ROUTER_PRIMARY_COMPONENT) private _rootComponent: Type) {}
|
||||
|
||||
/**
|
||||
* Given a component and a configuration object, add the route to this registry
|
||||
*/
|
||||
config(parentComponent: any, config: RouteDefinition): void {
|
||||
config = normalizeRouteConfig(config, this);
|
||||
|
||||
// this is here because Dart type guard reasons
|
||||
if (config instanceof Route) {
|
||||
assertComponentExists(config.component, config.path);
|
||||
} else if (config instanceof AuxRoute) {
|
||||
assertComponentExists(config.component, config.path);
|
||||
}
|
||||
|
||||
var rules = this._rules.get(parentComponent);
|
||||
|
||||
if (isBlank(rules)) {
|
||||
rules = new RuleSet();
|
||||
this._rules.set(parentComponent, rules);
|
||||
}
|
||||
|
||||
var terminal = rules.config(config);
|
||||
|
||||
if (config instanceof Route) {
|
||||
if (terminal) {
|
||||
assertTerminalComponent(config.component, config.path);
|
||||
} else {
|
||||
this.configFromComponent(config.component);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Reads the annotations of a component and configures the registry based on them
|
||||
*/
|
||||
configFromComponent(component: any): void {
|
||||
if (!isType(component)) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Don't read the annotations from a type more than once –
|
||||
// this prevents an infinite loop if a component routes recursively.
|
||||
if (this._rules.has(component)) {
|
||||
return;
|
||||
}
|
||||
var annotations = reflector.annotations(component);
|
||||
if (isPresent(annotations)) {
|
||||
for (var i = 0; i < annotations.length; i++) {
|
||||
var annotation = annotations[i];
|
||||
|
||||
if (annotation instanceof RouteConfig) {
|
||||
let routeCfgs: RouteDefinition[] = annotation.configs;
|
||||
routeCfgs.forEach(config => this.config(component, config));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Given a URL and a parent component, return the most specific instruction for navigating
|
||||
* the application into the state specified by the url
|
||||
*/
|
||||
recognize(url: string, ancestorInstructions: Instruction[]): Promise<Instruction> {
|
||||
var parsedUrl = parser.parse(url);
|
||||
return this._recognize(parsedUrl, []);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Recognizes all parent-child routes, but creates unresolved auxiliary routes
|
||||
*/
|
||||
private _recognize(parsedUrl: Url, ancestorInstructions: Instruction[], _aux = false):
|
||||
Promise<Instruction> {
|
||||
var parentInstruction = ListWrapper.last(ancestorInstructions);
|
||||
var parentComponent = isPresent(parentInstruction) ? parentInstruction.component.componentType :
|
||||
this._rootComponent;
|
||||
|
||||
var rules = this._rules.get(parentComponent);
|
||||
if (isBlank(rules)) {
|
||||
return _resolveToNull;
|
||||
}
|
||||
|
||||
// Matches some beginning part of the given URL
|
||||
var possibleMatches: Promise<RouteMatch>[] =
|
||||
_aux ? rules.recognizeAuxiliary(parsedUrl) : rules.recognize(parsedUrl);
|
||||
|
||||
var matchPromises: Promise<Instruction>[] = possibleMatches.map(
|
||||
(candidate: Promise<RouteMatch>) => candidate.then((candidate: RouteMatch) => {
|
||||
|
||||
if (candidate instanceof PathMatch) {
|
||||
var auxParentInstructions: Instruction[] =
|
||||
ancestorInstructions.length > 0 ? [ListWrapper.last(ancestorInstructions)] : [];
|
||||
var auxInstructions =
|
||||
this._auxRoutesToUnresolved(candidate.remainingAux, auxParentInstructions);
|
||||
|
||||
var instruction = new ResolvedInstruction(candidate.instruction, null, auxInstructions);
|
||||
|
||||
if (isBlank(candidate.instruction) || candidate.instruction.terminal) {
|
||||
return instruction;
|
||||
}
|
||||
|
||||
var newAncestorInstructions: Instruction[] = ancestorInstructions.concat([instruction]);
|
||||
|
||||
return this._recognize(candidate.remaining, newAncestorInstructions)
|
||||
.then((childInstruction) => {
|
||||
if (isBlank(childInstruction)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// redirect instructions are already absolute
|
||||
if (childInstruction instanceof RedirectInstruction) {
|
||||
return childInstruction;
|
||||
}
|
||||
instruction.child = childInstruction;
|
||||
return instruction;
|
||||
});
|
||||
}
|
||||
|
||||
if (candidate instanceof RedirectMatch) {
|
||||
var instruction =
|
||||
this.generate(candidate.redirectTo, ancestorInstructions.concat([null]));
|
||||
return new RedirectInstruction(
|
||||
instruction.component, instruction.child, instruction.auxInstruction,
|
||||
candidate.specificity);
|
||||
}
|
||||
}));
|
||||
|
||||
if ((isBlank(parsedUrl) || parsedUrl.path == '') && possibleMatches.length == 0) {
|
||||
return Promise.resolve(this.generateDefault(parentComponent));
|
||||
}
|
||||
|
||||
return Promise.all<Instruction>(matchPromises).then(mostSpecific);
|
||||
}
|
||||
|
||||
private _auxRoutesToUnresolved(auxRoutes: Url[], parentInstructions: Instruction[]):
|
||||
{[key: string]: Instruction} {
|
||||
var unresolvedAuxInstructions: {[key: string]: Instruction} = {};
|
||||
|
||||
auxRoutes.forEach((auxUrl: Url) => {
|
||||
unresolvedAuxInstructions[auxUrl.path] = new UnresolvedInstruction(
|
||||
() => { return this._recognize(auxUrl, parentInstructions, true); });
|
||||
});
|
||||
|
||||
return unresolvedAuxInstructions;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Given a normalized list with component names and params like: `['user', {id: 3 }]`
|
||||
* generates a url with a leading slash relative to the provided `parentComponent`.
|
||||
*
|
||||
* If the optional param `_aux` is `true`, then we generate starting at an auxiliary
|
||||
* route boundary.
|
||||
*/
|
||||
generate(linkParams: any[], ancestorInstructions: Instruction[], _aux = false): Instruction {
|
||||
var params = splitAndFlattenLinkParams(linkParams);
|
||||
var prevInstruction: any /** TODO #9100 */;
|
||||
|
||||
// The first segment should be either '.' (generate from parent) or '' (generate from root).
|
||||
// When we normalize above, we strip all the slashes, './' becomes '.' and '/' becomes ''.
|
||||
if (ListWrapper.first(params) == '') {
|
||||
params.shift();
|
||||
prevInstruction = ListWrapper.first(ancestorInstructions);
|
||||
ancestorInstructions = [];
|
||||
} else {
|
||||
prevInstruction = ancestorInstructions.length > 0 ? ancestorInstructions.pop() : null;
|
||||
|
||||
if (ListWrapper.first(params) == '.') {
|
||||
params.shift();
|
||||
} else if (ListWrapper.first(params) == '..') {
|
||||
while (ListWrapper.first(params) == '..') {
|
||||
if (ancestorInstructions.length <= 0) {
|
||||
throw new BaseException(
|
||||
`Link "${ListWrapper.toJSON(linkParams)}" has too many "../" segments.`);
|
||||
}
|
||||
prevInstruction = ancestorInstructions.pop();
|
||||
params = ListWrapper.slice(params, 1);
|
||||
}
|
||||
|
||||
// we're on to implicit child/sibling route
|
||||
} else {
|
||||
// we must only peak at the link param, and not consume it
|
||||
let routeName = ListWrapper.first(params);
|
||||
let parentComponentType = this._rootComponent;
|
||||
let grandparentComponentType: any /** TODO #9100 */ = null;
|
||||
|
||||
if (ancestorInstructions.length > 1) {
|
||||
let parentComponentInstruction = ancestorInstructions[ancestorInstructions.length - 1];
|
||||
let grandComponentInstruction = ancestorInstructions[ancestorInstructions.length - 2];
|
||||
|
||||
parentComponentType = parentComponentInstruction.component.componentType;
|
||||
grandparentComponentType = grandComponentInstruction.component.componentType;
|
||||
} else if (ancestorInstructions.length == 1) {
|
||||
parentComponentType = ancestorInstructions[0].component.componentType;
|
||||
grandparentComponentType = this._rootComponent;
|
||||
}
|
||||
|
||||
// For a link with no leading `./`, `/`, or `../`, we look for a sibling and child.
|
||||
// If both exist, we throw. Otherwise, we prefer whichever exists.
|
||||
var childRouteExists = this.hasRoute(routeName, parentComponentType);
|
||||
var parentRouteExists = isPresent(grandparentComponentType) &&
|
||||
this.hasRoute(routeName, grandparentComponentType);
|
||||
|
||||
if (parentRouteExists && childRouteExists) {
|
||||
let msg =
|
||||
`Link "${ListWrapper.toJSON(linkParams)}" is ambiguous, use "./" or "../" to disambiguate.`;
|
||||
throw new BaseException(msg);
|
||||
}
|
||||
|
||||
if (parentRouteExists) {
|
||||
prevInstruction = ancestorInstructions.pop();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (params[params.length - 1] == '') {
|
||||
params.pop();
|
||||
}
|
||||
|
||||
if (params.length > 0 && params[0] == '') {
|
||||
params.shift();
|
||||
}
|
||||
|
||||
if (params.length < 1) {
|
||||
let msg = `Link "${ListWrapper.toJSON(linkParams)}" must include a route name.`;
|
||||
throw new BaseException(msg);
|
||||
}
|
||||
|
||||
var generatedInstruction =
|
||||
this._generate(params, ancestorInstructions, prevInstruction, _aux, linkParams);
|
||||
|
||||
// we don't clone the first (root) element
|
||||
for (var i = ancestorInstructions.length - 1; i >= 0; i--) {
|
||||
let ancestorInstruction = ancestorInstructions[i];
|
||||
if (isBlank(ancestorInstruction)) {
|
||||
break;
|
||||
}
|
||||
generatedInstruction = ancestorInstruction.replaceChild(generatedInstruction);
|
||||
}
|
||||
|
||||
return generatedInstruction;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Internal helper that does not make any assertions about the beginning of the link DSL.
|
||||
* `ancestorInstructions` are parents that will be cloned.
|
||||
* `prevInstruction` is the existing instruction that would be replaced, but which might have
|
||||
* aux routes that need to be cloned.
|
||||
*/
|
||||
private _generate(
|
||||
linkParams: any[], ancestorInstructions: Instruction[], prevInstruction: Instruction,
|
||||
_aux = false, _originalLink: any[]): Instruction {
|
||||
let parentComponentType = this._rootComponent;
|
||||
let componentInstruction: any /** TODO #9100 */ = null;
|
||||
let auxInstructions: {[key: string]: Instruction} = {};
|
||||
|
||||
let parentInstruction: Instruction = ListWrapper.last(ancestorInstructions);
|
||||
if (isPresent(parentInstruction) && isPresent(parentInstruction.component)) {
|
||||
parentComponentType = parentInstruction.component.componentType;
|
||||
}
|
||||
|
||||
if (linkParams.length == 0) {
|
||||
let defaultInstruction = this.generateDefault(parentComponentType);
|
||||
if (isBlank(defaultInstruction)) {
|
||||
throw new BaseException(
|
||||
`Link "${ListWrapper.toJSON(_originalLink)}" does not resolve to a terminal instruction.`);
|
||||
}
|
||||
return defaultInstruction;
|
||||
}
|
||||
|
||||
// for non-aux routes, we want to reuse the predecessor's existing primary and aux routes
|
||||
// and only override routes for which the given link DSL provides
|
||||
if (isPresent(prevInstruction) && !_aux) {
|
||||
auxInstructions = StringMapWrapper.merge(prevInstruction.auxInstruction, auxInstructions);
|
||||
componentInstruction = prevInstruction.component;
|
||||
}
|
||||
|
||||
var rules = this._rules.get(parentComponentType);
|
||||
if (isBlank(rules)) {
|
||||
throw new BaseException(
|
||||
`Component "${getTypeNameForDebugging(parentComponentType)}" has no route config.`);
|
||||
}
|
||||
|
||||
let linkParamIndex = 0;
|
||||
let routeParams: {[key: string]: any} = {};
|
||||
|
||||
// first, recognize the primary route if one is provided
|
||||
if (linkParamIndex < linkParams.length && isString(linkParams[linkParamIndex])) {
|
||||
let routeName = linkParams[linkParamIndex];
|
||||
if (routeName == '' || routeName == '.' || routeName == '..') {
|
||||
throw new BaseException(`"${routeName}/" is only allowed at the beginning of a link DSL.`);
|
||||
}
|
||||
linkParamIndex += 1;
|
||||
if (linkParamIndex < linkParams.length) {
|
||||
let linkParam = linkParams[linkParamIndex];
|
||||
if (isStringMap(linkParam) && !isArray(linkParam)) {
|
||||
routeParams = linkParam;
|
||||
linkParamIndex += 1;
|
||||
}
|
||||
}
|
||||
var routeRecognizer = (_aux ? rules.auxRulesByName : rules.rulesByName).get(routeName);
|
||||
|
||||
if (isBlank(routeRecognizer)) {
|
||||
throw new BaseException(
|
||||
`Component "${getTypeNameForDebugging(parentComponentType)}" has no route named "${routeName}".`);
|
||||
}
|
||||
|
||||
// Create an "unresolved instruction" for async routes
|
||||
// we'll figure out the rest of the route when we resolve the instruction and
|
||||
// perform a navigation
|
||||
if (isBlank(routeRecognizer.handler.componentType)) {
|
||||
var generatedUrl: GeneratedUrl = routeRecognizer.generateComponentPathValues(routeParams);
|
||||
return new UnresolvedInstruction(() => {
|
||||
return routeRecognizer.handler.resolveComponentType().then((_) => {
|
||||
return this._generate(
|
||||
linkParams, ancestorInstructions, prevInstruction, _aux, _originalLink);
|
||||
});
|
||||
}, generatedUrl.urlPath, convertUrlParamsToArray(generatedUrl.urlParams));
|
||||
}
|
||||
|
||||
componentInstruction = _aux ? rules.generateAuxiliary(routeName, routeParams) :
|
||||
rules.generate(routeName, routeParams);
|
||||
}
|
||||
|
||||
// Next, recognize auxiliary instructions.
|
||||
// If we have an ancestor instruction, we preserve whatever aux routes are active from it.
|
||||
while (linkParamIndex < linkParams.length && isArray(linkParams[linkParamIndex])) {
|
||||
let auxParentInstruction: Instruction[] = [parentInstruction];
|
||||
let auxInstruction = this._generate(
|
||||
linkParams[linkParamIndex], auxParentInstruction, null, true, _originalLink);
|
||||
|
||||
// TODO: this will not work for aux routes with parameters or multiple segments
|
||||
auxInstructions[auxInstruction.component.urlPath] = auxInstruction;
|
||||
linkParamIndex += 1;
|
||||
}
|
||||
|
||||
var instruction = new ResolvedInstruction(componentInstruction, null, auxInstructions);
|
||||
|
||||
// If the component is sync, we can generate resolved child route instructions
|
||||
// If not, we'll resolve the instructions at navigation time
|
||||
if (isPresent(componentInstruction) && isPresent(componentInstruction.componentType)) {
|
||||
let childInstruction: Instruction = null;
|
||||
if (componentInstruction.terminal) {
|
||||
if (linkParamIndex >= linkParams.length) {
|
||||
// TODO: throw that there are extra link params beyond the terminal component
|
||||
}
|
||||
} else {
|
||||
let childAncestorComponents: Instruction[] = ancestorInstructions.concat([instruction]);
|
||||
let remainingLinkParams = linkParams.slice(linkParamIndex);
|
||||
childInstruction = this._generate(
|
||||
remainingLinkParams, childAncestorComponents, null, false, _originalLink);
|
||||
}
|
||||
instruction.child = childInstruction;
|
||||
}
|
||||
|
||||
return instruction;
|
||||
}
|
||||
|
||||
public hasRoute(name: string, parentComponent: any): boolean {
|
||||
var rules = this._rules.get(parentComponent);
|
||||
if (isBlank(rules)) {
|
||||
return false;
|
||||
}
|
||||
return rules.hasRoute(name);
|
||||
}
|
||||
|
||||
public generateDefault(componentCursor: Type): Instruction {
|
||||
if (isBlank(componentCursor)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var rules = this._rules.get(componentCursor);
|
||||
if (isBlank(rules) || isBlank(rules.defaultRule)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var defaultChild: any /** TODO #9100 */ = null;
|
||||
if (isPresent(rules.defaultRule.handler.componentType)) {
|
||||
var componentInstruction = rules.defaultRule.generate({});
|
||||
if (!rules.defaultRule.terminal) {
|
||||
defaultChild = this.generateDefault(rules.defaultRule.handler.componentType);
|
||||
}
|
||||
return new DefaultInstruction(componentInstruction, defaultChild);
|
||||
}
|
||||
|
||||
return new UnresolvedInstruction(() => {
|
||||
return rules.defaultRule.handler.resolveComponentType().then(
|
||||
(_) => this.generateDefault(componentCursor));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Given: ['/a/b', {c: 2}]
|
||||
* Returns: ['', 'a', 'b', {c: 2}]
|
||||
*/
|
||||
function splitAndFlattenLinkParams(linkParams: any[]): any[] {
|
||||
var accumulation: any[] /** TODO #9100 */ = [];
|
||||
linkParams.forEach(function(item: any) {
|
||||
if (isString(item)) {
|
||||
var strItem: string = <string>item;
|
||||
accumulation = accumulation.concat(strItem.split('/'));
|
||||
} else {
|
||||
accumulation.push(item);
|
||||
}
|
||||
});
|
||||
return accumulation;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Given a list of instructions, returns the most specific instruction
|
||||
*/
|
||||
function mostSpecific(instructions: Instruction[]): Instruction {
|
||||
instructions = instructions.filter((instruction) => isPresent(instruction));
|
||||
if (instructions.length == 0) {
|
||||
return null;
|
||||
}
|
||||
if (instructions.length == 1) {
|
||||
return instructions[0];
|
||||
}
|
||||
var first = instructions[0];
|
||||
var rest = instructions.slice(1);
|
||||
return rest.reduce((instruction: Instruction, contender: Instruction) => {
|
||||
if (compareSpecificityStrings(contender.specificity, instruction.specificity) == -1) {
|
||||
return contender;
|
||||
}
|
||||
return instruction;
|
||||
}, first);
|
||||
}
|
||||
|
||||
/*
|
||||
* Expects strings to be in the form of "[0-2]+"
|
||||
* Returns -1 if string A should be sorted above string B, 1 if it should be sorted after,
|
||||
* or 0 if they are the same.
|
||||
*/
|
||||
function compareSpecificityStrings(a: string, b: string): number {
|
||||
var l = Math.min(a.length, b.length);
|
||||
for (var i = 0; i < l; i += 1) {
|
||||
var ai = StringWrapper.charCodeAt(a, i);
|
||||
var bi = StringWrapper.charCodeAt(b, i);
|
||||
var difference = bi - ai;
|
||||
if (difference != 0) {
|
||||
return difference;
|
||||
}
|
||||
}
|
||||
return a.length - b.length;
|
||||
}
|
||||
|
||||
function assertTerminalComponent(component: any /** TODO #9100 */, path: any /** TODO #9100 */) {
|
||||
if (!isType(component)) {
|
||||
return;
|
||||
}
|
||||
|
||||
var annotations = reflector.annotations(component);
|
||||
if (isPresent(annotations)) {
|
||||
for (var i = 0; i < annotations.length; i++) {
|
||||
var annotation = annotations[i];
|
||||
|
||||
if (annotation instanceof RouteConfig) {
|
||||
throw new BaseException(
|
||||
`Child routes are not allowed for "${path}". Use "..." on the parent's route path.`);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,603 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {Inject, Injectable} from '@angular/core';
|
||||
|
||||
import {EventEmitter} from '../src/facade/async';
|
||||
import {Map, StringMapWrapper} from '../src/facade/collection';
|
||||
import {BaseException} from '../src/facade/exceptions';
|
||||
import {Type, isBlank, isPresent} from '../src/facade/lang';
|
||||
|
||||
import {RouterOutlet} from './directives/router_outlet';
|
||||
import {ComponentInstruction, DefaultInstruction, Instruction} from './instruction';
|
||||
import {getCanActivateHook} from './lifecycle/route_lifecycle_reflector';
|
||||
import {RouteDefinition} from './route_config/route_config_impl';
|
||||
import {ROUTER_PRIMARY_COMPONENT, RouteRegistry} from './route_registry';
|
||||
|
||||
let _resolveToTrue = Promise.resolve(true);
|
||||
let _resolveToFalse = Promise.resolve(false);
|
||||
|
||||
/**
|
||||
* The `Router` is responsible for mapping URLs to components.
|
||||
*
|
||||
* You can see the state of the router by inspecting the read-only field `router.navigating`.
|
||||
* This may be useful for showing a spinner, for instance.
|
||||
*
|
||||
* ## Concepts
|
||||
*
|
||||
* Routers and component instances have a 1:1 correspondence.
|
||||
*
|
||||
* The router holds reference to a number of {@link RouterOutlet}.
|
||||
* An outlet is a placeholder that the router dynamically fills in depending on the current URL.
|
||||
*
|
||||
* When the router navigates from a URL, it must first recognize it and serialize it into an
|
||||
* `Instruction`.
|
||||
* The router uses the `RouteRegistry` to get an `Instruction`.
|
||||
*/
|
||||
@Injectable()
|
||||
export class Router {
|
||||
navigating: boolean = false;
|
||||
lastNavigationAttempt: string;
|
||||
/**
|
||||
* The current `Instruction` for the router
|
||||
*/
|
||||
public currentInstruction: Instruction = null;
|
||||
|
||||
private _currentNavigation: Promise<any> = _resolveToTrue;
|
||||
private _outlet: RouterOutlet = null;
|
||||
|
||||
private _auxRouters = new Map<string, Router>();
|
||||
private _childRouter: Router;
|
||||
|
||||
private _subject: EventEmitter<any> = new EventEmitter();
|
||||
|
||||
|
||||
constructor(
|
||||
public registry: RouteRegistry, public parent: Router, public hostComponent: any,
|
||||
public root?: Router) {}
|
||||
|
||||
/**
|
||||
* Constructs a child router. You probably don't need to use this unless you're writing a reusable
|
||||
* component.
|
||||
*/
|
||||
childRouter(hostComponent: any): Router {
|
||||
return this._childRouter = new ChildRouter(this, hostComponent);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Constructs a child router. You probably don't need to use this unless you're writing a reusable
|
||||
* component.
|
||||
*/
|
||||
auxRouter(hostComponent: any): Router { return new ChildRouter(this, hostComponent); }
|
||||
|
||||
/**
|
||||
* Register an outlet to be notified of primary route changes.
|
||||
*
|
||||
* You probably don't need to use this unless you're writing a reusable component.
|
||||
*/
|
||||
registerPrimaryOutlet(outlet: RouterOutlet): Promise<any> {
|
||||
if (isPresent(outlet.name)) {
|
||||
throw new BaseException(`registerPrimaryOutlet expects to be called with an unnamed outlet.`);
|
||||
}
|
||||
|
||||
if (isPresent(this._outlet)) {
|
||||
throw new BaseException(`Primary outlet is already registered.`);
|
||||
}
|
||||
|
||||
this._outlet = outlet;
|
||||
if (isPresent(this.currentInstruction)) {
|
||||
return this.commit(this.currentInstruction, false);
|
||||
}
|
||||
return _resolveToTrue;
|
||||
}
|
||||
|
||||
/**
|
||||
* Unregister an outlet (because it was destroyed, etc).
|
||||
*
|
||||
* You probably don't need to use this unless you're writing a custom outlet implementation.
|
||||
*/
|
||||
unregisterPrimaryOutlet(outlet: RouterOutlet): void {
|
||||
if (isPresent(outlet.name)) {
|
||||
throw new BaseException(`registerPrimaryOutlet expects to be called with an unnamed outlet.`);
|
||||
}
|
||||
this._outlet = null;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Register an outlet to notified of auxiliary route changes.
|
||||
*
|
||||
* You probably don't need to use this unless you're writing a reusable component.
|
||||
*/
|
||||
registerAuxOutlet(outlet: RouterOutlet): Promise<any> {
|
||||
var outletName = outlet.name;
|
||||
if (isBlank(outletName)) {
|
||||
throw new BaseException(`registerAuxOutlet expects to be called with an outlet with a name.`);
|
||||
}
|
||||
|
||||
var router = this.auxRouter(this.hostComponent);
|
||||
|
||||
this._auxRouters.set(outletName, router);
|
||||
router._outlet = outlet;
|
||||
|
||||
var auxInstruction: any /** TODO #9100 */;
|
||||
if (isPresent(this.currentInstruction) &&
|
||||
isPresent(auxInstruction = this.currentInstruction.auxInstruction[outletName])) {
|
||||
return router.commit(auxInstruction);
|
||||
}
|
||||
return _resolveToTrue;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Given an instruction, returns `true` if the instruction is currently active,
|
||||
* otherwise `false`.
|
||||
*/
|
||||
isRouteActive(instruction: Instruction): boolean {
|
||||
var router: Router = this;
|
||||
var currentInstruction = this.currentInstruction;
|
||||
|
||||
if (isBlank(currentInstruction)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// `instruction` corresponds to the root router
|
||||
while (isPresent(router.parent) && isPresent(instruction.child)) {
|
||||
router = router.parent;
|
||||
instruction = instruction.child;
|
||||
}
|
||||
|
||||
let reason = true;
|
||||
|
||||
// check the instructions in depth
|
||||
do {
|
||||
if (isBlank(instruction.component) || isBlank(currentInstruction.component) ||
|
||||
currentInstruction.component.routeName != instruction.component.routeName) {
|
||||
return false;
|
||||
}
|
||||
if (isPresent(instruction.component.params)) {
|
||||
StringMapWrapper.forEach(
|
||||
instruction.component.params,
|
||||
(value: any /** TODO #9100 */, key: any /** TODO #9100 */) => {
|
||||
if (currentInstruction.component.params[key] !== value) {
|
||||
reason = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
currentInstruction = currentInstruction.child;
|
||||
instruction = instruction.child;
|
||||
} while (isPresent(currentInstruction) && isPresent(instruction) &&
|
||||
!(instruction instanceof DefaultInstruction) && reason);
|
||||
|
||||
// ignore DefaultInstruction
|
||||
return reason && (isBlank(instruction) || instruction instanceof DefaultInstruction);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Dynamically update the routing configuration and trigger a navigation.
|
||||
*
|
||||
* ### Usage
|
||||
*
|
||||
* ```
|
||||
* router.config([
|
||||
* { 'path': '/', 'component': IndexComp },
|
||||
* { 'path': '/user/:id', 'component': UserComp },
|
||||
* ]);
|
||||
* ```
|
||||
*/
|
||||
config(definitions: RouteDefinition[]): Promise<any> {
|
||||
definitions.forEach(
|
||||
(routeDefinition) => { this.registry.config(this.hostComponent, routeDefinition); });
|
||||
return this.renavigate();
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Navigate based on the provided Route Link DSL. It's preferred to navigate with this method
|
||||
* over `navigateByUrl`.
|
||||
*
|
||||
* ### Usage
|
||||
*
|
||||
* This method takes an array representing the Route Link DSL:
|
||||
* ```
|
||||
* ['./MyCmp', {param: 3}]
|
||||
* ```
|
||||
* See the {@link RouterLink} directive for more.
|
||||
*/
|
||||
navigate(linkParams: any[]): Promise<any> {
|
||||
var instruction = this.generate(linkParams);
|
||||
return this.navigateByInstruction(instruction, false);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Navigate to a URL. Returns a promise that resolves when navigation is complete.
|
||||
* It's preferred to navigate with `navigate` instead of this method, since URLs are more brittle.
|
||||
*
|
||||
* If the given URL begins with a `/`, router will navigate absolutely.
|
||||
* If the given URL does not begin with `/`, the router will navigate relative to this component.
|
||||
*/
|
||||
navigateByUrl(url: string, _skipLocationChange: boolean = false): Promise<any> {
|
||||
return this._currentNavigation = this._currentNavigation.then((_) => {
|
||||
this.lastNavigationAttempt = url;
|
||||
this._startNavigating();
|
||||
return this._afterPromiseFinishNavigating(this.recognize(url).then((instruction) => {
|
||||
if (isBlank(instruction)) {
|
||||
return false;
|
||||
}
|
||||
return this._navigate(instruction, _skipLocationChange);
|
||||
}));
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Navigate via the provided instruction. Returns a promise that resolves when navigation is
|
||||
* complete.
|
||||
*/
|
||||
navigateByInstruction(instruction: Instruction, _skipLocationChange: boolean = false):
|
||||
Promise<any> {
|
||||
if (isBlank(instruction)) {
|
||||
return _resolveToFalse;
|
||||
}
|
||||
return this._currentNavigation = this._currentNavigation.then((_) => {
|
||||
this._startNavigating();
|
||||
return this._afterPromiseFinishNavigating(this._navigate(instruction, _skipLocationChange));
|
||||
});
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_settleInstruction(instruction: Instruction): Promise<any> {
|
||||
return instruction.resolveComponent().then((_) => {
|
||||
var unsettledInstructions: Array<Promise<any>> = [];
|
||||
|
||||
if (isPresent(instruction.component)) {
|
||||
instruction.component.reuse = false;
|
||||
}
|
||||
|
||||
if (isPresent(instruction.child)) {
|
||||
unsettledInstructions.push(this._settleInstruction(instruction.child));
|
||||
}
|
||||
|
||||
StringMapWrapper.forEach(
|
||||
instruction.auxInstruction, (instruction: Instruction, _: any /** TODO #9100 */) => {
|
||||
unsettledInstructions.push(this._settleInstruction(instruction));
|
||||
});
|
||||
return Promise.all(unsettledInstructions);
|
||||
});
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_navigate(instruction: Instruction, _skipLocationChange: boolean): Promise<any> {
|
||||
return this._settleInstruction(instruction)
|
||||
.then((_) => this._routerCanReuse(instruction))
|
||||
.then((_) => this._canActivate(instruction))
|
||||
.then((result: boolean) => {
|
||||
if (!result) {
|
||||
return false;
|
||||
}
|
||||
return this._routerCanDeactivate(instruction).then((result: boolean) => {
|
||||
if (result) {
|
||||
return this.commit(instruction, _skipLocationChange).then((_) => {
|
||||
this._emitNavigationFinish(instruction.component);
|
||||
return true;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
private _emitNavigationFinish(instruction: ComponentInstruction): void {
|
||||
this._subject.emit({status: 'success', instruction});
|
||||
}
|
||||
/** @internal */
|
||||
_emitNavigationFail(url: string): void { this._subject.emit({status: 'fail', url}); }
|
||||
|
||||
private _afterPromiseFinishNavigating(promise: Promise<any>): Promise<any> {
|
||||
return promise.then(() => this._finishNavigating()).catch((err) => {
|
||||
this._finishNavigating();
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
/*
|
||||
* Recursively set reuse flags
|
||||
*/
|
||||
/** @internal */
|
||||
_routerCanReuse(instruction: Instruction): Promise<any> {
|
||||
if (isBlank(this._outlet)) {
|
||||
return _resolveToFalse;
|
||||
}
|
||||
if (isBlank(instruction.component)) {
|
||||
return _resolveToTrue;
|
||||
}
|
||||
return this._outlet.routerCanReuse(instruction.component).then((result) => {
|
||||
instruction.component.reuse = result;
|
||||
if (result && isPresent(this._childRouter) && isPresent(instruction.child)) {
|
||||
return this._childRouter._routerCanReuse(instruction.child);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private _canActivate(nextInstruction: Instruction): Promise<boolean> {
|
||||
return canActivateOne(nextInstruction, this.currentInstruction);
|
||||
}
|
||||
|
||||
private _routerCanDeactivate(instruction: Instruction): Promise<boolean> {
|
||||
if (isBlank(this._outlet)) {
|
||||
return _resolveToTrue;
|
||||
}
|
||||
var next: Promise<boolean>;
|
||||
var childInstruction: Instruction = null;
|
||||
var reuse: boolean = false;
|
||||
var componentInstruction: ComponentInstruction = null;
|
||||
if (isPresent(instruction)) {
|
||||
childInstruction = instruction.child;
|
||||
componentInstruction = instruction.component;
|
||||
reuse = isBlank(instruction.component) || instruction.component.reuse;
|
||||
}
|
||||
if (reuse) {
|
||||
next = _resolveToTrue;
|
||||
} else {
|
||||
next = this._outlet.routerCanDeactivate(componentInstruction);
|
||||
}
|
||||
// TODO: aux route lifecycle hooks
|
||||
return next.then<boolean>((result): boolean | Promise<boolean> => {
|
||||
if (result == false) {
|
||||
return false;
|
||||
}
|
||||
if (isPresent(this._childRouter)) {
|
||||
// TODO: ideally, this closure would map to async-await in Dart.
|
||||
// For now, casting to any to suppress an error.
|
||||
return <any>this._childRouter._routerCanDeactivate(childInstruction);
|
||||
}
|
||||
return true;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates this router and all descendant routers according to the given instruction
|
||||
*/
|
||||
commit(instruction: Instruction, _skipLocationChange: boolean = false): Promise<any> {
|
||||
this.currentInstruction = instruction;
|
||||
|
||||
var next: Promise<any> = _resolveToTrue;
|
||||
if (isPresent(this._outlet) && isPresent(instruction.component)) {
|
||||
var componentInstruction = instruction.component;
|
||||
if (componentInstruction.reuse) {
|
||||
next = this._outlet.reuse(componentInstruction);
|
||||
} else {
|
||||
next =
|
||||
this.deactivate(instruction).then((_) => this._outlet.activate(componentInstruction));
|
||||
}
|
||||
if (isPresent(instruction.child)) {
|
||||
next = next.then((_) => {
|
||||
if (isPresent(this._childRouter)) {
|
||||
return this._childRouter.commit(instruction.child);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var promises: Promise<any>[] = [];
|
||||
this._auxRouters.forEach((router, name) => {
|
||||
if (isPresent(instruction.auxInstruction[name])) {
|
||||
promises.push(router.commit(instruction.auxInstruction[name]));
|
||||
}
|
||||
});
|
||||
|
||||
return next.then((_) => Promise.all(promises));
|
||||
}
|
||||
|
||||
|
||||
/** @internal */
|
||||
_startNavigating(): void { this.navigating = true; }
|
||||
|
||||
/** @internal */
|
||||
_finishNavigating(): void { this.navigating = false; }
|
||||
|
||||
|
||||
/**
|
||||
* Subscribe to URL updates from the router
|
||||
*/
|
||||
subscribe(onNext: (value: any) => void, onError?: (value: any) => void): Object {
|
||||
return this._subject.subscribe({next: onNext, error: onError});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Removes the contents of this router's outlet and all descendant outlets
|
||||
*/
|
||||
deactivate(instruction: Instruction): Promise<any> {
|
||||
var childInstruction: Instruction = null;
|
||||
var componentInstruction: ComponentInstruction = null;
|
||||
if (isPresent(instruction)) {
|
||||
childInstruction = instruction.child;
|
||||
componentInstruction = instruction.component;
|
||||
}
|
||||
var next: Promise<any> = _resolveToTrue;
|
||||
if (isPresent(this._childRouter)) {
|
||||
next = this._childRouter.deactivate(childInstruction);
|
||||
}
|
||||
if (isPresent(this._outlet)) {
|
||||
next = next.then((_) => this._outlet.deactivate(componentInstruction));
|
||||
}
|
||||
|
||||
// TODO: handle aux routes
|
||||
|
||||
return next;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Given a URL, returns an instruction representing the component graph
|
||||
*/
|
||||
recognize(url: string): Promise<Instruction> {
|
||||
var ancestorComponents = this._getAncestorInstructions();
|
||||
return this.registry.recognize(url, ancestorComponents);
|
||||
}
|
||||
|
||||
private _getAncestorInstructions(): Instruction[] {
|
||||
var ancestorInstructions: Instruction[] = [this.currentInstruction];
|
||||
var ancestorRouter: Router = this;
|
||||
while (isPresent(ancestorRouter = ancestorRouter.parent)) {
|
||||
ancestorInstructions.unshift(ancestorRouter.currentInstruction);
|
||||
}
|
||||
return ancestorInstructions;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Navigates to either the last URL successfully navigated to, or the last URL requested if the
|
||||
* router has yet to successfully navigate.
|
||||
*/
|
||||
renavigate(): Promise<any> {
|
||||
if (isBlank(this.lastNavigationAttempt)) {
|
||||
return this._currentNavigation;
|
||||
}
|
||||
return this.navigateByUrl(this.lastNavigationAttempt);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Generate an `Instruction` based on the provided Route Link DSL.
|
||||
*/
|
||||
generate(linkParams: any[]): Instruction {
|
||||
var ancestorInstructions = this._getAncestorInstructions();
|
||||
return this.registry.generate(linkParams, ancestorInstructions);
|
||||
}
|
||||
}
|
||||
|
||||
@Injectable()
|
||||
export class RootRouter extends Router {
|
||||
/** @internal */
|
||||
_location: Location;
|
||||
/** @internal */
|
||||
_locationSub: Object;
|
||||
|
||||
constructor(
|
||||
registry: RouteRegistry, location: Location,
|
||||
@Inject(ROUTER_PRIMARY_COMPONENT) primaryComponent: Type) {
|
||||
super(registry, null, primaryComponent);
|
||||
this.root = this;
|
||||
this._location = location;
|
||||
this._locationSub = this._location.subscribe((change) => {
|
||||
// we call recognize ourselves
|
||||
this.recognize(change['url']).then((instruction) => {
|
||||
if (isPresent(instruction)) {
|
||||
this.navigateByInstruction(instruction, isPresent(change['pop'])).then((_) => {
|
||||
// this is a popstate event; no need to change the URL
|
||||
if (isPresent(change['pop']) && change['type'] != 'hashchange') {
|
||||
return;
|
||||
}
|
||||
var emitPath = instruction.toUrlPath();
|
||||
var emitQuery = instruction.toUrlQuery();
|
||||
if (emitPath.length > 0 && emitPath[0] != '/') {
|
||||
emitPath = '/' + emitPath;
|
||||
}
|
||||
|
||||
// We've opted to use pushstate and popState APIs regardless of whether you
|
||||
// an app uses HashLocationStrategy or PathLocationStrategy.
|
||||
// However, apps that are migrating might have hash links that operate outside
|
||||
// angular to which routing must respond.
|
||||
// Therefore we know that all hashchange events occur outside Angular.
|
||||
// To support these cases where we respond to hashchanges and redirect as a
|
||||
// result, we need to replace the top item on the stack.
|
||||
if (change['type'] == 'hashchange') {
|
||||
if (instruction.toRootUrl() != this._location.path()) {
|
||||
this._location.replaceState(emitPath, emitQuery);
|
||||
}
|
||||
} else {
|
||||
this._location.go(emitPath, emitQuery);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this._emitNavigationFail(change['url']);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.registry.configFromComponent(primaryComponent);
|
||||
this.navigateByUrl(location.path());
|
||||
}
|
||||
|
||||
commit(instruction: Instruction, _skipLocationChange: boolean = false): Promise<any> {
|
||||
var emitPath = instruction.toUrlPath();
|
||||
var emitQuery = instruction.toUrlQuery();
|
||||
if (emitPath.length > 0 && emitPath[0] != '/') {
|
||||
emitPath = '/' + emitPath;
|
||||
}
|
||||
var promise = super.commit(instruction);
|
||||
if (!_skipLocationChange) {
|
||||
if (this._location.isCurrentPathEqualTo(emitPath, emitQuery)) {
|
||||
promise = promise.then((_) => { this._location.replaceState(emitPath, emitQuery); });
|
||||
} else {
|
||||
promise = promise.then((_) => { this._location.go(emitPath, emitQuery); });
|
||||
}
|
||||
}
|
||||
return promise;
|
||||
}
|
||||
|
||||
ngOnDestroy() { this.dispose(); }
|
||||
|
||||
dispose(): void {
|
||||
if (isPresent(this._locationSub)) {
|
||||
(<any>this._locationSub).unsubscribe();
|
||||
this._locationSub = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class ChildRouter extends Router {
|
||||
constructor(parent: Router, hostComponent: any /** TODO #9100 */) {
|
||||
super(parent.registry, parent, hostComponent, parent.root);
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
|
||||
navigateByUrl(url: string, _skipLocationChange: boolean = false): Promise<any> {
|
||||
// Delegate navigation to the root router
|
||||
return this.parent.navigateByUrl(url, _skipLocationChange);
|
||||
}
|
||||
|
||||
navigateByInstruction(instruction: Instruction, _skipLocationChange: boolean = false):
|
||||
Promise<any> {
|
||||
// Delegate navigation to the root router
|
||||
return this.parent.navigateByInstruction(instruction, _skipLocationChange);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function canActivateOne(
|
||||
nextInstruction: Instruction, prevInstruction: Instruction): Promise<boolean> {
|
||||
var next = _resolveToTrue;
|
||||
if (isBlank(nextInstruction.component)) {
|
||||
return next;
|
||||
}
|
||||
if (isPresent(nextInstruction.child)) {
|
||||
next = canActivateOne(
|
||||
nextInstruction.child, isPresent(prevInstruction) ? prevInstruction.child : null);
|
||||
}
|
||||
return next.then<boolean>((result: boolean): boolean => {
|
||||
if (result == false) {
|
||||
return false;
|
||||
}
|
||||
if (nextInstruction.component.reuse) {
|
||||
return true;
|
||||
}
|
||||
var hook = getCanActivateHook(nextInstruction.component.componentType);
|
||||
if (isPresent(hook)) {
|
||||
return hook(
|
||||
nextInstruction.component, isPresent(prevInstruction) ? prevInstruction.component : null);
|
||||
}
|
||||
return true;
|
||||
});
|
||||
}
|
|
@ -1,49 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {PlatformLocation} from '@angular/common';
|
||||
import {BrowserPlatformLocation} from '@angular/platform-browser';
|
||||
|
||||
import {ROUTER_PROVIDERS_COMMON} from './router_providers_common';
|
||||
|
||||
|
||||
/**
|
||||
* A list of providers. To use the router, you must add this to your application.
|
||||
*
|
||||
* ### Example ([live demo](http://plnkr.co/edit/iRUP8B5OUbxCWQ3AcIDm))
|
||||
*
|
||||
* ```
|
||||
* import {Component} from '@angular/core';
|
||||
* import {
|
||||
* ROUTER_DIRECTIVES,
|
||||
* ROUTER_PROVIDERS,
|
||||
* RouteConfig
|
||||
* } from '@angular/router-deprecated';
|
||||
*
|
||||
* @Component({directives: [ROUTER_DIRECTIVES]})
|
||||
* @RouteConfig([
|
||||
* {...},
|
||||
* ])
|
||||
* class AppCmp {
|
||||
* // ...
|
||||
* }
|
||||
*
|
||||
* bootstrap(AppCmp, [ROUTER_PROVIDERS]);
|
||||
* ```
|
||||
*/
|
||||
export const ROUTER_PROVIDERS: any[] = [
|
||||
ROUTER_PROVIDERS_COMMON,
|
||||
({provide: PlatformLocation, useClass: BrowserPlatformLocation}),
|
||||
];
|
||||
|
||||
/**
|
||||
* Use {@link ROUTER_PROVIDERS} instead.
|
||||
*
|
||||
* @deprecated
|
||||
*/
|
||||
export const ROUTER_BINDINGS = ROUTER_PROVIDERS;
|
|
@ -1,45 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location, LocationStrategy, PathLocationStrategy} from '@angular/common';
|
||||
import {ApplicationRef} from '@angular/core';
|
||||
|
||||
import {BaseException} from '../src/facade/exceptions';
|
||||
import {Type} from '../src/facade/lang';
|
||||
|
||||
import {ROUTER_PRIMARY_COMPONENT, RouteRegistry} from './route_registry';
|
||||
import {RootRouter, Router} from './router';
|
||||
|
||||
|
||||
/**
|
||||
* The Platform agnostic ROUTER PROVIDERS
|
||||
*/
|
||||
export const ROUTER_PROVIDERS_COMMON: any[] = [
|
||||
RouteRegistry, {provide: LocationStrategy, useClass: PathLocationStrategy}, Location, {
|
||||
provide: Router,
|
||||
useFactory: routerFactory,
|
||||
deps: [RouteRegistry, Location, ROUTER_PRIMARY_COMPONENT]
|
||||
},
|
||||
{
|
||||
provide: ROUTER_PRIMARY_COMPONENT,
|
||||
useFactory: routerPrimaryComponentFactory,
|
||||
deps: [ApplicationRef]
|
||||
}
|
||||
];
|
||||
|
||||
function routerFactory(
|
||||
registry: RouteRegistry, location: Location, primaryComponent: Type): RootRouter {
|
||||
return new RootRouter(registry, location, primaryComponent);
|
||||
}
|
||||
|
||||
function routerPrimaryComponentFactory(app: ApplicationRef): Type {
|
||||
if (app.componentTypes.length == 0) {
|
||||
throw new BaseException('Bootstrap at least one component before injecting Router.');
|
||||
}
|
||||
return app.componentTypes[0];
|
||||
}
|
|
@ -1,35 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Type, isPresent} from '../../facade/lang';
|
||||
import {BLANK_ROUTE_DATA, RouteData} from '../../instruction';
|
||||
|
||||
import {RouteHandler} from './route_handler';
|
||||
|
||||
|
||||
export class AsyncRouteHandler implements RouteHandler {
|
||||
/** @internal */
|
||||
_resolvedComponent: Promise<Type> = null;
|
||||
componentType: Type;
|
||||
public data: RouteData;
|
||||
|
||||
constructor(private _loader: () => Promise<Type>, data: {[key: string]: any} = null) {
|
||||
this.data = isPresent(data) ? new RouteData(data) : BLANK_ROUTE_DATA;
|
||||
}
|
||||
|
||||
resolveComponentType(): Promise<Type> {
|
||||
if (isPresent(this._resolvedComponent)) {
|
||||
return this._resolvedComponent;
|
||||
}
|
||||
|
||||
return this._resolvedComponent = this._loader().then((componentType) => {
|
||||
this.componentType = componentType;
|
||||
return componentType;
|
||||
});
|
||||
}
|
||||
}
|
|
@ -1,16 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Type} from '../../facade/lang';
|
||||
import {RouteData} from '../../instruction';
|
||||
|
||||
export interface RouteHandler {
|
||||
componentType: Type;
|
||||
resolveComponentType(): Promise<any>;
|
||||
data: RouteData;
|
||||
}
|
|
@ -1,27 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Type, isPresent} from '../../facade/lang';
|
||||
import {BLANK_ROUTE_DATA, RouteData} from '../../instruction';
|
||||
|
||||
import {RouteHandler} from './route_handler';
|
||||
|
||||
|
||||
export class SyncRouteHandler implements RouteHandler {
|
||||
public data: RouteData;
|
||||
|
||||
/** @internal */
|
||||
_resolvedComponent: Promise<any> = null;
|
||||
|
||||
constructor(public componentType: Type, data?: {[key: string]: any}) {
|
||||
this._resolvedComponent = Promise.resolve(componentType);
|
||||
this.data = isPresent(data) ? new RouteData(data) : BLANK_ROUTE_DATA;
|
||||
}
|
||||
|
||||
resolveComponentType(): Promise<any> { return this._resolvedComponent; }
|
||||
}
|
|
@ -1,321 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {StringMapWrapper} from '../../facade/collection';
|
||||
import {BaseException} from '../../facade/exceptions';
|
||||
import {StringWrapper, isBlank, isPresent} from '../../facade/lang';
|
||||
import {RootUrl, Url, convertUrlParamsToArray} from '../../url_parser';
|
||||
import {TouchMap, normalizeString} from '../../utils';
|
||||
|
||||
import {GeneratedUrl, MatchedUrl, RoutePath} from './route_path';
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* `ParamRoutePath`s are made up of `PathSegment`s, each of which can
|
||||
* match a segment of a URL. Different kind of `PathSegment`s match
|
||||
* URL segments in different ways...
|
||||
*/
|
||||
interface PathSegment {
|
||||
name: string;
|
||||
generate(params: TouchMap): string;
|
||||
match(path: string): boolean;
|
||||
specificity: string;
|
||||
hash: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Identified by a `...` URL segment. This indicates that the
|
||||
* Route will continue to be matched by child `Router`s.
|
||||
*/
|
||||
class ContinuationPathSegment implements PathSegment {
|
||||
name: string = '';
|
||||
specificity = '';
|
||||
hash = '...';
|
||||
generate(params: TouchMap): string { return ''; }
|
||||
match(path: string): boolean { return true; }
|
||||
}
|
||||
|
||||
/**
|
||||
* Identified by a string not starting with a `:` or `*`.
|
||||
* Only matches the URL segments that equal the segment path
|
||||
*/
|
||||
class StaticPathSegment implements PathSegment {
|
||||
name: string = '';
|
||||
specificity = '2';
|
||||
hash: string;
|
||||
constructor(public path: string) { this.hash = path; }
|
||||
match(path: string): boolean { return path == this.path; }
|
||||
generate(params: TouchMap): string { return this.path; }
|
||||
}
|
||||
|
||||
/**
|
||||
* Identified by a string starting with `:`. Indicates a segment
|
||||
* that can contain a value that will be extracted and provided to
|
||||
* a matching `Instruction`.
|
||||
*/
|
||||
class DynamicPathSegment implements PathSegment {
|
||||
static paramMatcher = /^:([^\/]+)$/;
|
||||
specificity = '1';
|
||||
hash = ':';
|
||||
constructor(public name: string) {}
|
||||
match(path: string): boolean { return path.length > 0; }
|
||||
generate(params: TouchMap): string {
|
||||
if (!StringMapWrapper.contains(params.map, this.name)) {
|
||||
throw new BaseException(
|
||||
`Route generator for '${this.name}' was not included in parameters passed.`);
|
||||
}
|
||||
return encodeDynamicSegment(normalizeString(params.get(this.name)));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Identified by a string starting with `*` Indicates that all the following
|
||||
* segments match this route and that the value of these segments should
|
||||
* be provided to a matching `Instruction`.
|
||||
*/
|
||||
class StarPathSegment implements PathSegment {
|
||||
static wildcardMatcher = /^\*([^\/]+)$/;
|
||||
specificity = '0';
|
||||
hash = '*';
|
||||
constructor(public name: string) {}
|
||||
match(path: string): boolean { return true; }
|
||||
generate(params: TouchMap): string { return normalizeString(params.get(this.name)); }
|
||||
}
|
||||
|
||||
/**
|
||||
* Parses a URL string using a given matcher DSL, and generates URLs from param maps
|
||||
*/
|
||||
export class ParamRoutePath implements RoutePath {
|
||||
specificity: string;
|
||||
terminal: boolean = true;
|
||||
hash: string;
|
||||
|
||||
private _segments: PathSegment[];
|
||||
|
||||
/**
|
||||
* Takes a string representing the matcher DSL
|
||||
*/
|
||||
constructor(public routePath: string) {
|
||||
this._assertValidPath(routePath);
|
||||
|
||||
this._parsePathString(routePath);
|
||||
this.specificity = this._calculateSpecificity();
|
||||
this.hash = this._calculateHash();
|
||||
|
||||
var lastSegment = this._segments[this._segments.length - 1];
|
||||
this.terminal = !(lastSegment instanceof ContinuationPathSegment);
|
||||
}
|
||||
|
||||
matchUrl(url: Url): MatchedUrl {
|
||||
var nextUrlSegment = url;
|
||||
var currentUrlSegment: Url;
|
||||
var positionalParams = {};
|
||||
var captured: string[] = [];
|
||||
|
||||
for (var i = 0; i < this._segments.length; i += 1) {
|
||||
var pathSegment = this._segments[i];
|
||||
|
||||
if (pathSegment instanceof ContinuationPathSegment) {
|
||||
break;
|
||||
}
|
||||
currentUrlSegment = nextUrlSegment;
|
||||
|
||||
if (isPresent(currentUrlSegment)) {
|
||||
// the star segment consumes all of the remaining URL, including matrix params
|
||||
if (pathSegment instanceof StarPathSegment) {
|
||||
(positionalParams as any /** TODO #9100 */)[pathSegment.name] =
|
||||
currentUrlSegment.toString();
|
||||
captured.push(currentUrlSegment.toString());
|
||||
nextUrlSegment = null;
|
||||
break;
|
||||
}
|
||||
|
||||
captured.push(currentUrlSegment.path);
|
||||
|
||||
if (pathSegment instanceof DynamicPathSegment) {
|
||||
(positionalParams as any /** TODO #9100 */)[pathSegment.name] =
|
||||
decodeDynamicSegment(currentUrlSegment.path);
|
||||
} else if (!pathSegment.match(currentUrlSegment.path)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
nextUrlSegment = currentUrlSegment.child;
|
||||
} else if (!pathSegment.match('')) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
if (this.terminal && isPresent(nextUrlSegment)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var urlPath = captured.join('/');
|
||||
|
||||
var auxiliary: any[] /** TODO #9100 */ = [];
|
||||
var urlParams: any[] /** TODO #9100 */ = [];
|
||||
var allParams = positionalParams;
|
||||
if (isPresent(currentUrlSegment)) {
|
||||
// If this is the root component, read query params. Otherwise, read matrix params.
|
||||
var paramsSegment = url instanceof RootUrl ? url : currentUrlSegment;
|
||||
|
||||
if (isPresent(paramsSegment.params)) {
|
||||
allParams = StringMapWrapper.merge(paramsSegment.params, positionalParams);
|
||||
urlParams = convertUrlParamsToArray(paramsSegment.params);
|
||||
} else {
|
||||
allParams = positionalParams;
|
||||
}
|
||||
auxiliary = currentUrlSegment.auxiliary;
|
||||
}
|
||||
|
||||
return new MatchedUrl(urlPath, urlParams, allParams, auxiliary, nextUrlSegment);
|
||||
}
|
||||
|
||||
|
||||
generateUrl(params: {[key: string]: any}): GeneratedUrl {
|
||||
var paramTokens = new TouchMap(params);
|
||||
|
||||
var path: any[] /** TODO #9100 */ = [];
|
||||
|
||||
for (var i = 0; i < this._segments.length; i++) {
|
||||
let segment = this._segments[i];
|
||||
if (!(segment instanceof ContinuationPathSegment)) {
|
||||
path.push(segment.generate(paramTokens));
|
||||
}
|
||||
}
|
||||
var urlPath = path.join('/');
|
||||
|
||||
var nonPositionalParams = paramTokens.getUnused();
|
||||
var urlParams = nonPositionalParams;
|
||||
|
||||
return new GeneratedUrl(urlPath, urlParams);
|
||||
}
|
||||
|
||||
|
||||
toString(): string { return this.routePath; }
|
||||
|
||||
private _parsePathString(routePath: string) {
|
||||
// normalize route as not starting with a "/". Recognition will
|
||||
// also normalize.
|
||||
if (routePath.startsWith('/')) {
|
||||
routePath = routePath.substring(1);
|
||||
}
|
||||
|
||||
var segmentStrings = routePath.split('/');
|
||||
this._segments = [];
|
||||
|
||||
var limit = segmentStrings.length - 1;
|
||||
for (var i = 0; i <= limit; i++) {
|
||||
var segment = segmentStrings[i], match: RegExpMatchArray;
|
||||
|
||||
if (isPresent(match = segment.match(DynamicPathSegment.paramMatcher))) {
|
||||
this._segments.push(new DynamicPathSegment(match[1]));
|
||||
} else if (isPresent(match = segment.match(StarPathSegment.wildcardMatcher))) {
|
||||
this._segments.push(new StarPathSegment(match[1]));
|
||||
} else if (segment == '...') {
|
||||
if (i < limit) {
|
||||
throw new BaseException(
|
||||
`Unexpected "..." before the end of the path for "${routePath}".`);
|
||||
}
|
||||
this._segments.push(new ContinuationPathSegment());
|
||||
} else {
|
||||
this._segments.push(new StaticPathSegment(segment));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private _calculateSpecificity(): string {
|
||||
// The "specificity" of a path is used to determine which route is used when multiple routes
|
||||
// match
|
||||
// a URL. Static segments (like "/foo") are the most specific, followed by dynamic segments
|
||||
// (like
|
||||
// "/:id"). Star segments add no specificity. Segments at the start of the path are more
|
||||
// specific
|
||||
// than proceeding ones.
|
||||
//
|
||||
// The code below uses place values to combine the different types of segments into a single
|
||||
// string that we can sort later. Each static segment is marked as a specificity of "2," each
|
||||
// dynamic segment is worth "1" specificity, and stars are worth "0" specificity.
|
||||
var i: any /** TODO #9100 */, length = this._segments.length,
|
||||
specificity: any /** TODO #9100 */;
|
||||
if (length == 0) {
|
||||
// a single slash (or "empty segment" is as specific as a static segment
|
||||
specificity += '2';
|
||||
} else {
|
||||
specificity = '';
|
||||
for (i = 0; i < length; i++) {
|
||||
specificity += this._segments[i].specificity;
|
||||
}
|
||||
}
|
||||
return specificity;
|
||||
}
|
||||
|
||||
private _calculateHash(): string {
|
||||
// this function is used to determine whether a route config path like `/foo/:id` collides with
|
||||
// `/foo/:name`
|
||||
var i: any /** TODO #9100 */, length = this._segments.length;
|
||||
var hashParts: any[] /** TODO #9100 */ = [];
|
||||
for (i = 0; i < length; i++) {
|
||||
hashParts.push(this._segments[i].hash);
|
||||
}
|
||||
return hashParts.join('/');
|
||||
}
|
||||
|
||||
private _assertValidPath(path: string) {
|
||||
if (StringWrapper.contains(path, '#')) {
|
||||
throw new BaseException(
|
||||
`Path "${path}" should not include "#". Use "HashLocationStrategy" instead.`);
|
||||
}
|
||||
const illegalCharacter = path.match(ParamRoutePath.RESERVED_CHARS);
|
||||
if (isPresent(illegalCharacter)) {
|
||||
throw new BaseException(
|
||||
`Path "${path}" contains "${illegalCharacter[0]}" which is not allowed in a route config.`);
|
||||
}
|
||||
}
|
||||
static RESERVED_CHARS = new RegExp('//|\\(|\\)|;|\\?|=');
|
||||
}
|
||||
|
||||
let REGEXP_PERCENT = /%/g;
|
||||
let REGEXP_SLASH = /\//g;
|
||||
let REGEXP_OPEN_PARENT = /\(/g;
|
||||
let REGEXP_CLOSE_PARENT = /\)/g;
|
||||
let REGEXP_SEMICOLON = /;/g;
|
||||
|
||||
function encodeDynamicSegment(value: string): string {
|
||||
if (isBlank(value)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
value = StringWrapper.replaceAll(value, REGEXP_PERCENT, '%25');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_SLASH, '%2F');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_OPEN_PARENT, '%28');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_CLOSE_PARENT, '%29');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_SEMICOLON, '%3B');
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
let REGEXP_ENC_SEMICOLON = /%3B/ig;
|
||||
let REGEXP_ENC_CLOSE_PARENT = /%29/ig;
|
||||
let REGEXP_ENC_OPEN_PARENT = /%28/ig;
|
||||
let REGEXP_ENC_SLASH = /%2F/ig;
|
||||
let REGEXP_ENC_PERCENT = /%25/ig;
|
||||
|
||||
function decodeDynamicSegment(value: string): string {
|
||||
if (isBlank(value)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
value = StringWrapper.replaceAll(value, REGEXP_ENC_SEMICOLON, ';');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_ENC_CLOSE_PARENT, ')');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_ENC_OPEN_PARENT, '(');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_ENC_SLASH, '/');
|
||||
value = StringWrapper.replaceAll(value, REGEXP_ENC_PERCENT, '%');
|
||||
|
||||
return value;
|
||||
}
|
|
@ -1,69 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {BaseException} from '@angular/core';
|
||||
|
||||
import {isBlank} from '../../facade/lang';
|
||||
import {Url} from '../../url_parser';
|
||||
|
||||
import {GeneratedUrl, MatchedUrl, RoutePath} from './route_path';
|
||||
|
||||
|
||||
export interface RegexSerializer { (params: {[key: string]: any}): GeneratedUrl; }
|
||||
|
||||
function computeNumberOfRegexGroups(regex: string): number {
|
||||
// cleverly compute regex groups by appending an alternative empty matching
|
||||
// pattern and match against an empty string, the resulting match still
|
||||
// receives all the other groups
|
||||
var testRegex = new RegExp(regex + '|');
|
||||
return testRegex.exec('').length;
|
||||
}
|
||||
|
||||
export class RegexRoutePath implements RoutePath {
|
||||
public hash: string;
|
||||
public terminal: boolean = true;
|
||||
public specificity: string = '2';
|
||||
|
||||
private _regex: RegExp;
|
||||
|
||||
constructor(
|
||||
private _reString: string, private _serializer: RegexSerializer,
|
||||
private _groupNames?: Array<string>) {
|
||||
this.hash = this._reString;
|
||||
this._regex = new RegExp(this._reString);
|
||||
if (this._groupNames != null) {
|
||||
var groups = computeNumberOfRegexGroups(this._reString);
|
||||
if (groups != _groupNames.length) {
|
||||
throw new BaseException(
|
||||
`Regex group names [${this._groupNames.join(',')}] must contain names for \
|
||||
each matching group and a name for the complete match as its first element of regex \
|
||||
'${this._reString}'. ${groups} group names are expected.`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
matchUrl(url: Url): MatchedUrl {
|
||||
var urlPath = url.toString();
|
||||
var params: {[key: string]: string} = {};
|
||||
var match = urlPath.match(this._regex);
|
||||
|
||||
if (isBlank(match)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
for (let i = 0; i < match.length; i += 1) {
|
||||
params[this._groupNames != null ? this._groupNames[i] : i.toString()] = match[i];
|
||||
}
|
||||
|
||||
return new MatchedUrl(urlPath, [], params, [], null);
|
||||
}
|
||||
|
||||
generateUrl(params: {[key: string]: any}): GeneratedUrl { return this._serializer(params); }
|
||||
|
||||
toString(): string { return this._reString; }
|
||||
}
|
|
@ -1,29 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Url} from '../../url_parser';
|
||||
|
||||
export class MatchedUrl {
|
||||
constructor(
|
||||
public urlPath: string, public urlParams: string[], public allParams: {[key: string]: any},
|
||||
public auxiliary: Url[], public rest: Url) {}
|
||||
}
|
||||
|
||||
|
||||
export class GeneratedUrl {
|
||||
constructor(public urlPath: string, public urlParams: {[key: string]: any}) {}
|
||||
}
|
||||
|
||||
export interface RoutePath {
|
||||
specificity: string;
|
||||
terminal: boolean;
|
||||
hash: string;
|
||||
matchUrl(url: Url): MatchedUrl;
|
||||
generateUrl(params: {[key: string]: any}): GeneratedUrl;
|
||||
toString(): string;
|
||||
}
|
|
@ -1,190 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Map} from '../facade/collection';
|
||||
import {BaseException} from '../facade/exceptions';
|
||||
import {isBlank, isFunction, isPresent} from '../facade/lang';
|
||||
import {ComponentInstruction} from '../instruction';
|
||||
import {AsyncRoute, AuxRoute, Redirect, Route, RouteDefinition} from '../route_config/route_config_impl';
|
||||
import {Url} from '../url_parser';
|
||||
|
||||
import {AsyncRouteHandler} from './route_handlers/async_route_handler';
|
||||
import {SyncRouteHandler} from './route_handlers/sync_route_handler';
|
||||
import {ParamRoutePath} from './route_paths/param_route_path';
|
||||
import {RegexRoutePath} from './route_paths/regex_route_path';
|
||||
import {RoutePath} from './route_paths/route_path';
|
||||
import {AbstractRule, PathMatch, RedirectRule, RouteMatch, RouteRule} from './rules';
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* A `RuleSet` is responsible for recognizing routes for a particular component.
|
||||
* It is consumed by `RouteRegistry`, which knows how to recognize an entire hierarchy of
|
||||
* components.
|
||||
*/
|
||||
export class RuleSet {
|
||||
rulesByName = new Map<string, RouteRule>();
|
||||
|
||||
// map from name to rule
|
||||
auxRulesByName = new Map<string, RouteRule>();
|
||||
|
||||
// map from starting path to rule
|
||||
auxRulesByPath = new Map<string, RouteRule>();
|
||||
|
||||
// TODO: optimize this into a trie
|
||||
rules: AbstractRule[] = [];
|
||||
|
||||
// the rule to use automatically when recognizing or generating from this rule set
|
||||
defaultRule: RouteRule = null;
|
||||
|
||||
/**
|
||||
* Configure additional rules in this rule set from a route definition
|
||||
* @returns {boolean} true if the config is terminal
|
||||
*/
|
||||
config(config: RouteDefinition): boolean {
|
||||
let handler: any /** TODO #9100 */;
|
||||
|
||||
if (isPresent(config.name) && config.name[0].toUpperCase() != config.name[0]) {
|
||||
let suggestedName = config.name[0].toUpperCase() + config.name.substring(1);
|
||||
throw new BaseException(
|
||||
`Route "${config.path}" with name "${config.name}" does not begin with an uppercase letter. Route names should be PascalCase like "${suggestedName}".`);
|
||||
}
|
||||
|
||||
if (config instanceof AuxRoute) {
|
||||
handler = new SyncRouteHandler(config.component, config.data);
|
||||
let routePath = this._getRoutePath(config);
|
||||
let auxRule = new RouteRule(routePath, handler, config.name);
|
||||
this.auxRulesByPath.set(routePath.toString(), auxRule);
|
||||
if (isPresent(config.name)) {
|
||||
this.auxRulesByName.set(config.name, auxRule);
|
||||
}
|
||||
return auxRule.terminal;
|
||||
}
|
||||
|
||||
let useAsDefault = false;
|
||||
|
||||
if (config instanceof Redirect) {
|
||||
let routePath = this._getRoutePath(config);
|
||||
let redirector = new RedirectRule(routePath, config.redirectTo);
|
||||
this._assertNoHashCollision(redirector.hash, config.path);
|
||||
this.rules.push(redirector);
|
||||
return true;
|
||||
}
|
||||
|
||||
if (config instanceof Route) {
|
||||
handler = new SyncRouteHandler(config.component, config.data);
|
||||
useAsDefault = isPresent(config.useAsDefault) && config.useAsDefault;
|
||||
} else if (config instanceof AsyncRoute) {
|
||||
handler = new AsyncRouteHandler(config.loader, config.data);
|
||||
useAsDefault = isPresent(config.useAsDefault) && config.useAsDefault;
|
||||
}
|
||||
let routePath = this._getRoutePath(config);
|
||||
let newRule = new RouteRule(routePath, handler, config.name);
|
||||
|
||||
this._assertNoHashCollision(newRule.hash, config.path);
|
||||
|
||||
if (useAsDefault) {
|
||||
if (isPresent(this.defaultRule)) {
|
||||
throw new BaseException(`Only one route can be default`);
|
||||
}
|
||||
this.defaultRule = newRule;
|
||||
}
|
||||
|
||||
this.rules.push(newRule);
|
||||
if (isPresent(config.name)) {
|
||||
this.rulesByName.set(config.name, newRule);
|
||||
}
|
||||
return newRule.terminal;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Given a URL, returns a list of `RouteMatch`es, which are partial recognitions for some route.
|
||||
*/
|
||||
recognize(urlParse: Url): Promise<RouteMatch>[] {
|
||||
var solutions: any[] /** TODO #9100 */ = [];
|
||||
|
||||
this.rules.forEach((routeRecognizer: AbstractRule) => {
|
||||
var pathMatch = routeRecognizer.recognize(urlParse);
|
||||
|
||||
if (isPresent(pathMatch)) {
|
||||
solutions.push(pathMatch);
|
||||
}
|
||||
});
|
||||
|
||||
// handle cases where we are routing just to an aux route
|
||||
if (solutions.length == 0 && isPresent(urlParse) && urlParse.auxiliary.length > 0) {
|
||||
return [Promise.resolve(new PathMatch(null, null, urlParse.auxiliary))];
|
||||
}
|
||||
|
||||
return solutions;
|
||||
}
|
||||
|
||||
recognizeAuxiliary(urlParse: Url): Promise<RouteMatch>[] {
|
||||
var routeRecognizer: RouteRule = this.auxRulesByPath.get(urlParse.path);
|
||||
if (isPresent(routeRecognizer)) {
|
||||
return [routeRecognizer.recognize(urlParse)];
|
||||
}
|
||||
|
||||
return [Promise.resolve(null)];
|
||||
}
|
||||
|
||||
hasRoute(name: string): boolean { return this.rulesByName.has(name); }
|
||||
|
||||
componentLoaded(name: string): boolean {
|
||||
return this.hasRoute(name) && isPresent(this.rulesByName.get(name).handler.componentType);
|
||||
}
|
||||
|
||||
loadComponent(name: string): Promise<any> {
|
||||
return this.rulesByName.get(name).handler.resolveComponentType();
|
||||
}
|
||||
|
||||
generate(name: string, params: any): ComponentInstruction {
|
||||
var rule: RouteRule = this.rulesByName.get(name);
|
||||
if (isBlank(rule)) {
|
||||
return null;
|
||||
}
|
||||
return rule.generate(params);
|
||||
}
|
||||
|
||||
generateAuxiliary(name: string, params: any): ComponentInstruction {
|
||||
var rule: RouteRule = this.auxRulesByName.get(name);
|
||||
if (isBlank(rule)) {
|
||||
return null;
|
||||
}
|
||||
return rule.generate(params);
|
||||
}
|
||||
|
||||
private _assertNoHashCollision(hash: string, path: any /** TODO #9100 */) {
|
||||
this.rules.forEach((rule) => {
|
||||
if (hash == rule.hash) {
|
||||
throw new BaseException(
|
||||
`Configuration '${path}' conflicts with existing route '${rule.path}'`);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private _getRoutePath(config: RouteDefinition): RoutePath {
|
||||
if (isPresent(config.regex)) {
|
||||
if (isFunction(config.serializer)) {
|
||||
return new RegexRoutePath(config.regex, config.serializer, config.regex_group_names);
|
||||
} else {
|
||||
throw new BaseException(
|
||||
`Route provides a regex property, '${config.regex}', but no serializer property`);
|
||||
}
|
||||
}
|
||||
if (isPresent(config.path)) {
|
||||
// Auxiliary routes do not have a slash at the start
|
||||
let path = (config instanceof AuxRoute && config.path.startsWith('/')) ?
|
||||
config.path.substring(1) :
|
||||
config.path;
|
||||
return new ParamRoutePath(path);
|
||||
}
|
||||
throw new BaseException('Route must provide either a path or regex property');
|
||||
}
|
||||
}
|
|
@ -1,128 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Map} from '../facade/collection';
|
||||
import {BaseException} from '../facade/exceptions';
|
||||
import {isBlank, isPresent} from '../facade/lang';
|
||||
import {ComponentInstruction} from '../instruction';
|
||||
import {Url, convertUrlParamsToArray} from '../url_parser';
|
||||
|
||||
import {RouteHandler} from './route_handlers/route_handler';
|
||||
import {GeneratedUrl, RoutePath} from './route_paths/route_path';
|
||||
|
||||
|
||||
|
||||
// RouteMatch objects hold information about a match between a rule and a URL
|
||||
export abstract class RouteMatch {}
|
||||
|
||||
export class PathMatch extends RouteMatch {
|
||||
constructor(
|
||||
public instruction: ComponentInstruction, public remaining: Url, public remainingAux: Url[]) {
|
||||
super();
|
||||
}
|
||||
}
|
||||
|
||||
export class RedirectMatch extends RouteMatch {
|
||||
constructor(public redirectTo: any[], public specificity: any /** TODO #9100 */) { super(); }
|
||||
}
|
||||
|
||||
// Rules are responsible for recognizing URL segments and generating instructions
|
||||
export interface AbstractRule {
|
||||
hash: string;
|
||||
path: string;
|
||||
recognize(beginningSegment: Url): Promise<RouteMatch>;
|
||||
generate(params: {[key: string]: any}): ComponentInstruction;
|
||||
}
|
||||
|
||||
export class RedirectRule implements AbstractRule {
|
||||
public hash: string;
|
||||
|
||||
constructor(private _pathRecognizer: RoutePath, public redirectTo: any[]) {
|
||||
this.hash = this._pathRecognizer.hash;
|
||||
}
|
||||
|
||||
get path() { return this._pathRecognizer.toString(); }
|
||||
set path(val) { throw new BaseException('you cannot set the path of a RedirectRule directly'); }
|
||||
|
||||
/**
|
||||
* Returns `null` or a `ParsedUrl` representing the new path to match
|
||||
*/
|
||||
recognize(beginningSegment: Url): Promise<RouteMatch> {
|
||||
var match: any /** TODO #9100 */ = null;
|
||||
if (isPresent(this._pathRecognizer.matchUrl(beginningSegment))) {
|
||||
match = new RedirectMatch(this.redirectTo, this._pathRecognizer.specificity);
|
||||
}
|
||||
return Promise.resolve(match);
|
||||
}
|
||||
|
||||
generate(params: {[key: string]: any}): ComponentInstruction {
|
||||
throw new BaseException(`Tried to generate a redirect.`);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// represents something like '/foo/:bar'
|
||||
export class RouteRule implements AbstractRule {
|
||||
specificity: string;
|
||||
terminal: boolean;
|
||||
hash: string;
|
||||
|
||||
private _cache: Map<string, ComponentInstruction> = new Map<string, ComponentInstruction>();
|
||||
|
||||
// TODO: cache component instruction instances by params and by ParsedUrl instance
|
||||
|
||||
constructor(
|
||||
private _routePath: RoutePath, public handler: RouteHandler, private _routeName: string) {
|
||||
this.specificity = this._routePath.specificity;
|
||||
this.hash = this._routePath.hash;
|
||||
this.terminal = this._routePath.terminal;
|
||||
}
|
||||
|
||||
get path() { return this._routePath.toString(); }
|
||||
set path(val) { throw new BaseException('you cannot set the path of a RouteRule directly'); }
|
||||
|
||||
recognize(beginningSegment: Url): Promise<RouteMatch> {
|
||||
var res = this._routePath.matchUrl(beginningSegment);
|
||||
if (isBlank(res)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return this.handler.resolveComponentType().then((_) => {
|
||||
var componentInstruction = this._getInstruction(res.urlPath, res.urlParams, res.allParams);
|
||||
return new PathMatch(componentInstruction, res.rest, res.auxiliary);
|
||||
});
|
||||
}
|
||||
|
||||
generate(params: {[key: string]: any}): ComponentInstruction {
|
||||
var generated = this._routePath.generateUrl(params);
|
||||
var urlPath = generated.urlPath;
|
||||
var urlParams = generated.urlParams;
|
||||
return this._getInstruction(urlPath, convertUrlParamsToArray(urlParams), params);
|
||||
}
|
||||
|
||||
generateComponentPathValues(params: {[key: string]: any}): GeneratedUrl {
|
||||
return this._routePath.generateUrl(params);
|
||||
}
|
||||
|
||||
private _getInstruction(urlPath: string, urlParams: string[], params: {[key: string]: any}):
|
||||
ComponentInstruction {
|
||||
if (isBlank(this.handler.componentType)) {
|
||||
throw new BaseException(`Tried to get instruction before the type was loaded.`);
|
||||
}
|
||||
var hashKey = urlPath + '?' + urlParams.join('&');
|
||||
if (this._cache.has(hashKey)) {
|
||||
return this._cache.get(hashKey);
|
||||
}
|
||||
var instruction = new ComponentInstruction(
|
||||
urlPath, urlParams, this.handler.data, this.handler.componentType, this.terminal,
|
||||
this.specificity, params, this._routeName);
|
||||
this._cache.set(hashKey, instruction);
|
||||
|
||||
return instruction;
|
||||
}
|
||||
}
|
|
@ -1,252 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {StringMapWrapper} from '../src/facade/collection';
|
||||
import {BaseException} from '../src/facade/exceptions';
|
||||
import {isBlank, isPresent} from '../src/facade/lang';
|
||||
|
||||
export function convertUrlParamsToArray(urlParams: {[key: string]: any}): string[] {
|
||||
var paramsArray: any[] /** TODO #9100 */ = [];
|
||||
if (isBlank(urlParams)) {
|
||||
return [];
|
||||
}
|
||||
StringMapWrapper.forEach(
|
||||
urlParams, (value: any /** TODO #9100 */, key: any /** TODO #9100 */) => {
|
||||
paramsArray.push((value === true) ? key : key + '=' + value);
|
||||
});
|
||||
return paramsArray;
|
||||
}
|
||||
|
||||
// Convert an object of url parameters into a string that can be used in an URL
|
||||
export function serializeParams(urlParams: {[key: string]: any}, joiner = '&'): string {
|
||||
return convertUrlParamsToArray(urlParams).join(joiner);
|
||||
}
|
||||
|
||||
/**
|
||||
* This class represents a parsed URL
|
||||
*/
|
||||
export class Url {
|
||||
constructor(
|
||||
public path: string, public child: Url = null, public auxiliary: Url[] = [],
|
||||
public params: {[key: string]: any} = {}) {}
|
||||
|
||||
toString(): string {
|
||||
return this.path + this._matrixParamsToString() + this._auxToString() + this._childString();
|
||||
}
|
||||
|
||||
segmentToString(): string { return this.path + this._matrixParamsToString(); }
|
||||
|
||||
/** @internal */
|
||||
_auxToString(): string {
|
||||
return this.auxiliary.length > 0 ?
|
||||
('(' + this.auxiliary.map(sibling => sibling.toString()).join('//') + ')') :
|
||||
'';
|
||||
}
|
||||
|
||||
private _matrixParamsToString(): string {
|
||||
var paramString = serializeParams(this.params, ';');
|
||||
if (paramString.length > 0) {
|
||||
return ';' + paramString;
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
/** @internal */
|
||||
_childString(): string { return isPresent(this.child) ? ('/' + this.child.toString()) : ''; }
|
||||
}
|
||||
|
||||
export class RootUrl extends Url {
|
||||
constructor(path: string, child: Url = null, auxiliary: Url[] = [], params: {[key: string]:
|
||||
any} = null) {
|
||||
super(path, child, auxiliary, params);
|
||||
}
|
||||
|
||||
toString(): string {
|
||||
return this.path + this._auxToString() + this._childString() + this._queryParamsToString();
|
||||
}
|
||||
|
||||
segmentToString(): string { return this.path + this._queryParamsToString(); }
|
||||
|
||||
private _queryParamsToString(): string {
|
||||
if (isBlank(this.params)) {
|
||||
return '';
|
||||
}
|
||||
|
||||
return '?' + serializeParams(this.params);
|
||||
}
|
||||
}
|
||||
|
||||
export function pathSegmentsToUrl(pathSegments: string[]): Url {
|
||||
var url = new Url(pathSegments[pathSegments.length - 1]);
|
||||
for (var i = pathSegments.length - 2; i >= 0; i -= 1) {
|
||||
url = new Url(pathSegments[i], url);
|
||||
}
|
||||
return url;
|
||||
}
|
||||
|
||||
const SEGMENT_RE = /^[^\/\(\)\?;=&#]+/;
|
||||
function matchUrlSegment(str: string): string {
|
||||
const match = str.match(SEGMENT_RE);
|
||||
return match !== null ? match[0] : '';
|
||||
}
|
||||
const QUERY_PARAM_VALUE_RE = /^[^\(\)\?;&#]+/;
|
||||
function matchUrlQueryParamValue(str: string): string {
|
||||
var match = str.match(QUERY_PARAM_VALUE_RE);
|
||||
return match !== null ? match[0] : '';
|
||||
}
|
||||
|
||||
export class UrlParser {
|
||||
private _remaining: string;
|
||||
|
||||
peekStartsWith(str: string): boolean { return this._remaining.startsWith(str); }
|
||||
|
||||
capture(str: string): void {
|
||||
if (!this._remaining.startsWith(str)) {
|
||||
throw new BaseException(`Expected "${str}".`);
|
||||
}
|
||||
this._remaining = this._remaining.substring(str.length);
|
||||
}
|
||||
|
||||
parse(url: string): Url {
|
||||
this._remaining = url;
|
||||
if (url == '' || url == '/') {
|
||||
return new Url('');
|
||||
}
|
||||
return this.parseRoot();
|
||||
}
|
||||
|
||||
// segment + (aux segments) + (query params)
|
||||
parseRoot(): RootUrl {
|
||||
if (this.peekStartsWith('/')) {
|
||||
this.capture('/');
|
||||
}
|
||||
var path = matchUrlSegment(this._remaining);
|
||||
this.capture(path);
|
||||
|
||||
var aux: Url[] = [];
|
||||
if (this.peekStartsWith('(')) {
|
||||
aux = this.parseAuxiliaryRoutes();
|
||||
}
|
||||
if (this.peekStartsWith(';')) {
|
||||
// TODO: should these params just be dropped?
|
||||
this.parseMatrixParams();
|
||||
}
|
||||
var child: any /** TODO #9100 */ = null;
|
||||
if (this.peekStartsWith('/') && !this.peekStartsWith('//')) {
|
||||
this.capture('/');
|
||||
child = this.parseSegment();
|
||||
}
|
||||
var queryParams: {[key: string]: any} = null;
|
||||
if (this.peekStartsWith('?')) {
|
||||
queryParams = this.parseQueryParams();
|
||||
}
|
||||
return new RootUrl(path, child, aux, queryParams);
|
||||
}
|
||||
|
||||
// segment + (matrix params) + (aux segments)
|
||||
parseSegment(): Url {
|
||||
if (this._remaining.length == 0) {
|
||||
return null;
|
||||
}
|
||||
if (this.peekStartsWith('/')) {
|
||||
this.capture('/');
|
||||
}
|
||||
var path = matchUrlSegment(this._remaining);
|
||||
this.capture(path);
|
||||
|
||||
var matrixParams: {[key: string]: any} = null;
|
||||
if (this.peekStartsWith(';')) {
|
||||
matrixParams = this.parseMatrixParams();
|
||||
}
|
||||
var aux: Url[] = [];
|
||||
if (this.peekStartsWith('(')) {
|
||||
aux = this.parseAuxiliaryRoutes();
|
||||
}
|
||||
var child: Url = null;
|
||||
if (this.peekStartsWith('/') && !this.peekStartsWith('//')) {
|
||||
this.capture('/');
|
||||
child = this.parseSegment();
|
||||
}
|
||||
return new Url(path, child, aux, matrixParams);
|
||||
}
|
||||
|
||||
parseQueryParams(): {[key: string]: any} {
|
||||
var params: {[key: string]: any} = {};
|
||||
this.capture('?');
|
||||
this.parseQueryParam(params);
|
||||
while (this._remaining.length > 0 && this.peekStartsWith('&')) {
|
||||
this.capture('&');
|
||||
this.parseQueryParam(params);
|
||||
}
|
||||
return params;
|
||||
}
|
||||
|
||||
parseMatrixParams(): {[key: string]: any} {
|
||||
var params: {[key: string]: any} = {};
|
||||
while (this._remaining.length > 0 && this.peekStartsWith(';')) {
|
||||
this.capture(';');
|
||||
this.parseParam(params);
|
||||
}
|
||||
return params;
|
||||
}
|
||||
|
||||
parseParam(params: {[key: string]: any}): void {
|
||||
var key = matchUrlSegment(this._remaining);
|
||||
if (isBlank(key)) {
|
||||
return;
|
||||
}
|
||||
this.capture(key);
|
||||
var value: any = true;
|
||||
if (this.peekStartsWith('=')) {
|
||||
this.capture('=');
|
||||
var valueMatch = matchUrlSegment(this._remaining);
|
||||
if (isPresent(valueMatch)) {
|
||||
value = valueMatch;
|
||||
this.capture(value);
|
||||
}
|
||||
}
|
||||
|
||||
params[key] = value;
|
||||
}
|
||||
|
||||
parseQueryParam(params: {[key: string]: any}): void {
|
||||
var key = matchUrlSegment(this._remaining);
|
||||
if (isBlank(key)) {
|
||||
return;
|
||||
}
|
||||
this.capture(key);
|
||||
var value: any = true;
|
||||
if (this.peekStartsWith('=')) {
|
||||
this.capture('=');
|
||||
var valueMatch = matchUrlQueryParamValue(this._remaining);
|
||||
if (isPresent(valueMatch)) {
|
||||
value = valueMatch;
|
||||
this.capture(value);
|
||||
}
|
||||
}
|
||||
|
||||
params[key] = value;
|
||||
}
|
||||
|
||||
parseAuxiliaryRoutes(): Url[] {
|
||||
var routes: Url[] = [];
|
||||
this.capture('(');
|
||||
|
||||
while (!this.peekStartsWith(')') && this._remaining.length > 0) {
|
||||
routes.push(this.parseSegment());
|
||||
if (this.peekStartsWith('//')) {
|
||||
this.capture('//');
|
||||
}
|
||||
}
|
||||
this.capture(')');
|
||||
|
||||
return routes;
|
||||
}
|
||||
}
|
||||
|
||||
export var parser = new UrlParser();
|
|
@ -1,45 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {StringMapWrapper} from '../src/facade/collection';
|
||||
import {isBlank, isPresent} from '../src/facade/lang';
|
||||
|
||||
export class TouchMap {
|
||||
map: {[key: string]: string} = {};
|
||||
keys: {[key: string]: boolean} = {};
|
||||
|
||||
constructor(map: {[key: string]: any}) {
|
||||
if (isPresent(map)) {
|
||||
StringMapWrapper.forEach(map, (value: any /** TODO #9100 */, key: any /** TODO #9100 */) => {
|
||||
this.map[key] = isPresent(value) ? value.toString() : null;
|
||||
this.keys[key] = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
get(key: string): string {
|
||||
StringMapWrapper.delete(this.keys, key);
|
||||
return this.map[key];
|
||||
}
|
||||
|
||||
getUnused(): {[key: string]: any} {
|
||||
var unused: {[key: string]: any} = {};
|
||||
var keys = StringMapWrapper.keys(this.keys);
|
||||
keys.forEach(key => unused[key] = StringMapWrapper.get(this.map, key));
|
||||
return unused;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export function normalizeString(obj: any): string {
|
||||
if (isBlank(obj)) {
|
||||
return null;
|
||||
} else {
|
||||
return obj.toString();
|
||||
}
|
||||
}
|
|
@ -1,135 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {Component} from '@angular/core';
|
||||
import {TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, expect, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {By} from '@angular/platform-browser/src/dom/debug/by';
|
||||
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
|
||||
import {ComponentInstruction, Route, RouteParams, RouteRegistry, Router, RouterLink, RouterOutlet} from '@angular/router-deprecated';
|
||||
import {ResolvedInstruction} from '@angular/router-deprecated/src/instruction';
|
||||
|
||||
import {SpyLocation, SpyRouter} from '../spies';
|
||||
|
||||
let dummyInstruction = new ResolvedInstruction(
|
||||
new ComponentInstruction('detail', [], null, null, true, '0', null, 'Detail'), null, {});
|
||||
|
||||
export function main() {
|
||||
describe('routerLink directive', function() {
|
||||
var tcb: TestComponentBuilder;
|
||||
|
||||
beforeEachProviders(() => [{provide: Location, useValue: makeDummyLocation()}, {
|
||||
provide: Router,
|
||||
useValue: makeDummyRouter()
|
||||
}]);
|
||||
|
||||
beforeEach(
|
||||
inject([TestComponentBuilder], (tcBuilder: any /** TODO #9100 */) => { tcb = tcBuilder; }));
|
||||
|
||||
it('should update a[href] attribute',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
|
||||
tcb.createAsync(TestComponent).then((testComponent) => {
|
||||
testComponent.detectChanges();
|
||||
let anchorElement =
|
||||
testComponent.debugElement.query(By.css('a.detail-view')).nativeElement;
|
||||
expect(getDOM().getAttribute(anchorElement, 'href')).toEqual('detail');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should call router.navigate when a link is clicked',
|
||||
inject(
|
||||
[AsyncTestCompleter, Router],
|
||||
(async: AsyncTestCompleter, router: any /** TODO #9100 */) => {
|
||||
|
||||
tcb.createAsync(TestComponent).then((testComponent) => {
|
||||
testComponent.detectChanges();
|
||||
// TODO: shouldn't this be just 'click' rather than '^click'?
|
||||
testComponent.debugElement.query(By.css('a.detail-view'))
|
||||
.triggerEventHandler('click', null);
|
||||
expect(router.spy('navigateByInstruction')).toHaveBeenCalledWith(dummyInstruction);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should call router.navigate when a link is clicked if target is _self',
|
||||
inject(
|
||||
[AsyncTestCompleter, Router],
|
||||
(async: AsyncTestCompleter, router: any /** TODO #9100 */) => {
|
||||
|
||||
tcb.createAsync(TestComponent).then((testComponent) => {
|
||||
testComponent.detectChanges();
|
||||
testComponent.debugElement.query(By.css('a.detail-view-self'))
|
||||
.triggerEventHandler('click', null);
|
||||
expect(router.spy('navigateByInstruction')).toHaveBeenCalledWith(dummyInstruction);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should NOT call router.navigate when a link is clicked if target is set to other than _self',
|
||||
inject(
|
||||
[AsyncTestCompleter, Router],
|
||||
(async: AsyncTestCompleter, router: any /** TODO #9100 */) => {
|
||||
|
||||
tcb.createAsync(TestComponent).then((testComponent) => {
|
||||
testComponent.detectChanges();
|
||||
testComponent.debugElement.query(By.css('a.detail-view-blank'))
|
||||
.triggerEventHandler('click', null);
|
||||
expect(router.spy('navigateByInstruction')).not.toHaveBeenCalled();
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
});
|
||||
}
|
||||
|
||||
@Component({selector: 'user-cmp', template: 'hello {{user}}'})
|
||||
class UserCmp {
|
||||
user: string;
|
||||
constructor(params: RouteParams) { this.user = params.get('name'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'test-component',
|
||||
template: `
|
||||
<div>
|
||||
<a [routerLink]="['/Detail']"
|
||||
class="detail-view">
|
||||
detail view
|
||||
</a>
|
||||
<a [routerLink]="['/Detail']"
|
||||
class="detail-view-self"
|
||||
target="_self">
|
||||
detail view with _self target
|
||||
</a>
|
||||
<a [routerLink]="['/Detail']"
|
||||
class="detail-view-blank"
|
||||
target="_blank">
|
||||
detail view with _blank target
|
||||
</a>
|
||||
</div>`,
|
||||
directives: [RouterLink]
|
||||
})
|
||||
class TestComponent {
|
||||
}
|
||||
|
||||
function makeDummyLocation() {
|
||||
var dl = new SpyLocation();
|
||||
dl.spy('prepareExternalUrl').andCallFake((url: any /** TODO #9100 */) => url);
|
||||
return dl;
|
||||
}
|
||||
|
||||
function makeDummyRouter() {
|
||||
var dr = new SpyRouter();
|
||||
dr.spy('generate').andCallFake((routeParams: any /** TODO #9100 */) => dummyInstruction);
|
||||
dr.spy('isRouteActive').andCallFake((_: any /** TODO #9100 */) => false);
|
||||
dr.spy('navigateInstruction');
|
||||
return dr;
|
||||
}
|
|
@ -1,9 +0,0 @@
|
|||
# Router integration tests
|
||||
|
||||
These tests only mock out `Location`, and otherwise use all the real parts of routing to ensure that
|
||||
various routing scenarios work as expected.
|
||||
|
||||
The Component Router in Angular 2 exposes only a handful of different options, but because they can
|
||||
be combined and nested in so many ways, it's difficult to rigorously test all the cases.
|
||||
|
||||
The address this problem, we introduce `describeRouter`, `describeWith`, and `describeWithout`.
|
|
@ -1,36 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {beforeEachProviders, describe} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {registerSpecs} from './impl/async_route_spec_impl';
|
||||
import {TEST_ROUTER_PROVIDERS, ddescribeRouter, describeRouter, describeWith, describeWithAndWithout, describeWithout, itShouldRoute} from './util';
|
||||
|
||||
export function main() {
|
||||
describe('async route spec', () => {
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
registerSpecs();
|
||||
|
||||
describeRouter('async routes', () => {
|
||||
describeWithout('children', () => {
|
||||
describeWith('route data', itShouldRoute);
|
||||
describeWithAndWithout('params', itShouldRoute);
|
||||
});
|
||||
|
||||
describeWith(
|
||||
'sync children', () => { describeWithAndWithout('default routes', itShouldRoute); });
|
||||
|
||||
describeWith('async children', () => {
|
||||
describeWithAndWithout(
|
||||
'params', () => { describeWithout('default routes', itShouldRoute); });
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,26 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {beforeEachProviders, describe} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {registerSpecs} from './impl/aux_route_spec_impl';
|
||||
import {TEST_ROUTER_PROVIDERS, ddescribeRouter, describeRouter, describeWith, describeWithAndWithout, describeWithout, itShouldRoute} from './util';
|
||||
|
||||
export function main() {
|
||||
describe('auxiliary route spec', () => {
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
registerSpecs();
|
||||
|
||||
describeRouter('aux routes', () => {
|
||||
itShouldRoute();
|
||||
describeWith('a primary route', itShouldRoute);
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,347 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF, LocationStrategy} from '@angular/common';
|
||||
import {MockLocationStrategy} from '@angular/common/testing/mock_location_strategy';
|
||||
import {disposePlatform} from '@angular/core';
|
||||
import {ApplicationRef} from '@angular/core/src/application_ref';
|
||||
import {Console} from '@angular/core/src/console';
|
||||
import {Component} from '@angular/core/src/metadata';
|
||||
import {TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, MockApplicationRef, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
|
||||
import {DOCUMENT} from '@angular/platform-browser/src/dom/dom_tokens';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {ROUTER_DIRECTIVES, ROUTER_PRIMARY_COMPONENT, ROUTER_PROVIDERS, RouteParams, Router} from '@angular/router-deprecated';
|
||||
import {BaseException} from '../../src/facade/exceptions';
|
||||
import {AuxRoute, Route, RouteConfig} from '../../src/route_config/route_config_decorator';
|
||||
|
||||
|
||||
|
||||
// noinspection JSAnnotator
|
||||
class DummyConsole implements Console {
|
||||
log(message: any /** TODO #9100 */) {}
|
||||
warn(message: any /** TODO #9100 */) {}
|
||||
}
|
||||
|
||||
export function main() {
|
||||
describe('router bootstrap', () => {
|
||||
beforeEachProviders(
|
||||
() => [ROUTER_PROVIDERS, {provide: LocationStrategy, useClass: MockLocationStrategy}, {
|
||||
provide: ApplicationRef,
|
||||
useClass: MockApplicationRef
|
||||
}]);
|
||||
|
||||
beforeEach(() => disposePlatform());
|
||||
afterEach(() => disposePlatform());
|
||||
|
||||
// do not refactor out the `bootstrap` functionality. We still want to
|
||||
// keep this test around so we can ensure that bootstrap a router works
|
||||
it('should bootstrap a simple app',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var fakeDoc = getDOM().createHtmlDocument();
|
||||
var el = getDOM().createElement('app-cmp', fakeDoc);
|
||||
getDOM().appendChild(fakeDoc.body, el);
|
||||
|
||||
bootstrap(AppCmp, [
|
||||
ROUTER_PROVIDERS, {provide: ROUTER_PRIMARY_COMPONENT, useValue: AppCmp},
|
||||
{provide: LocationStrategy, useClass: MockLocationStrategy},
|
||||
{provide: DOCUMENT, useValue: fakeDoc}, {provide: Console, useClass: DummyConsole}
|
||||
]).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('outer [ hello ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('');
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
describe('broken app', () => {
|
||||
beforeEachProviders(() => [{provide: ROUTER_PRIMARY_COMPONENT, useValue: BrokenAppCmp}]);
|
||||
|
||||
it('should rethrow exceptions from component constructors',
|
||||
inject(
|
||||
[AsyncTestCompleter, TestComponentBuilder],
|
||||
(async: AsyncTestCompleter, tcb: TestComponentBuilder) => {
|
||||
tcb.createAsync(AppCmp).then((fixture) => {
|
||||
var router = fixture.debugElement.componentInstance.router;
|
||||
router.navigateByUrl('/cause-error').catch((error: any) => {
|
||||
expect(error).toContainError('oops!');
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
});
|
||||
|
||||
describe('back button app', () => {
|
||||
beforeEachProviders(() => [{provide: ROUTER_PRIMARY_COMPONENT, useValue: HierarchyAppCmp}]);
|
||||
|
||||
it('should change the url without pushing a new history state for back navigations',
|
||||
inject(
|
||||
[AsyncTestCompleter, TestComponentBuilder],
|
||||
(async: AsyncTestCompleter, tcb: TestComponentBuilder) => {
|
||||
|
||||
tcb.createAsync(HierarchyAppCmp).then((fixture) => {
|
||||
var router = fixture.debugElement.componentInstance.router;
|
||||
var position = 0;
|
||||
var flipped = false;
|
||||
var history = [
|
||||
['/parent/child', 'root [ parent [ hello ] ]', '/super-parent/child'],
|
||||
['/super-parent/child', 'root [ super-parent [ hello2 ] ]', '/parent/child'],
|
||||
['/parent/child', 'root [ parent [ hello ] ]', false]
|
||||
];
|
||||
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
var location = fixture.debugElement.componentInstance.location;
|
||||
var element = fixture.debugElement.nativeElement;
|
||||
var path = location.path();
|
||||
|
||||
var entry = history[position];
|
||||
|
||||
expect(path).toEqual(entry[0]);
|
||||
// expect(element).toHaveText(entry[1]);
|
||||
|
||||
var nextUrl = entry[2];
|
||||
if (nextUrl == false) {
|
||||
flipped = true;
|
||||
}
|
||||
|
||||
if (flipped && position == 0) {
|
||||
async.done();
|
||||
return;
|
||||
}
|
||||
|
||||
position = position + (flipped ? -1 : 1);
|
||||
if (flipped) {
|
||||
location.back();
|
||||
} else {
|
||||
router.navigateByUrl(nextUrl);
|
||||
}
|
||||
});
|
||||
|
||||
router.navigateByUrl(history[0][0]);
|
||||
});
|
||||
}),
|
||||
1000);
|
||||
});
|
||||
|
||||
describe('hierarchical app', () => {
|
||||
beforeEachProviders(
|
||||
() => { return [{provide: ROUTER_PRIMARY_COMPONENT, useValue: HierarchyAppCmp}]; });
|
||||
|
||||
it('should bootstrap an app with a hierarchy',
|
||||
inject(
|
||||
[AsyncTestCompleter, TestComponentBuilder],
|
||||
(async: AsyncTestCompleter, tcb: TestComponentBuilder) => {
|
||||
|
||||
tcb.createAsync(HierarchyAppCmp).then((fixture) => {
|
||||
var router = fixture.debugElement.componentInstance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('root [ parent [ hello ] ]');
|
||||
expect(fixture.debugElement.componentInstance.location.path())
|
||||
.toEqual('/parent/child');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/parent/child');
|
||||
});
|
||||
}));
|
||||
|
||||
// TODO(btford): mock out level lower than LocationStrategy once that level exists
|
||||
xdescribe('custom app base ref', () => {
|
||||
beforeEachProviders(() => { return [{provide: APP_BASE_HREF, useValue: '/my/app'}]; });
|
||||
it('should bootstrap',
|
||||
inject(
|
||||
[AsyncTestCompleter, TestComponentBuilder],
|
||||
(async: AsyncTestCompleter, tcb: TestComponentBuilder) => {
|
||||
|
||||
tcb.createAsync(HierarchyAppCmp).then((fixture) => {
|
||||
var router = fixture.debugElement.componentInstance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('root [ parent [ hello ] ]');
|
||||
expect(fixture.debugElement.componentInstance.location.path())
|
||||
.toEqual('/my/app/parent/child');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/parent/child');
|
||||
});
|
||||
}));
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
describe('querystring params app', () => {
|
||||
beforeEachProviders(
|
||||
() => { return [{provide: ROUTER_PRIMARY_COMPONENT, useValue: QueryStringAppCmp}]; });
|
||||
|
||||
it('should recognize and return querystring params with the injected RouteParams',
|
||||
inject(
|
||||
[AsyncTestCompleter, TestComponentBuilder],
|
||||
(async: AsyncTestCompleter, tcb: TestComponentBuilder) => {
|
||||
tcb.createAsync(QueryStringAppCmp).then((fixture) => {
|
||||
var router = fixture.debugElement.componentInstance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('qParam = search-for-something');
|
||||
/*
|
||||
expect(applicationRef.hostComponent.location.path())
|
||||
.toEqual('/qs?q=search-for-something');*/
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/qs?q=search-for-something');
|
||||
fixture.detectChanges();
|
||||
});
|
||||
}));
|
||||
});
|
||||
|
||||
describe('activate event on outlet', () => {
|
||||
let tcb: TestComponentBuilder = null;
|
||||
|
||||
beforeEachProviders(() => [{provide: ROUTER_PRIMARY_COMPONENT, useValue: AppCmp}]);
|
||||
|
||||
beforeEach(inject([TestComponentBuilder], (testComponentBuilder: any /** TODO #9100 */) => {
|
||||
tcb = testComponentBuilder;
|
||||
}));
|
||||
|
||||
it('should get a reference and pass data to components loaded inside of outlets',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
tcb.createAsync(AppWithOutletListeners).then(fixture => {
|
||||
let appInstance = fixture.debugElement.componentInstance;
|
||||
let router = appInstance.router;
|
||||
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(appInstance.helloCmp).toBeAnInstanceOf(HelloCmp);
|
||||
expect(appInstance.helloCmp.message).toBe('Ahoy');
|
||||
|
||||
async.done();
|
||||
});
|
||||
|
||||
// TODO(juliemr): This isn't necessary for the test to pass - figure
|
||||
// out what's going on.
|
||||
// router.navigateByUrl('/rainbow(pony)');
|
||||
});
|
||||
}));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'hello-cmp', template: 'hello'})
|
||||
class HelloCmp {
|
||||
public message: string;
|
||||
}
|
||||
|
||||
@Component({selector: 'hello2-cmp', template: 'hello2'})
|
||||
class Hello2Cmp {
|
||||
public greeting: string;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `outer [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/', component: HelloCmp})])
|
||||
class AppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `
|
||||
Hello routing!
|
||||
<router-outlet (activate)="activateHello($event)"></router-outlet>
|
||||
<router-outlet (activate)="activateHello2($event)" name="pony"></router-outlet>`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/rainbow', component: HelloCmp}),
|
||||
new AuxRoute({name: 'pony', path: 'pony', component: Hello2Cmp})
|
||||
])
|
||||
class AppWithOutletListeners {
|
||||
helloCmp: HelloCmp;
|
||||
hello2Cmp: Hello2Cmp;
|
||||
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
|
||||
activateHello(cmp: HelloCmp) {
|
||||
this.helloCmp = cmp;
|
||||
this.helloCmp.message = 'Ahoy';
|
||||
}
|
||||
|
||||
activateHello2(cmp: Hello2Cmp) { this.hello2Cmp = cmp; }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `parent [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/child', component: HelloCmp})])
|
||||
class ParentCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'super-parent-cmp',
|
||||
template: `super-parent [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/child', component: Hello2Cmp})])
|
||||
class SuperParentCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/parent/...', component: ParentCmp}),
|
||||
new Route({path: '/super-parent/...', component: SuperParentCmp})
|
||||
])
|
||||
class HierarchyAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({selector: 'qs-cmp', template: `qParam = {{q}}`})
|
||||
class QSCmp {
|
||||
q: string;
|
||||
constructor(params: RouteParams) { this.q = params.get('q'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `<router-outlet></router-outlet>`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/qs', component: QSCmp})])
|
||||
class QueryStringAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({selector: 'oops-cmp', template: 'oh no'})
|
||||
class BrokenCmp {
|
||||
constructor() { throw new BaseException('oops!'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `outer [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/cause-error', component: BrokenCmp})])
|
||||
class BrokenAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
|
@ -1,677 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, iit, inject, it, xit} from '@angular/core/testing/testing_internal';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {AsyncRoute, Route, Router} from '@angular/router-deprecated';
|
||||
|
||||
import {By} from '../../../../platform-browser/src/dom/debug/by';
|
||||
import {TEST_ROUTER_PROVIDERS, clickOnElement, compile, getHref, specs} from '../util';
|
||||
|
||||
import {HelloCmp, ParentCmp, ParentWithDefaultCmp, TeamCmp, UserCmp, asyncDefaultParentCmpLoader, asyncParentCmpLoader, asyncRouteDataCmp, asyncTeamLoader, helloCmpLoader, parentCmpLoader, parentWithDefaultCmpLoader, userCmpLoader} from './fixture_components';
|
||||
|
||||
function getLinkElement(rtc: ComponentFixture<any>) {
|
||||
return rtc.debugElement.query(By.css('a')).nativeElement;
|
||||
}
|
||||
|
||||
function asyncRoutesWithoutChildrenWithRouteData() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should inject route data into the component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/route-data', loader: asyncRouteDataCmp, data: {isAdmin: true}})]))
|
||||
.then((_) => rtr.navigateByUrl('/route-data'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('true');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should inject empty object if the route has no data property',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/route-data-default', loader: asyncRouteDataCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/route-data-default'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
function asyncRoutesWithoutChildrenWithoutParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/test', loader: helloCmpLoader, name: 'Hello'})]))
|
||||
.then((_) => rtr.navigateByUrl('/test'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/test', loader: helloCmpLoader, name: 'Hello'})]))
|
||||
.then((_) => rtr.navigate(['/Hello']))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `<a [routerLink]="['Hello']">go to hello</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/test', loader: helloCmpLoader, name: 'Hello'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/test');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb, `<a [routerLink]="['Hello']">go to hello</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/test', loader: helloCmpLoader, name: 'Hello'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('go to hello | ');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('go to hello | hello');
|
||||
expect(location.urlChanges).toEqual(['/test']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function asyncRoutesWithoutChildrenWithParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/user/:name', loader: userCmpLoader, name: 'User'})]))
|
||||
.then((_) => rtr.navigateByUrl('/user/igor'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello igor');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => rtr.navigate(['/User', {name: 'brian'}]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello brian');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['User', {name: 'naomi'}]">greet naomi</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/user/:name', loader: userCmpLoader, name: 'User'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/user/naomi');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['User', {name: 'naomi'}]">greet naomi</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/user/:name', loader: userCmpLoader, name: 'User'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('greet naomi | ');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('greet naomi | hello naomi');
|
||||
expect(location.urlChanges).toEqual(['/user/naomi']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate between components with different parameters',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/user/:name', loader: userCmpLoader, name: 'User'})]))
|
||||
.then((_) => rtr.navigateByUrl('/user/brian'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello brian');
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/user/igor'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello igor');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function asyncRoutesWithSyncChildrenWithoutDefaultRoutes() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigate(['/Parent', 'Child']))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/a');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent', 'Child']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('nav to child | outer [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('nav to child | outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/a/b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function asyncRoutesWithSyncChildrenWithDefaultRoutes() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentWithDefaultCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentWithDefaultCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigate(['/Parent']))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Parent']">link to inner</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentWithDefaultCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/a');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Parent']">link to inner</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: parentWithDefaultCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('link to inner | outer [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('link to inner | outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/a/b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function asyncRoutesWithAsyncChildrenWithoutParamsWithoutDefaultRoutes() {
|
||||
var rootTC: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigate(['/Parent', 'Child']))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent', 'Child']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(getHref(getLinkElement(rootTC))).toEqual('/a');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent', 'Child']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('nav to child | outer [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement)
|
||||
.toHaveText('nav to child | outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/a/b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(rootTC));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function asyncRoutesWithAsyncChildrenWithoutParamsWithDefaultRoutes() {
|
||||
var rootTC: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncDefaultParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncDefaultParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigate(['/Parent']))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncDefaultParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(getHref(getLinkElement(rootTC))).toEqual('/a');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/a/...', loader: asyncDefaultParentCmpLoader, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('nav to child | outer [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement)
|
||||
.toHaveText('nav to child | outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/a/b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(rootTC));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function asyncRoutesWithAsyncChildrenWithParamsWithoutDefaultRoutes() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `[ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/team/:id/...', loader: asyncTeamLoader, name: 'Team'})]))
|
||||
.then((_) => rtr.navigateByUrl('/team/angular/user/matias'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('[ team angular | user [ hello matias ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `[ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/team/:id/...', loader: asyncTeamLoader, name: 'Team'})]))
|
||||
.then((_) => rtr.navigate(['/Team', {id: 'angular'}, 'User', {name: 'matias'}]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('[ team angular | user [ hello matias ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Team', {id: 'angular'}, 'User', {name: 'matias'}]">nav to matias</a> [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/team/:id/...', loader: asyncTeamLoader, name: 'Team'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/team/angular');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Team', {id: 'angular'}, 'User', {name: 'matias'}]">nav to matias</a> [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/team/:id/...', loader: asyncTeamLoader, name: 'Team'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('nav to matias [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('nav to matias [ team angular | user [ hello matias ] ]');
|
||||
expect(location.urlChanges).toEqual(['/team/angular/user/matias']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
export function registerSpecs() {
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithoutChildrenWithRouteData'] =
|
||||
asyncRoutesWithoutChildrenWithRouteData;
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithoutChildrenWithoutParams'] =
|
||||
asyncRoutesWithoutChildrenWithoutParams;
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithoutChildrenWithParams'] =
|
||||
asyncRoutesWithoutChildrenWithParams;
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithSyncChildrenWithoutDefaultRoutes'] =
|
||||
asyncRoutesWithSyncChildrenWithoutDefaultRoutes;
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithSyncChildrenWithDefaultRoutes'] =
|
||||
asyncRoutesWithSyncChildrenWithDefaultRoutes;
|
||||
(specs as
|
||||
any /** TODO #9100 */)['asyncRoutesWithAsyncChildrenWithoutParamsWithoutDefaultRoutes'] =
|
||||
asyncRoutesWithAsyncChildrenWithoutParamsWithoutDefaultRoutes;
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithAsyncChildrenWithoutParamsWithDefaultRoutes'] =
|
||||
asyncRoutesWithAsyncChildrenWithoutParamsWithDefaultRoutes;
|
||||
(specs as any /** TODO #9100 */)['asyncRoutesWithAsyncChildrenWithParamsWithoutDefaultRoutes'] =
|
||||
asyncRoutesWithAsyncChildrenWithParamsWithoutDefaultRoutes;
|
||||
}
|
|
@ -1,258 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {Component} from '@angular/core';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {By} from '@angular/platform-browser/src/dom/debug/by';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {AuxRoute, ROUTER_DIRECTIVES, Route, RouteConfig, Router} from '@angular/router-deprecated';
|
||||
|
||||
import {BaseException} from '../../../src/facade/exceptions';
|
||||
import {clickOnElement, compile, getHref, specs} from '../util';
|
||||
|
||||
function getLinkElement(rtc: ComponentFixture<any>, linkIndex: number = 0) {
|
||||
return rtc.debugElement.queryAll(By.css('a'))[linkIndex].nativeElement;
|
||||
}
|
||||
|
||||
function auxRoutes() {
|
||||
var tcb: TestComponentBuilder;
|
||||
var fixture: ComponentFixture<any>;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should recognize and navigate from the URL',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Aux'})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/(modal)'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('main [] | aux [modal]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate via the link DSL',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Modal'})
|
||||
]))
|
||||
.then((_) => rtr.navigate(['/', ['Modal']]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('main [] | aux [modal]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/', ['Modal']]">open modal</a> | main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Modal'})
|
||||
]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/(modal)');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/', ['Modal']]">open modal</a> | <a [routerLink]="['/Hello']">hello</a> | main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Modal'})
|
||||
]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('open modal | hello | main [] | aux []');
|
||||
|
||||
var navCount = 0;
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
navCount += 1;
|
||||
fixture.detectChanges();
|
||||
if (navCount == 1) {
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('open modal | hello | main [] | aux [modal]');
|
||||
expect(location.urlChanges).toEqual(['/(modal)']);
|
||||
expect(getHref(getLinkElement(fixture, 0))).toEqual('/(modal)');
|
||||
expect(getHref(getLinkElement(fixture, 1))).toEqual('/hello(modal)');
|
||||
|
||||
// click on primary route link
|
||||
clickOnElement(getLinkElement(fixture, 1));
|
||||
} else if (navCount == 2) {
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('open modal | hello | main [hello] | aux [modal]');
|
||||
expect(location.urlChanges).toEqual(['/(modal)', '/hello(modal)']);
|
||||
expect(getHref(getLinkElement(fixture, 0))).toEqual('/hello(modal)');
|
||||
expect(getHref(getLinkElement(fixture, 1))).toEqual('/hello(modal)');
|
||||
async.done();
|
||||
} else {
|
||||
throw new BaseException(`Unexpected route change #${navCount}`);
|
||||
}
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function auxRoutesWithAPrimaryRoute() {
|
||||
var tcb: TestComponentBuilder;
|
||||
var fixture: ComponentFixture<any>;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should recognize and navigate from the URL',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Aux'})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/hello(modal)'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('main [hello] | aux [modal]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate via the link DSL',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Modal'})
|
||||
]))
|
||||
.then((_) => rtr.navigate(['/Hello', ['Modal']]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('main [hello] | aux [modal]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Hello', ['Modal']]">open modal</a> | main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Modal'})
|
||||
]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/hello(modal)');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Hello', ['Modal']]">open modal</a> | main [<router-outlet></router-outlet>] | aux [<router-outlet name="modal"></router-outlet>]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Modal'})
|
||||
]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('open modal | main [] | aux []');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('open modal | main [hello] | aux [modal]');
|
||||
expect(location.urlChanges).toEqual(['/hello(modal)']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
export function registerSpecs() {
|
||||
(specs as any /** TODO #9100 */)['auxRoutes'] = auxRoutes;
|
||||
(specs as any /** TODO #9100 */)['auxRoutesWithAPrimaryRoute'] = auxRoutesWithAPrimaryRoute;
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'hello-cmp', template: `{{greeting}}`})
|
||||
class HelloCmp {
|
||||
greeting: string;
|
||||
constructor() { this.greeting = 'hello'; }
|
||||
}
|
||||
|
||||
@Component({selector: 'modal-cmp', template: `modal`})
|
||||
class ModalCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'aux-cmp',
|
||||
template: 'main [<router-outlet></router-outlet>] | ' +
|
||||
'aux [<router-outlet name="modal"></router-outlet>]',
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/hello', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/modal', component: ModalCmp, name: 'Aux'})
|
||||
])
|
||||
class AuxCmp {
|
||||
}
|
|
@ -1,168 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Component, ComponentRef, ViewChild, ViewContainerRef} from '@angular/core';
|
||||
import {DynamicComponentLoader} from '@angular/core/src/linker/dynamic_component_loader';
|
||||
import {AsyncRoute, ROUTER_DIRECTIVES, Redirect, Route, RouteConfig, RouteData, RouteParams} from '@angular/router-deprecated';
|
||||
import {isPresent} from '../../../src/facade/lang';
|
||||
|
||||
@Component({selector: 'goodbye-cmp', template: `{{farewell}}`})
|
||||
export class GoodbyeCmp {
|
||||
farewell: string;
|
||||
constructor() { this.farewell = 'goodbye'; }
|
||||
}
|
||||
|
||||
@Component({selector: 'hello-cmp', template: `{{greeting}}`})
|
||||
export class HelloCmp {
|
||||
greeting: string;
|
||||
constructor() { this.greeting = 'hello'; }
|
||||
}
|
||||
|
||||
export function helloCmpLoader() {
|
||||
return Promise.resolve(HelloCmp);
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'user-cmp', template: `hello {{user}}`})
|
||||
export class UserCmp {
|
||||
user: string;
|
||||
constructor(params: RouteParams) { this.user = params.get('name'); }
|
||||
}
|
||||
|
||||
export function userCmpLoader() {
|
||||
return Promise.resolve(UserCmp);
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `inner [ <router-outlet></router-outlet> ]`,
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig([new Route({path: '/b', component: HelloCmp, name: 'Child'})])
|
||||
export class ParentCmp {
|
||||
}
|
||||
|
||||
export function parentCmpLoader() {
|
||||
return Promise.resolve(ParentCmp);
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `inner [ <router-outlet></router-outlet> ]`,
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig([new AsyncRoute({path: '/b', loader: helloCmpLoader, name: 'Child'})])
|
||||
export class AsyncParentCmp {
|
||||
}
|
||||
|
||||
export function asyncParentCmpLoader() {
|
||||
return Promise.resolve(AsyncParentCmp);
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `inner [ <router-outlet></router-outlet> ]`,
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig(
|
||||
[new AsyncRoute({path: '/b', loader: helloCmpLoader, name: 'Child', useAsDefault: true})])
|
||||
export class AsyncDefaultParentCmp {
|
||||
}
|
||||
|
||||
export function asyncDefaultParentCmpLoader() {
|
||||
return Promise.resolve(AsyncDefaultParentCmp);
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `inner [ <router-outlet></router-outlet> ]`,
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig([new Route({path: '/b', component: HelloCmp, name: 'Child', useAsDefault: true})])
|
||||
export class ParentWithDefaultCmp {
|
||||
}
|
||||
|
||||
export function parentWithDefaultCmpLoader() {
|
||||
return Promise.resolve(ParentWithDefaultCmp);
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'team-cmp',
|
||||
template: `team {{id}} | user [ <router-outlet></router-outlet> ]`,
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig([new Route({path: '/user/:name', component: UserCmp, name: 'User'})])
|
||||
export class TeamCmp {
|
||||
id: string;
|
||||
constructor(params: RouteParams) { this.id = params.get('id'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'team-cmp',
|
||||
template: `team {{id}} | user [ <router-outlet></router-outlet> ]`,
|
||||
directives: [ROUTER_DIRECTIVES],
|
||||
})
|
||||
@RouteConfig([new AsyncRoute({path: '/user/:name', loader: userCmpLoader, name: 'User'})])
|
||||
export class AsyncTeamCmp {
|
||||
id: string;
|
||||
constructor(params: RouteParams) { this.id = params.get('id'); }
|
||||
}
|
||||
|
||||
export function asyncTeamLoader() {
|
||||
return Promise.resolve(AsyncTeamCmp);
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'data-cmp', template: `{{myData}}`})
|
||||
export class RouteDataCmp {
|
||||
myData: boolean;
|
||||
constructor(data: RouteData) { this.myData = data.get('isAdmin'); }
|
||||
}
|
||||
|
||||
export function asyncRouteDataCmp() {
|
||||
return Promise.resolve(RouteDataCmp);
|
||||
}
|
||||
|
||||
@Component({selector: 'redirect-to-parent-cmp', template: 'redirect-to-parent'})
|
||||
@RouteConfig([new Redirect({path: '/child-redirect', redirectTo: ['../HelloSib']})])
|
||||
export class RedirectToParentCmp {
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'dynamic-loader-cmp', template: `[ <div #viewport></div> ]`})
|
||||
@RouteConfig([new Route({path: '/', component: HelloCmp})])
|
||||
export class DynamicLoaderCmp {
|
||||
private _componentRef: ComponentRef<any> = null;
|
||||
|
||||
@ViewChild('viewport', {read: ViewContainerRef}) viewport: ViewContainerRef;
|
||||
|
||||
constructor(private _dynamicComponentLoader: DynamicComponentLoader) {}
|
||||
|
||||
onSomeAction(): Promise<any> {
|
||||
if (isPresent(this._componentRef)) {
|
||||
this._componentRef.destroy();
|
||||
this._componentRef = null;
|
||||
}
|
||||
return this._dynamicComponentLoader
|
||||
.loadNextToLocation(DynamicallyLoadedComponent, this.viewport)
|
||||
.then((cmp) => { this._componentRef = cmp; });
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'loaded-cmp',
|
||||
template: '<router-outlet></router-outlet>',
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
class DynamicallyLoadedComponent {
|
||||
}
|
|
@ -1,523 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, iit, inject, it, xit} from '@angular/core/testing/testing_internal';
|
||||
import {By} from '@angular/platform-browser/src/dom/debug/by';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {Route, Router} from '@angular/router-deprecated';
|
||||
import {TEST_ROUTER_PROVIDERS, clickOnElement, compile, getHref, specs} from '../util';
|
||||
|
||||
import {DynamicLoaderCmp, HelloCmp, ParentCmp, ParentWithDefaultCmp, TeamCmp, UserCmp} from './fixture_components';
|
||||
|
||||
|
||||
function getLinkElement(rtc: ComponentFixture<any>) {
|
||||
return rtc.debugElement.query(By.css('a')).nativeElement;
|
||||
}
|
||||
|
||||
function syncRoutesWithoutChildrenWithoutParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) => rtr.config([new Route({path: '/test', component: HelloCmp, name: 'Hello'})]))
|
||||
.then((_) => rtr.navigateByUrl('/test'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) => rtr.config([new Route({path: '/test', component: HelloCmp, name: 'Hello'})]))
|
||||
.then((_) => rtr.navigate(['/Hello']))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `<a [routerLink]="['Hello']">go to hello</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) => rtr.config([new Route({path: '/test', component: HelloCmp, name: 'Hello'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/test');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb, `<a [routerLink]="['Hello']">go to hello</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/test', component: HelloCmp, name: 'Hello'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('go to hello | ');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('go to hello | hello');
|
||||
expect(location.urlChanges).toEqual(['/test']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function syncRoutesWithoutChildrenWithParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => rtr.navigateByUrl('/user/igor'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello igor');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => rtr.navigate(['/User', {name: 'brian'}]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello brian');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['User', {name: 'naomi'}]">greet naomi</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/user/naomi');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['User', {name: 'naomi'}]">greet naomi</a> | <router-outlet></router-outlet>`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('greet naomi | ');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('greet naomi | hello naomi');
|
||||
expect(location.urlChanges).toEqual(['/user/naomi']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate between components with different parameters',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => rtr.navigateByUrl('/user/brian'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello brian');
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/user/igor'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello igor');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function syncRoutesWithSyncChildrenWithoutDefaultRoutesWithoutParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/a/...', component: ParentCmp, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/a/...', component: ParentCmp, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigate(['/Parent', 'Child']))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent', 'Child']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then(
|
||||
(_) =>
|
||||
rtr.config([new Route({path: '/a/...', component: ParentCmp, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/a/b');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['Parent', 'Child']">nav to child</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/a/...', component: ParentCmp, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('nav to child | outer [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('nav to child | outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/a/b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function syncRoutesWithSyncChildrenWithoutDefaultRoutesWithParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `[ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/team/:id/...', component: TeamCmp, name: 'Team'})]))
|
||||
.then((_) => rtr.navigateByUrl('/team/angular/user/matias'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('[ team angular | user [ hello matias ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `[ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/team/:id/...', component: TeamCmp, name: 'Team'})]))
|
||||
.then((_) => rtr.navigate(['/Team', {id: 'angular'}, 'User', {name: 'matias'}]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('[ team angular | user [ hello matias ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Team', {id: 'angular'}, 'User', {name: 'matias'}]">nav to matias</a> [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/team/:id/...', component: TeamCmp, name: 'Team'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/team/angular/user/matias');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Team', {id: 'angular'}, 'User', {name: 'matias'}]">nav to matias</a> [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/team/:id/...', component: TeamCmp, name: 'Team'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('nav to matias [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('nav to matias [ team angular | user [ hello matias ] ]');
|
||||
expect(location.urlChanges).toEqual(['/team/angular/user/matias']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function syncRoutesWithSyncChildrenWithDefaultRoutesWithoutParams() {
|
||||
var fixture: any /** TODO #9100 */;
|
||||
var tcb: any /** TODO #9100 */;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
it('should navigate by URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/a/...', component: ParentWithDefaultCmp, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate by link DSL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, `outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/a/...', component: ParentWithDefaultCmp, name: 'Parent'})]))
|
||||
.then((_) => rtr.navigate(['/Parent']))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate a link URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Parent']">link to inner</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/a/...', component: ParentWithDefaultCmp, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(getLinkElement(fixture))).toEqual('/a');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate from a link click',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(
|
||||
tcb,
|
||||
`<a [routerLink]="['/Parent']">link to inner</a> | outer [ <router-outlet></router-outlet> ]`)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/a/...', component: ParentWithDefaultCmp, name: 'Parent'})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('link to inner | outer [ ]');
|
||||
|
||||
rtr.subscribe((_: any /** TODO #9100 */) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('link to inner | outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/a/b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
clickOnElement(getLinkElement(fixture));
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
function syncRoutesWithDynamicComponents() {
|
||||
var fixture: ComponentFixture<any>;
|
||||
var tcb: TestComponentBuilder;
|
||||
var rtr: Router;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
}));
|
||||
|
||||
|
||||
it('should work', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
tcb.createAsync(DynamicLoaderCmp)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/', component: HelloCmp})]))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('[ ]');
|
||||
return fixture.componentInstance.onSomeAction();
|
||||
})
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
return rtr.navigateByUrl('/');
|
||||
})
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('[ hello ]');
|
||||
|
||||
return fixture.componentInstance.onSomeAction();
|
||||
})
|
||||
.then((_) => {
|
||||
|
||||
// TODO(i): This should be rewritten to use NgZone#onStable or
|
||||
// something
|
||||
// similar basically the assertion needs to run when the world is
|
||||
// stable and we don't know when that is, only zones know.
|
||||
Promise.resolve(null).then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('[ hello ]');
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function registerSpecs() {
|
||||
(specs as any /** TODO #9100 */)['syncRoutesWithoutChildrenWithoutParams'] =
|
||||
syncRoutesWithoutChildrenWithoutParams;
|
||||
(specs as any /** TODO #9100 */)['syncRoutesWithoutChildrenWithParams'] =
|
||||
syncRoutesWithoutChildrenWithParams;
|
||||
(specs as any /** TODO #9100 */)['syncRoutesWithSyncChildrenWithoutDefaultRoutesWithoutParams'] =
|
||||
syncRoutesWithSyncChildrenWithoutDefaultRoutesWithoutParams;
|
||||
(specs as any /** TODO #9100 */)['syncRoutesWithSyncChildrenWithoutDefaultRoutesWithParams'] =
|
||||
syncRoutesWithSyncChildrenWithoutDefaultRoutesWithParams;
|
||||
(specs as any /** TODO #9100 */)['syncRoutesWithSyncChildrenWithDefaultRoutesWithoutParams'] =
|
||||
syncRoutesWithSyncChildrenWithDefaultRoutesWithoutParams;
|
||||
(specs as any /** TODO #9100 */)['syncRoutesWithDynamicComponents'] =
|
||||
syncRoutesWithDynamicComponents;
|
||||
}
|
|
@ -1,617 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Component} from '@angular/core';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {RouteParams, Router, RouterLink, RouterOutlet} from '@angular/router-deprecated';
|
||||
|
||||
import {EventEmitter} from '../../src/facade/async';
|
||||
import {isPresent} from '../../src/facade/lang';
|
||||
import {ComponentInstruction} from '../../src/instruction';
|
||||
import {CanDeactivate, CanReuse, OnActivate, OnDeactivate, OnReuse} from '../../src/interfaces';
|
||||
import {CanActivate} from '../../src/lifecycle/lifecycle_annotations';
|
||||
import {AsyncRoute, AuxRoute, Redirect, Route, RouteConfig} from '../../src/route_config/route_config_decorator';
|
||||
|
||||
import {TEST_ROUTER_PROVIDERS, compile} from './util';
|
||||
|
||||
var cmpInstanceCount: any /** TODO #9100 */;
|
||||
var log: string[];
|
||||
var eventBus: EventEmitter<any>;
|
||||
var resolve: (result: any) => void;
|
||||
var reject: (error: any) => void;
|
||||
var promise: Promise<any>;
|
||||
|
||||
export function main() {
|
||||
describe('Router lifecycle hooks', () => {
|
||||
|
||||
var tcb: TestComponentBuilder;
|
||||
var fixture: ComponentFixture<any>;
|
||||
var rtr: Router;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router], (tcBuilder: TestComponentBuilder, router: Router) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
cmpInstanceCount = 0;
|
||||
log = [];
|
||||
eventBus = new EventEmitter();
|
||||
}));
|
||||
|
||||
it('should call the routerOnActivate hook',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/on-activate'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('activate cmp');
|
||||
expect(log).toEqual(['activate: null -> /on-activate']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should wait for a parent component\'s routerOnActivate hook to resolve before calling its child\'s',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => {
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('parent activate')) {
|
||||
resolve(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
rtr.navigateByUrl('/parent-activate/child-activate').then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('parent [activate cmp]');
|
||||
expect(log).toEqual([
|
||||
'parent activate: null -> /parent-activate', 'activate: null -> /child-activate'
|
||||
]);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should call the routerOnDeactivate hook',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/on-deactivate'))
|
||||
.then((_) => rtr.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('A');
|
||||
expect(log).toEqual(['deactivate: /on-deactivate -> /a']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should wait for a child component\'s routerOnDeactivate hook to resolve before calling its parent\'s',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/parent-deactivate/child-deactivate'))
|
||||
.then((_) => {
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('deactivate')) {
|
||||
resolve(true);
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('parent [deactivate cmp]');
|
||||
}
|
||||
}
|
||||
});
|
||||
rtr.navigateByUrl('/a').then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('A');
|
||||
expect(log).toEqual([
|
||||
'deactivate: /child-deactivate -> null',
|
||||
'parent deactivate: /parent-deactivate -> /a'
|
||||
]);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should reuse a component when the routerCanReuse hook returns true',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/on-reuse/1/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(log).toEqual([]);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('reuse [A]');
|
||||
expect(cmpInstanceCount).toBe(1);
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/on-reuse/2/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(log).toEqual(['reuse: /on-reuse/1 -> /on-reuse/2']);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('reuse [B]');
|
||||
expect(cmpInstanceCount).toBe(1);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should not reuse a component when the routerCanReuse hook returns false',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/never-reuse/1/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(log).toEqual([]);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('reuse [A]');
|
||||
expect(cmpInstanceCount).toBe(1);
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/never-reuse/2/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(log).toEqual([]);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('reuse [B]');
|
||||
expect(cmpInstanceCount).toBe(2);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should navigate when routerCanActivate returns true',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => {
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('routerCanActivate')) {
|
||||
resolve(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
rtr.navigateByUrl('/can-activate/a').then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('routerCanActivate [A]');
|
||||
expect(log).toEqual(['routerCanActivate: null -> /can-activate']);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not navigate when routerCanActivate returns false',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => {
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('routerCanActivate')) {
|
||||
resolve(false);
|
||||
}
|
||||
}
|
||||
});
|
||||
rtr.navigateByUrl('/can-activate/a').then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('');
|
||||
expect(log).toEqual(['routerCanActivate: null -> /can-activate']);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate away when routerCanDeactivate returns true',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/can-deactivate/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('routerCanDeactivate [A]');
|
||||
expect(log).toEqual([]);
|
||||
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('routerCanDeactivate')) {
|
||||
resolve(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
rtr.navigateByUrl('/a').then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('A');
|
||||
expect(log).toEqual(['routerCanDeactivate: /can-deactivate -> /a']);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not navigate away when routerCanDeactivate returns false',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/can-deactivate/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('routerCanDeactivate [A]');
|
||||
expect(log).toEqual([]);
|
||||
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('routerCanDeactivate')) {
|
||||
resolve(false);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
rtr.navigateByUrl('/a').then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('routerCanDeactivate [A]');
|
||||
expect(log).toEqual(['routerCanDeactivate: /can-deactivate -> /a']);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should run activation and deactivation hooks in the correct order',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/activation-hooks/child'))
|
||||
.then((_) => {
|
||||
expect(log).toEqual([
|
||||
'routerCanActivate child: null -> /child',
|
||||
'routerCanActivate parent: null -> /activation-hooks',
|
||||
'routerOnActivate parent: null -> /activation-hooks',
|
||||
'routerOnActivate child: null -> /child'
|
||||
]);
|
||||
|
||||
log = [];
|
||||
return rtr.navigateByUrl('/a');
|
||||
})
|
||||
.then((_) => {
|
||||
expect(log).toEqual([
|
||||
'routerCanDeactivate parent: /activation-hooks -> /a',
|
||||
'routerCanDeactivate child: /child -> null',
|
||||
'routerOnDeactivate child: /child -> null',
|
||||
'routerOnDeactivate parent: /activation-hooks -> /a'
|
||||
]);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should only run reuse hooks when reusing',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/reuse-hooks/1'))
|
||||
.then((_) => {
|
||||
expect(log).toEqual([
|
||||
'routerCanActivate: null -> /reuse-hooks/1',
|
||||
'routerOnActivate: null -> /reuse-hooks/1'
|
||||
]);
|
||||
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('routerCanReuse')) {
|
||||
resolve(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
log = [];
|
||||
return rtr.navigateByUrl('/reuse-hooks/2');
|
||||
})
|
||||
.then((_) => {
|
||||
expect(log).toEqual([
|
||||
'routerCanReuse: /reuse-hooks/1 -> /reuse-hooks/2',
|
||||
'routerOnReuse: /reuse-hooks/1 -> /reuse-hooks/2'
|
||||
]);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not run reuse hooks when not reusing',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: LifecycleCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/reuse-hooks/1'))
|
||||
.then((_) => {
|
||||
expect(log).toEqual([
|
||||
'routerCanActivate: null -> /reuse-hooks/1',
|
||||
'routerOnActivate: null -> /reuse-hooks/1'
|
||||
]);
|
||||
|
||||
eventBus.subscribe({
|
||||
next: (ev: any) => {
|
||||
if (ev.startsWith('routerCanReuse')) {
|
||||
resolve(false);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
log = [];
|
||||
return rtr.navigateByUrl('/reuse-hooks/2');
|
||||
})
|
||||
.then((_) => {
|
||||
expect(log).toEqual([
|
||||
'routerCanReuse: /reuse-hooks/1 -> /reuse-hooks/2',
|
||||
'routerCanActivate: /reuse-hooks/1 -> /reuse-hooks/2',
|
||||
'routerCanDeactivate: /reuse-hooks/1 -> /reuse-hooks/2',
|
||||
'routerOnDeactivate: /reuse-hooks/1 -> /reuse-hooks/2',
|
||||
'routerOnActivate: /reuse-hooks/1 -> /reuse-hooks/2'
|
||||
]);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'a-cmp', template: 'A'})
|
||||
class A {
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'b-cmp', template: 'B'})
|
||||
class B {
|
||||
}
|
||||
|
||||
|
||||
function logHook(name: string, next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
var message = name + ': ' + (isPresent(prev) ? ('/' + prev.urlPath) : 'null') + ' -> ' +
|
||||
(isPresent(next) ? ('/' + next.urlPath) : 'null');
|
||||
log.push(message);
|
||||
eventBus.emit(message);
|
||||
}
|
||||
|
||||
@Component({selector: 'activate-cmp', template: 'activate cmp'})
|
||||
class ActivateCmp implements OnActivate {
|
||||
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('activate', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-activate-cmp',
|
||||
template: `parent [<router-outlet></router-outlet>]`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/child-activate', component: ActivateCmp})])
|
||||
class ParentActivateCmp implements OnActivate {
|
||||
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction): Promise<any> {
|
||||
promise = new Promise((res, rej) => {
|
||||
resolve = res;
|
||||
reject = rej;
|
||||
});
|
||||
logHook('parent activate', next, prev);
|
||||
return promise;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({selector: 'deactivate-cmp', template: 'deactivate cmp'})
|
||||
class DeactivateCmp implements OnDeactivate {
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('deactivate', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({selector: 'deactivate-cmp', template: 'deactivate cmp'})
|
||||
class WaitDeactivateCmp implements OnDeactivate {
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction): Promise<any> {
|
||||
promise = new Promise((res, rej) => {
|
||||
resolve = res;
|
||||
reject = rej;
|
||||
});
|
||||
logHook('deactivate', next, prev);
|
||||
return promise;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-deactivate-cmp',
|
||||
template: `parent [<router-outlet></router-outlet>]`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/child-deactivate', component: WaitDeactivateCmp})])
|
||||
class ParentDeactivateCmp implements OnDeactivate {
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('parent deactivate', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'reuse-cmp',
|
||||
template: `reuse [<router-outlet></router-outlet>]`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/a', component: A}), new Route({path: '/b', component: B})])
|
||||
class ReuseCmp implements OnReuse,
|
||||
CanReuse {
|
||||
constructor() { cmpInstanceCount += 1; }
|
||||
routerCanReuse(next: ComponentInstruction, prev: ComponentInstruction) { return true; }
|
||||
routerOnReuse(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('reuse', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'never-reuse-cmp',
|
||||
template: `reuse [<router-outlet></router-outlet>]`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/a', component: A}), new Route({path: '/b', component: B})])
|
||||
class NeverReuseCmp implements OnReuse,
|
||||
CanReuse {
|
||||
constructor() { cmpInstanceCount += 1; }
|
||||
routerCanReuse(next: ComponentInstruction, prev: ComponentInstruction) { return false; }
|
||||
routerOnReuse(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('reuse', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'can-activate-cmp',
|
||||
template: `routerCanActivate [<router-outlet></router-outlet>]`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/a', component: A}), new Route({path: '/b', component: B})])
|
||||
@CanActivate(CanActivateCmp.routerCanActivate)
|
||||
class CanActivateCmp {
|
||||
static routerCanActivate(next: ComponentInstruction, prev: ComponentInstruction):
|
||||
Promise<boolean> {
|
||||
promise = new Promise((res, rej) => {
|
||||
resolve = res;
|
||||
reject = rej;
|
||||
});
|
||||
logHook('routerCanActivate', next, prev);
|
||||
return promise;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'can-deactivate-cmp',
|
||||
template: `routerCanDeactivate [<router-outlet></router-outlet>]`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/a', component: A}), new Route({path: '/b', component: B})])
|
||||
class CanDeactivateCmp implements CanDeactivate {
|
||||
routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction): Promise<boolean> {
|
||||
promise = new Promise((res, rej) => {
|
||||
resolve = res;
|
||||
reject = rej;
|
||||
});
|
||||
logHook('routerCanDeactivate', next, prev);
|
||||
return promise;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({selector: 'all-hooks-child-cmp', template: `child`})
|
||||
@CanActivate(AllHooksChildCmp.routerCanActivate)
|
||||
class AllHooksChildCmp implements CanDeactivate, OnDeactivate, OnActivate {
|
||||
routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerCanDeactivate child', next, prev);
|
||||
return true;
|
||||
}
|
||||
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnDeactivate child', next, prev);
|
||||
}
|
||||
|
||||
static routerCanActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerCanActivate child', next, prev);
|
||||
return true;
|
||||
}
|
||||
|
||||
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnActivate child', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'all-hooks-parent-cmp',
|
||||
template: `<router-outlet></router-outlet>`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([new Route({path: '/child', component: AllHooksChildCmp})])
|
||||
@CanActivate(AllHooksParentCmp.routerCanActivate)
|
||||
class AllHooksParentCmp implements CanDeactivate,
|
||||
OnDeactivate, OnActivate {
|
||||
routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerCanDeactivate parent', next, prev);
|
||||
return true;
|
||||
}
|
||||
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnDeactivate parent', next, prev);
|
||||
}
|
||||
|
||||
static routerCanActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerCanActivate parent', next, prev);
|
||||
return true;
|
||||
}
|
||||
|
||||
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnActivate parent', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({selector: 'reuse-hooks-cmp', template: 'reuse hooks cmp'})
|
||||
@CanActivate(ReuseHooksCmp.routerCanActivate)
|
||||
class ReuseHooksCmp implements OnActivate, OnReuse, OnDeactivate, CanReuse, CanDeactivate {
|
||||
routerCanReuse(next: ComponentInstruction, prev: ComponentInstruction): Promise<any> {
|
||||
promise = new Promise((res, rej) => {
|
||||
resolve = res;
|
||||
reject = rej;
|
||||
});
|
||||
logHook('routerCanReuse', next, prev);
|
||||
return promise;
|
||||
}
|
||||
|
||||
routerOnReuse(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnReuse', next, prev);
|
||||
}
|
||||
|
||||
routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerCanDeactivate', next, prev);
|
||||
return true;
|
||||
}
|
||||
|
||||
routerOnDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnDeactivate', next, prev);
|
||||
}
|
||||
|
||||
static routerCanActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerCanActivate', next, prev);
|
||||
return true;
|
||||
}
|
||||
|
||||
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
|
||||
logHook('routerOnActivate', next, prev);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'lifecycle-cmp',
|
||||
template: `<router-outlet></router-outlet>`,
|
||||
directives: [RouterOutlet]
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/a', component: A}), new Route({path: '/on-activate', component: ActivateCmp}),
|
||||
new Route({path: '/parent-activate/...', component: ParentActivateCmp}),
|
||||
new Route({path: '/on-deactivate', component: DeactivateCmp}),
|
||||
new Route({path: '/parent-deactivate/...', component: ParentDeactivateCmp}),
|
||||
new Route({path: '/on-reuse/:number/...', component: ReuseCmp}),
|
||||
new Route({path: '/never-reuse/:number/...', component: NeverReuseCmp}),
|
||||
new Route({path: '/can-activate/...', component: CanActivateCmp}),
|
||||
new Route({path: '/can-deactivate/...', component: CanDeactivateCmp}),
|
||||
new Route({path: '/activation-hooks/...', component: AllHooksParentCmp}),
|
||||
new Route({path: '/reuse-hooks/:number', component: ReuseHooksCmp})
|
||||
])
|
||||
class LifecycleCmp {
|
||||
}
|
|
@ -1,307 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {Component, Inject, Injector, provide} from '@angular/core';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {RouteData, RouteParams, Router, RouterLink, RouterOutlet} from '@angular/router-deprecated';
|
||||
|
||||
import {AsyncRoute, AuxRoute, Redirect, Route, RouteConfig} from '../../src/route_config/route_config_decorator';
|
||||
|
||||
import {RootCmp, TEST_ROUTER_PROVIDERS, compile} from './util';
|
||||
|
||||
var cmpInstanceCount: any /** TODO #9100 */;
|
||||
var childCmpInstanceCount: any /** TODO #9100 */;
|
||||
|
||||
export function main() {
|
||||
describe('navigation', () => {
|
||||
|
||||
var tcb: TestComponentBuilder;
|
||||
var fixture: ComponentFixture<any>;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
childCmpInstanceCount = 0;
|
||||
cmpInstanceCount = 0;
|
||||
}));
|
||||
|
||||
it('should work in a simple case', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/test', component: HelloCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/test'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should navigate between components with different parameters',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/user/:name', component: UserCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/user/brian'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello brian');
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/user/igor'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello igor');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate to child routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, 'outer [ <router-outlet></router-outlet> ]')
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/a/...', component: ParentCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate to child routes that capture an empty path',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
|
||||
compile(tcb, 'outer [ <router-outlet></router-outlet> ]')
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/a/...', component: ParentCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate to child routes when the root component has an empty path',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb, 'outer [ <router-outlet></router-outlet> ]')
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/...', component: ParentCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('outer [ inner [ hello ] ]');
|
||||
expect(location.urlChanges).toEqual(['/b']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate to child routes of async routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, 'outer [ <router-outlet></router-outlet> ]')
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute({path: '/a/...', loader: parentLoader})]))
|
||||
.then((_) => rtr.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('outer [ inner [ hello ] ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should replace state when normalized paths are equal',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => location.setInitialPath('/test/'))
|
||||
.then((_) => rtr.config([new Route({path: '/test', component: HelloCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/test'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('hello');
|
||||
expect(location.urlChanges).toEqual(['replace: /test']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should reuse common parent components',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/team/:id/...', component: TeamCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/team/angular/user/rado'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(cmpInstanceCount).toBe(1);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('team angular [ hello rado ]');
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/team/angular/user/victor'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(cmpInstanceCount).toBe(1);
|
||||
expect(fixture.debugElement.nativeElement)
|
||||
.toHaveText('team angular [ hello victor ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not reuse children when parent components change',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/team/:id/...', component: TeamCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/team/angular/user/rado'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(cmpInstanceCount).toBe(1);
|
||||
expect(childCmpInstanceCount).toBe(1);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('team angular [ hello rado ]');
|
||||
})
|
||||
.then((_) => rtr.navigateByUrl('/team/dart/user/rado'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(cmpInstanceCount).toBe(2);
|
||||
expect(childCmpInstanceCount).toBe(2);
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('team dart [ hello rado ]');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should inject route data into component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/route-data', component: RouteDataCmp, data: {isAdmin: true}})]))
|
||||
.then((_) => rtr.navigateByUrl('/route-data'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('true');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should inject route data into component with AsyncRoute',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new AsyncRoute(
|
||||
{path: '/route-data', loader: asyncRouteDataCmp, data: {isAdmin: true}})]))
|
||||
.then((_) => rtr.navigateByUrl('/route-data'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('true');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should inject empty object if the route has no data property',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route(
|
||||
{path: '/route-data-default', component: RouteDataCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/route-data-default'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should fire an event for each activated component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile(tcb, '<router-outlet (activate)="activatedCmp = $event"></router-outlet>')
|
||||
.then((rtc) => { fixture = rtc; })
|
||||
.then((_) => rtr.config([new Route({path: '/test', component: HelloCmp})]))
|
||||
.then((_) => rtr.navigateByUrl('/test'))
|
||||
.then((_) => {
|
||||
// Note: need a timeout so that all promises are flushed
|
||||
return new Promise(resolve => { setTimeout(() => { resolve(null); }, 0); });
|
||||
})
|
||||
.then((_) => {
|
||||
expect(fixture.componentInstance.activatedCmp).toBeAnInstanceOf(HelloCmp);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'hello-cmp', template: `{{greeting}}`})
|
||||
class HelloCmp {
|
||||
greeting: string;
|
||||
constructor() { this.greeting = 'hello'; }
|
||||
}
|
||||
|
||||
|
||||
function asyncRouteDataCmp() {
|
||||
return Promise.resolve(RouteDataCmp);
|
||||
}
|
||||
|
||||
@Component({selector: 'data-cmp', template: `{{myData}}`})
|
||||
class RouteDataCmp {
|
||||
myData: boolean;
|
||||
constructor(data: RouteData) { this.myData = data.get('isAdmin'); }
|
||||
}
|
||||
|
||||
@Component({selector: 'user-cmp', template: `hello {{user}}`})
|
||||
class UserCmp {
|
||||
user: string;
|
||||
constructor(params: RouteParams) {
|
||||
childCmpInstanceCount += 1;
|
||||
this.user = params.get('name');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function parentLoader() {
|
||||
return Promise.resolve(ParentCmp);
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `inner [ <router-outlet></router-outlet> ]`,
|
||||
directives: [RouterOutlet],
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/b', component: HelloCmp}),
|
||||
new Route({path: '/', component: HelloCmp}),
|
||||
])
|
||||
class ParentCmp {
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'team-cmp',
|
||||
template: `team {{id}} [ <router-outlet></router-outlet> ]`,
|
||||
directives: [RouterOutlet],
|
||||
})
|
||||
@RouteConfig([new Route({path: '/user/:name', component: UserCmp})])
|
||||
class TeamCmp {
|
||||
id: string;
|
||||
constructor(params: RouteParams) {
|
||||
this.id = params.get('id');
|
||||
cmpInstanceCount += 1;
|
||||
}
|
||||
}
|
|
@ -1,142 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {RouteData, RouteParams, Router, RouterLink, RouterOutlet} from '@angular/router-deprecated';
|
||||
|
||||
import {AsyncRoute, AuxRoute, Redirect, Route, RouteConfig} from '../../src/route_config/route_config_decorator';
|
||||
|
||||
import {GoodbyeCmp, HelloCmp, RedirectToParentCmp} from './impl/fixture_components';
|
||||
import {RootCmp, TEST_ROUTER_PROVIDERS, compile} from './util';
|
||||
|
||||
var cmpInstanceCount: any /** TODO #9100 */;
|
||||
var childCmpInstanceCount: any /** TODO #9100 */;
|
||||
|
||||
export function main() {
|
||||
describe('redirects', () => {
|
||||
|
||||
var tcb: TestComponentBuilder;
|
||||
var rootTC: ComponentFixture<any>;
|
||||
var rtr: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router],
|
||||
(tcBuilder: any /** TODO #9100 */, router: any /** TODO #9100 */) => {
|
||||
tcb = tcBuilder;
|
||||
rtr = router;
|
||||
childCmpInstanceCount = 0;
|
||||
cmpInstanceCount = 0;
|
||||
}));
|
||||
|
||||
|
||||
it('should apply when navigating by URL',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Redirect({path: '/original', redirectTo: ['Hello']}),
|
||||
new Route({path: '/redirected', component: HelloCmp, name: 'Hello'})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/original'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('hello');
|
||||
expect(location.urlChanges).toEqual(['/redirected']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should recognize and apply absolute redirects',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Redirect({path: '/original', redirectTo: ['/Hello']}),
|
||||
new Route({path: '/redirected', component: HelloCmp, name: 'Hello'})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/original'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('hello');
|
||||
expect(location.urlChanges).toEqual(['/redirected']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should recognize and apply relative child redirects',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Redirect({path: '/original', redirectTo: ['./Hello']}),
|
||||
new Route({path: '/redirected', component: HelloCmp, name: 'Hello'})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/original'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('hello');
|
||||
expect(location.urlChanges).toEqual(['/redirected']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should recognize and apply relative parent redirects',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/original/...', component: RedirectToParentCmp}),
|
||||
new Route({path: '/redirected', component: HelloCmp, name: 'HelloSib'})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/original/child-redirect'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('hello');
|
||||
expect(location.urlChanges).toEqual(['/redirected']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should not redirect when redirect is less specific than other matching routes',
|
||||
inject(
|
||||
[AsyncTestCompleter, Location],
|
||||
(async: AsyncTestCompleter, location: any /** TODO #9100 */) => {
|
||||
compile(tcb)
|
||||
.then((rtc) => { rootTC = rtc; })
|
||||
.then((_) => rtr.config([
|
||||
new Route({path: '/foo', component: HelloCmp, name: 'Hello'}),
|
||||
new Route({path: '/:param', component: GoodbyeCmp, name: 'Goodbye'}),
|
||||
new Redirect({path: '/*rest', redirectTo: ['/Hello']})
|
||||
]))
|
||||
.then((_) => rtr.navigateByUrl('/bye'))
|
||||
.then((_) => {
|
||||
rootTC.detectChanges();
|
||||
expect(rootTC.debugElement.nativeElement).toHaveText('goodbye');
|
||||
expect(location.urlChanges).toEqual(['/bye']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
});
|
||||
}
|
|
@ -1,501 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {SpyLocation} from '@angular/common/testing';
|
||||
import {Component} from '@angular/core';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {By} from '@angular/platform-browser/src/dom/debug/by';
|
||||
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {AsyncRoute, AuxRoute, ROUTER_DIRECTIVES, ROUTER_PRIMARY_COMPONENT, Route, RouteConfig, RouteParams, RouteRegistry, Router, RouterLink} from '@angular/router-deprecated';
|
||||
import {RootRouter} from '@angular/router-deprecated/src/router';
|
||||
import {ListWrapper} from '../../src/facade/collection';
|
||||
import {NumberWrapper, escapeRegExp} from '../../src/facade/lang';
|
||||
|
||||
export function main() {
|
||||
describe('routerLink directive', function() {
|
||||
var tcb: TestComponentBuilder;
|
||||
var fixture: ComponentFixture<any>;
|
||||
var router: Router;
|
||||
var location: Location;
|
||||
|
||||
beforeEachProviders(
|
||||
() =>
|
||||
[RouteRegistry, {provide: Location, useClass: SpyLocation},
|
||||
{provide: ROUTER_PRIMARY_COMPONENT, useValue: MyComp7},
|
||||
{provide: Router, useClass: RootRouter},
|
||||
]);
|
||||
|
||||
beforeEach(inject(
|
||||
[TestComponentBuilder, Router, Location],
|
||||
(tcBuilder: TestComponentBuilder, rtr: Router, loc: Location) => {
|
||||
tcb = tcBuilder;
|
||||
router = rtr;
|
||||
location = loc;
|
||||
}));
|
||||
|
||||
function compile(template: string = '<router-outlet></router-outlet>') {
|
||||
return tcb.overrideTemplate(MyComp7, ('<div>' + template + '</div>'))
|
||||
.createAsync(MyComp7)
|
||||
.then((tc) => { fixture = tc; });
|
||||
}
|
||||
|
||||
it('should generate absolute hrefs that include the base href',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
(<SpyLocation>location).setBaseHref('/my/base');
|
||||
compile('<a href="hello" [routerLink]="[\'./User\']"></a>')
|
||||
.then(
|
||||
(_) =>
|
||||
router.config([new Route({path: '/user', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => router.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/my/base/user');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should generate link hrefs without params',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile('<a href="hello" [routerLink]="[\'./User\']"></a>')
|
||||
.then(
|
||||
(_) =>
|
||||
router.config([new Route({path: '/user', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => router.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/user');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should generate link hrefs with params',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile('<a href="hello" [routerLink]="[\'./User\', {name: name}]">{{name}}</a>')
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/user/:name', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => router.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.debugElement.componentInstance.name = 'brian';
|
||||
fixture.detectChanges();
|
||||
expect(fixture.debugElement.nativeElement).toHaveText('brian');
|
||||
expect(getHref(fixture)).toEqual('/user/brian');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate link hrefs from a child to its sibling',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/page/:number', component: SiblingPageCmp, name: 'Page'})]))
|
||||
.then((_) => router.navigateByUrl('/page/1'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/page/2');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate link hrefs from a child to its sibling with no leading slash',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/page/:number', component: NoPrefixSiblingPageCmp, name: 'Page'})]))
|
||||
.then((_) => router.navigateByUrl('/page/1'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/page/2');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate link hrefs to a child with no leading slash',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/book/:title/...', component: NoPrefixBookCmp, name: 'Book'})]))
|
||||
.then((_) => router.navigateByUrl('/book/1984/page/1'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/book/1984/page/100');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw when links without a leading slash are ambiguous',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/book/:title/...', component: AmbiguousBookCmp, name: 'Book'})]))
|
||||
.then((_) => router.navigateByUrl('/book/1984/page/1'))
|
||||
.then((_) => {
|
||||
var link = ListWrapper.toJSON(['Book', {number: 100}]);
|
||||
expect(() => fixture.detectChanges())
|
||||
.toThrowError(new RegExp(escapeRegExp(
|
||||
`Link "${link}" is ambiguous, use "./" or "../" to disambiguate.`)));
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate link hrefs when asynchronously loaded',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new AsyncRoute({
|
||||
path: '/child-with-grandchild/...',
|
||||
loader: parentCmpLoader,
|
||||
name: 'ChildWithGrandchild'
|
||||
})]))
|
||||
.then((_) => router.navigateByUrl('/child-with-grandchild/grandchild'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/child-with-grandchild/grandchild');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate relative links preserving the existing parent route',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/book/:title/...', component: BookCmp, name: 'Book'})]))
|
||||
.then((_) => router.navigateByUrl('/book/1984/page/1'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
// TODO(juliemr): This should be one By.css('book-cmp a') query, but the parse5
|
||||
// adapter
|
||||
// can't handle css child selectors.
|
||||
expect(getDOM().getAttribute(
|
||||
fixture.debugElement.query(By.css('book-cmp'))
|
||||
.query(By.css('a'))
|
||||
.nativeElement,
|
||||
'href'))
|
||||
.toEqual('/book/1984/page/100');
|
||||
|
||||
expect(getDOM().getAttribute(
|
||||
fixture.debugElement.query(By.css('page-cmp'))
|
||||
.query(By.css('a'))
|
||||
.nativeElement,
|
||||
'href'))
|
||||
.toEqual('/book/1984/page/2');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate links to auxiliary routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile()
|
||||
.then((_) => router.config([new Route({path: '/...', component: AuxLinkCmp})]))
|
||||
.then((_) => router.navigateByUrl('/'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
expect(getHref(fixture)).toEqual('/(aside)');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
describe('router-link-active CSS class', () => {
|
||||
it('should be added to the associated element',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
router
|
||||
.config([
|
||||
new Route({path: '/child', component: HelloCmp, name: 'Child'}),
|
||||
new Route({path: '/better-child', component: Hello2Cmp, name: 'BetterChild'})
|
||||
])
|
||||
.then((_) => compile(`<a [routerLink]="['./Child']" class="child-link">Child</a>
|
||||
<a [routerLink]="['./BetterChild']" class="better-child-link">Better Child</a>
|
||||
<router-outlet></router-outlet>`))
|
||||
.then((_) => {
|
||||
var element = fixture.debugElement.nativeElement;
|
||||
|
||||
fixture.detectChanges();
|
||||
|
||||
var link1 = getDOM().querySelector(element, '.child-link');
|
||||
var link2 = getDOM().querySelector(element, '.better-child-link');
|
||||
|
||||
expect(link1).not.toHaveCssClass('router-link-active');
|
||||
expect(link2).not.toHaveCssClass('router-link-active');
|
||||
|
||||
router.subscribe((_) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(link1).not.toHaveCssClass('router-link-active');
|
||||
expect(link2).toHaveCssClass('router-link-active');
|
||||
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/better-child?extra=0');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should be added to links in child routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
router
|
||||
.config([
|
||||
new Route({path: '/child', component: HelloCmp, name: 'Child'}), new Route({
|
||||
path: '/child-with-grandchild/...',
|
||||
component: ParentCmp,
|
||||
name: 'ChildWithGrandchild'
|
||||
})
|
||||
])
|
||||
.then((_) => compile(`<a [routerLink]="['./Child']" class="child-link">Child</a>
|
||||
<a [routerLink]="['./ChildWithGrandchild/Grandchild']" class="child-with-grandchild-link">Better Child</a>
|
||||
<router-outlet></router-outlet>`))
|
||||
.then((_) => {
|
||||
var element = fixture.debugElement.nativeElement;
|
||||
|
||||
fixture.detectChanges();
|
||||
|
||||
var link1 = getDOM().querySelector(element, '.child-link');
|
||||
var link2 = getDOM().querySelector(element, '.child-with-grandchild-link');
|
||||
|
||||
expect(link1).not.toHaveCssClass('router-link-active');
|
||||
expect(link2).not.toHaveCssClass('router-link-active');
|
||||
|
||||
router.subscribe((_) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(link1).not.toHaveCssClass('router-link-active');
|
||||
expect(link2).toHaveCssClass('router-link-active');
|
||||
|
||||
var link3 = getDOM().querySelector(element, '.grandchild-link');
|
||||
var link4 = getDOM().querySelector(element, '.better-grandchild-link');
|
||||
|
||||
expect(link3).toHaveCssClass('router-link-active');
|
||||
expect(link4).not.toHaveCssClass('router-link-active');
|
||||
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/child-with-grandchild/grandchild?extra=0');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not be added to links in other child routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
router
|
||||
.config([
|
||||
new Route({path: '/child', component: HelloCmp, name: 'Child'}), new Route({
|
||||
path: '/child-with-grandchild/...',
|
||||
component: ParentCmp,
|
||||
name: 'ChildWithGrandchild'
|
||||
}),
|
||||
new Route({
|
||||
path: '/child-with-other-grandchild/...',
|
||||
component: ParentCmp,
|
||||
name: 'ChildWithOtherGrandchild'
|
||||
})
|
||||
])
|
||||
.then((_) => compile(`<a [routerLink]="['./Child']" class="child-link">Child</a>
|
||||
<a [routerLink]="['./ChildWithGrandchild/Grandchild']" class="child-with-grandchild-link">Better Child</a>
|
||||
<a [routerLink]="['./ChildWithOtherGrandchild/Grandchild']" class="child-with-other-grandchild-link">Better Child</a>
|
||||
<router-outlet></router-outlet>`))
|
||||
.then((_) => {
|
||||
var element = fixture.debugElement.nativeElement;
|
||||
|
||||
fixture.detectChanges();
|
||||
|
||||
var link1 = getDOM().querySelector(element, '.child-link');
|
||||
var link2 = getDOM().querySelector(element, '.child-with-grandchild-link');
|
||||
var link3 = getDOM().querySelector(element, '.child-with-other-grandchild-link');
|
||||
|
||||
expect(link1).not.toHaveCssClass('router-link-active');
|
||||
expect(link2).not.toHaveCssClass('router-link-active');
|
||||
expect(link3).not.toHaveCssClass('router-link-active');
|
||||
|
||||
router.subscribe((_) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(link1).not.toHaveCssClass('router-link-active');
|
||||
expect(link2).toHaveCssClass('router-link-active');
|
||||
expect(link3).not.toHaveCssClass('router-link-active');
|
||||
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/child-with-grandchild/grandchild?extra=0');
|
||||
});
|
||||
}));
|
||||
});
|
||||
|
||||
describe('when clicked', () => {
|
||||
|
||||
var clickOnElement = function(view: any /** TODO #9100 */) {
|
||||
var anchorEl = fixture.debugElement.query(By.css('a')).nativeElement;
|
||||
var dispatchedEvent = getDOM().createMouseEvent('click');
|
||||
getDOM().dispatchEvent(anchorEl, dispatchedEvent);
|
||||
return dispatchedEvent;
|
||||
};
|
||||
|
||||
it('should navigate to link hrefs without params',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
compile('<a href="hello" [routerLink]="[\'./User\']"></a>')
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/user', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => router.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
var dispatchedEvent = clickOnElement(fixture);
|
||||
expect(getDOM().isPrevented(dispatchedEvent)).toBe(true);
|
||||
|
||||
// router navigation is async.
|
||||
router.subscribe((_) => {
|
||||
expect((<SpyLocation>location).urlChanges).toEqual(['/user']);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate to link hrefs in presence of base href',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
(<SpyLocation>location).setBaseHref('/base');
|
||||
compile('<a href="hello" [routerLink]="[\'./User\']"></a>')
|
||||
.then((_) => router.config([new Route(
|
||||
{path: '/user', component: UserCmp, name: 'User'})]))
|
||||
.then((_) => router.navigateByUrl('/a/b'))
|
||||
.then((_) => {
|
||||
fixture.detectChanges();
|
||||
|
||||
|
||||
var dispatchedEvent = clickOnElement(fixture);
|
||||
expect(getDOM().isPrevented(dispatchedEvent)).toBe(true);
|
||||
|
||||
// router navigation is async.
|
||||
router.subscribe((_) => {
|
||||
expect((<SpyLocation>location).urlChanges).toEqual(['/base/user']);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function getHref(tc: ComponentFixture<any>) {
|
||||
return getDOM().getAttribute(tc.debugElement.query(By.css('a')).nativeElement, 'href');
|
||||
}
|
||||
|
||||
@Component({selector: 'my-comp', template: '', directives: [ROUTER_DIRECTIVES]})
|
||||
class MyComp7 {
|
||||
name: any /** TODO #9100 */;
|
||||
}
|
||||
|
||||
@Component({selector: 'user-cmp', template: 'hello {{user}}'})
|
||||
class UserCmp {
|
||||
user: string;
|
||||
constructor(params: RouteParams) { this.user = params.get('name'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'page-cmp',
|
||||
template:
|
||||
`page #{{pageNumber}} | <a href="hello" [routerLink]="[\'../Page\', {number: nextPage}]">next</a>`,
|
||||
directives: [RouterLink]
|
||||
})
|
||||
class SiblingPageCmp {
|
||||
pageNumber: number;
|
||||
nextPage: number;
|
||||
constructor(params: RouteParams) {
|
||||
this.pageNumber = NumberWrapper.parseInt(params.get('number'), 10);
|
||||
this.nextPage = this.pageNumber + 1;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'page-cmp',
|
||||
template:
|
||||
`page #{{pageNumber}} | <a href="hello" [routerLink]="[\'Page\', {number: nextPage}]">next</a>`,
|
||||
directives: [RouterLink]
|
||||
})
|
||||
class NoPrefixSiblingPageCmp {
|
||||
pageNumber: number;
|
||||
nextPage: number;
|
||||
constructor(params: RouteParams) {
|
||||
this.pageNumber = NumberWrapper.parseInt(params.get('number'), 10);
|
||||
this.nextPage = this.pageNumber + 1;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({selector: 'hello-cmp', template: 'hello'})
|
||||
class HelloCmp {
|
||||
}
|
||||
|
||||
@Component({selector: 'hello2-cmp', template: 'hello2'})
|
||||
class Hello2Cmp {
|
||||
}
|
||||
|
||||
function parentCmpLoader() {
|
||||
return Promise.resolve(ParentCmp);
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `[ <a [routerLink]="['./Grandchild']" class="grandchild-link">Grandchild</a>
|
||||
<a [routerLink]="['./BetterGrandchild']" class="better-grandchild-link">Better Grandchild</a>
|
||||
<router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/grandchild', component: HelloCmp, name: 'Grandchild'}),
|
||||
new Route({path: '/better-grandchild', component: Hello2Cmp, name: 'BetterGrandchild'})
|
||||
])
|
||||
class ParentCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'book-cmp',
|
||||
template: `<a href="hello" [routerLink]="[\'./Page\', {number: 100}]">{{title}}</a> |
|
||||
<router-outlet></router-outlet>`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/page/:number', component: SiblingPageCmp, name: 'Page'})])
|
||||
class BookCmp {
|
||||
title: string;
|
||||
constructor(params: RouteParams) { this.title = params.get('title'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'book-cmp',
|
||||
template: `<a href="hello" [routerLink]="[\'Page\', {number: 100}]">{{title}}</a> |
|
||||
<router-outlet></router-outlet>`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/page/:number', component: SiblingPageCmp, name: 'Page'})])
|
||||
class NoPrefixBookCmp {
|
||||
title: string;
|
||||
constructor(params: RouteParams) { this.title = params.get('title'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'book-cmp',
|
||||
template: `<a href="hello" [routerLink]="[\'Book\', {number: 100}]">{{title}}</a> |
|
||||
<router-outlet></router-outlet>`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([new Route({path: '/page/:number', component: SiblingPageCmp, name: 'Book'})])
|
||||
class AmbiguousBookCmp {
|
||||
title: string;
|
||||
constructor(params: RouteParams) { this.title = params.get('title'); }
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'aux-cmp',
|
||||
template: `<a [routerLink]="[\'./Hello\', [ \'Aside\' ] ]">aside</a> |
|
||||
<router-outlet></router-outlet> | aside <router-outlet name="aside"></router-outlet>`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/', component: HelloCmp, name: 'Hello'}),
|
||||
new AuxRoute({path: '/aside', component: Hello2Cmp, name: 'Aside'})
|
||||
])
|
||||
class AuxLinkCmp {
|
||||
}
|
|
@ -1,35 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {beforeEachProviders, ddescribe, describe} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {registerSpecs} from './impl/sync_route_spec_impl';
|
||||
import {TEST_ROUTER_PROVIDERS, ddescribeRouter, describeRouter, describeWith, describeWithAndWithout, describeWithout, itShouldRoute} from './util';
|
||||
|
||||
export function main() {
|
||||
describe('sync route spec', () => {
|
||||
|
||||
beforeEachProviders(() => TEST_ROUTER_PROVIDERS);
|
||||
|
||||
registerSpecs();
|
||||
|
||||
describeRouter('sync routes', () => {
|
||||
describeWithout('children', () => { describeWithAndWithout('params', itShouldRoute); });
|
||||
|
||||
describeWith('sync children', () => {
|
||||
describeWithout(
|
||||
'default routes', () => { describeWithAndWithout('params', itShouldRoute); });
|
||||
describeWith('default routes', () => { describeWithout('params', itShouldRoute); });
|
||||
|
||||
});
|
||||
|
||||
describeWith('dynamic components', itShouldRoute);
|
||||
});
|
||||
|
||||
});
|
||||
}
|
|
@ -1,128 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {SpyLocation} from '@angular/common/testing';
|
||||
import {Component, provide} from '@angular/core';
|
||||
import {ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
|
||||
import {beforeEach, beforeEachProviders, ddescribe, describe, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
|
||||
import {ROUTER_DIRECTIVES, ROUTER_PRIMARY_COMPONENT, Router} from '@angular/router-deprecated';
|
||||
import {RouteRegistry} from '@angular/router-deprecated/src/route_registry';
|
||||
import {RootRouter} from '@angular/router-deprecated/src/router';
|
||||
|
||||
import {BaseException} from '../../src/facade/exceptions';
|
||||
import {isBlank} from '../../src/facade/lang';
|
||||
|
||||
|
||||
/**
|
||||
* Router test helpers and fixtures
|
||||
*/
|
||||
|
||||
@Component({
|
||||
selector: 'root-comp',
|
||||
template: `<router-outlet></router-outlet>`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
export class RootCmp {
|
||||
name: string;
|
||||
activatedCmp: any;
|
||||
}
|
||||
|
||||
export function compile(
|
||||
tcb: TestComponentBuilder,
|
||||
template: string = '<router-outlet></router-outlet>'): Promise<ComponentFixture<RootCmp>> {
|
||||
return tcb.overrideTemplate(RootCmp, ('<div>' + template + '</div>')).createAsync(RootCmp);
|
||||
}
|
||||
|
||||
export var TEST_ROUTER_PROVIDERS: any[] = [
|
||||
RouteRegistry, {provide: Location, useClass: SpyLocation},
|
||||
{provide: ROUTER_PRIMARY_COMPONENT, useValue: RootCmp}, {provide: Router, useClass: RootRouter}
|
||||
];
|
||||
|
||||
export function clickOnElement(anchorEl: any /** TODO #9100 */) {
|
||||
var dispatchedEvent = getDOM().createMouseEvent('click');
|
||||
getDOM().dispatchEvent(anchorEl, dispatchedEvent);
|
||||
return dispatchedEvent;
|
||||
}
|
||||
|
||||
export function getHref(elt: any /** TODO #9100 */) {
|
||||
return getDOM().getAttribute(elt, 'href');
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Router integration suite DSL
|
||||
*/
|
||||
|
||||
var specNameBuilder: any[] /** TODO #9100 */ = [];
|
||||
|
||||
// we add the specs themselves onto this map
|
||||
export var specs = {};
|
||||
|
||||
export function describeRouter(description: string, fn: Function, exclusive = false): void {
|
||||
var specName = descriptionToSpecName(description);
|
||||
specNameBuilder.push(specName);
|
||||
if (exclusive) {
|
||||
ddescribe(description, fn);
|
||||
} else {
|
||||
describe(description, fn);
|
||||
}
|
||||
specNameBuilder.pop();
|
||||
}
|
||||
|
||||
export function ddescribeRouter(description: string, fn: Function, exclusive = false): void {
|
||||
describeRouter(description, fn, true);
|
||||
}
|
||||
|
||||
export function describeWithAndWithout(description: string, fn: Function): void {
|
||||
// the "without" case is usually simpler, so we opt to run this spec first
|
||||
describeWithout(description, fn);
|
||||
describeWith(description, fn);
|
||||
}
|
||||
|
||||
export function describeWith(description: string, fn: Function): void {
|
||||
var specName = 'with ' + description;
|
||||
specNameBuilder.push(specName);
|
||||
describe(specName, fn);
|
||||
specNameBuilder.pop();
|
||||
}
|
||||
|
||||
export function describeWithout(description: string, fn: Function): void {
|
||||
var specName = 'without ' + description;
|
||||
specNameBuilder.push(specName);
|
||||
describe(specName, fn);
|
||||
specNameBuilder.pop();
|
||||
}
|
||||
|
||||
function descriptionToSpecName(description: string): string {
|
||||
return spaceCaseToCamelCase(description);
|
||||
}
|
||||
|
||||
// this helper looks up the suite registered from the "impl" folder in this directory
|
||||
export function itShouldRoute() {
|
||||
var specSuiteName = spaceCaseToCamelCase(specNameBuilder.join(' '));
|
||||
|
||||
var spec = (specs as any /** TODO #9100 */)[specSuiteName];
|
||||
if (isBlank(spec)) {
|
||||
throw new BaseException(`Router integration spec suite "${specSuiteName}" was not found.`);
|
||||
} else {
|
||||
// todo: remove spec from map, throw if there are extra left over??
|
||||
spec();
|
||||
}
|
||||
}
|
||||
|
||||
function spaceCaseToCamelCase(str: string): string {
|
||||
var words = str.split(' ');
|
||||
var first = words.shift();
|
||||
return first + words.map(title).join('');
|
||||
}
|
||||
|
||||
function title(str: string): string {
|
||||
return str[0].toUpperCase() + str.substring(1);
|
||||
}
|
|
@ -1,190 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF, HashLocationStrategy, PlatformLocation} from '@angular/common';
|
||||
import {Injector, provide} from '@angular/core';
|
||||
import {beforeEach, beforeEachProviders, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {SpyPlatformLocation} from '../spies';
|
||||
|
||||
export function main() {
|
||||
describe('HashLocationStrategy', () => {
|
||||
var platformLocation: SpyPlatformLocation;
|
||||
var locationStrategy: HashLocationStrategy;
|
||||
|
||||
beforeEachProviders(
|
||||
() => [HashLocationStrategy, {provide: PlatformLocation, useClass: SpyPlatformLocation}]);
|
||||
|
||||
describe('without APP_BASE_HREF', () => {
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, HashLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('#foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('#foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', '#foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with just query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('?bar')).toEqual('#?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with APP_BASE_HREF with neither leading nor trailing slash', () => {
|
||||
beforeEachProviders(() => [{provide: APP_BASE_HREF, useValue: 'app'}]);
|
||||
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, HashLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('#app/foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#app/foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('#app/foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', '#app/foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('#app');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#app');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with APP_BASE_HREF with leading slash', () => {
|
||||
beforeEachProviders(() => [{provide: APP_BASE_HREF, useValue: '/app'}]);
|
||||
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, HashLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('#/app/foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#/app/foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('#/app/foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', '#/app/foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('#/app');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#/app');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with APP_BASE_HREF with both leading and trailing slash', () => {
|
||||
beforeEachProviders(() => [{provide: APP_BASE_HREF, useValue: '/app/'}]);
|
||||
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, HashLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('#/app/foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#/app/foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('#/app/foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', '#/app/foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('#/app/');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '#/app/');
|
||||
});
|
||||
});
|
||||
|
||||
describe('hashLocationStrategy bugs', () => {
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, HashLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should not include platform search', () => {
|
||||
platformLocation.search = '?donotinclude';
|
||||
expect(locationStrategy.path()).toEqual('');
|
||||
});
|
||||
|
||||
it('should not include platform search even with hash', () => {
|
||||
platformLocation.hash = '#hashPath';
|
||||
platformLocation.search = '?donotinclude';
|
||||
expect(locationStrategy.path()).toEqual('hashPath');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,82 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location, LocationStrategy} from '@angular/common';
|
||||
import {MockLocationStrategy} from '@angular/common/testing/mock_location_strategy';
|
||||
import {ReflectiveInjector} from '@angular/core';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
|
||||
export function main() {
|
||||
describe('Location', () => {
|
||||
|
||||
var locationStrategy: any /** TODO #9100 */, location: any /** TODO #9100 */;
|
||||
|
||||
function makeLocation(baseHref: string = '/my/app', provider: any = []): Location {
|
||||
locationStrategy = new MockLocationStrategy();
|
||||
locationStrategy.internalBaseHref = baseHref;
|
||||
let injector = ReflectiveInjector.resolveAndCreate(
|
||||
[Location, {provide: LocationStrategy, useValue: locationStrategy}, provider]);
|
||||
return location = injector.get(Location);
|
||||
}
|
||||
|
||||
beforeEach(makeLocation);
|
||||
|
||||
it('should not prepend urls with starting slash when an empty URL is provided',
|
||||
() => { expect(location.prepareExternalUrl('')).toEqual(locationStrategy.getBaseHref()); });
|
||||
|
||||
it('should not prepend path with an extra slash when a baseHref has a trailing slash', () => {
|
||||
let location = makeLocation('/my/slashed/app/');
|
||||
expect(location.prepareExternalUrl('/page')).toEqual('/my/slashed/app/page');
|
||||
});
|
||||
|
||||
it('should not append urls with leading slash on navigate', () => {
|
||||
location.go('/my/app/user/btford');
|
||||
expect(locationStrategy.path()).toEqual('/my/app/user/btford');
|
||||
});
|
||||
|
||||
it('should normalize urls on popstate',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
|
||||
location.subscribe((ev: any /** TODO #9100 */) => {
|
||||
expect(ev['url']).toEqual('/user/btford');
|
||||
async.done();
|
||||
});
|
||||
locationStrategy.simulatePopState('/my/app/user/btford');
|
||||
}));
|
||||
|
||||
it('should revert to the previous path when a back() operation is executed', () => {
|
||||
var locationStrategy = new MockLocationStrategy();
|
||||
var location = new Location(locationStrategy);
|
||||
|
||||
function assertUrl(path: any /** TODO #9100 */) { expect(location.path()).toEqual(path); }
|
||||
|
||||
location.go('/ready');
|
||||
assertUrl('/ready');
|
||||
|
||||
location.go('/ready/set');
|
||||
assertUrl('/ready/set');
|
||||
|
||||
location.go('/ready/set/go');
|
||||
assertUrl('/ready/set/go');
|
||||
|
||||
location.back();
|
||||
assertUrl('/ready/set');
|
||||
|
||||
location.back();
|
||||
assertUrl('/ready');
|
||||
});
|
||||
|
||||
it('should incorporate the provided query values into the location change', () => {
|
||||
var locationStrategy = new MockLocationStrategy();
|
||||
var location = new Location(locationStrategy);
|
||||
|
||||
location.go('/home', 'key=value');
|
||||
expect(location.path()).toEqual('/home?key=value');
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,178 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {APP_BASE_HREF, LocationStrategy, PathLocationStrategy, PlatformLocation} from '@angular/common';
|
||||
import {Injector, provide} from '@angular/core';
|
||||
import {beforeEach, beforeEachProviders, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {SpyPlatformLocation} from '../spies';
|
||||
|
||||
export function main() {
|
||||
describe('PathLocationStrategy', () => {
|
||||
var platformLocation: any /** TODO #9100 */, locationStrategy: any /** TODO #9100 */;
|
||||
|
||||
beforeEachProviders(() => [PathLocationStrategy, {
|
||||
provide: PlatformLocation,
|
||||
useFactory: makeSpyPlatformLocation
|
||||
}]);
|
||||
|
||||
it('should throw without a base element or APP_BASE_HREF', () => {
|
||||
platformLocation = new SpyPlatformLocation();
|
||||
platformLocation.pathname = '';
|
||||
platformLocation.spy('getBaseHrefFromDOM').andReturn(null);
|
||||
|
||||
expect(() => new PathLocationStrategy(platformLocation))
|
||||
.toThrowError(
|
||||
'No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.');
|
||||
});
|
||||
|
||||
describe('without APP_BASE_HREF', () => {
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, PathLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', 'foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', 'foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with APP_BASE_HREF with neither leading nor trailing slash', () => {
|
||||
beforeEachProviders(() => [{provide: APP_BASE_HREF, useValue: 'app'}]);
|
||||
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, PathLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('app/foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', 'app/foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('app/foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', 'app/foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('app');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', 'app');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with APP_BASE_HREF with leading slash', () => {
|
||||
beforeEachProviders(() => [{provide: APP_BASE_HREF, useValue: '/app'}]);
|
||||
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, PathLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('/app/foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '/app/foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('/app/foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', '/app/foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('/app');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '/app');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with APP_BASE_HREF with both leading and trailing slash', () => {
|
||||
beforeEachProviders(() => [{provide: APP_BASE_HREF, useValue: '/app/'}]);
|
||||
|
||||
beforeEach(inject(
|
||||
[PlatformLocation, PathLocationStrategy],
|
||||
(pl: any /** TODO #9100 */, ls: any /** TODO #9100 */) => {
|
||||
platformLocation = pl;
|
||||
locationStrategy = ls;
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
}));
|
||||
|
||||
it('should prepend urls with a hash for non-empty URLs', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo')).toEqual('/app/foo');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '/app/foo');
|
||||
});
|
||||
|
||||
it('should prepend urls with a hash for URLs with query params', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('foo?bar')).toEqual('/app/foo?bar');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', 'foo', 'bar=baz');
|
||||
expect(platformLocation.spy('pushState'))
|
||||
.toHaveBeenCalledWith(null, 'Title', '/app/foo?bar=baz');
|
||||
});
|
||||
|
||||
it('should not prepend a hash to external urls for an empty internal URL', () => {
|
||||
expect(locationStrategy.prepareExternalUrl('')).toEqual('/app/');
|
||||
|
||||
locationStrategy.pushState(null, 'Title', '', '');
|
||||
expect(platformLocation.spy('pushState')).toHaveBeenCalledWith(null, 'Title', '/app/');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function makeSpyPlatformLocation() {
|
||||
var platformLocation = new SpyPlatformLocation();
|
||||
platformLocation.spy('getBaseHrefFromDOM').andReturn('');
|
||||
platformLocation.spy('pushState');
|
||||
platformLocation.pathname = '';
|
||||
return platformLocation;
|
||||
}
|
|
@ -1,288 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {LocationStrategy} from '@angular/common';
|
||||
import {MockLocationStrategy} from '@angular/common/testing/mock_location_strategy';
|
||||
import {ExceptionHandler, disposePlatform} from '@angular/core';
|
||||
import {Console} from '@angular/core/src/console';
|
||||
import {Component, Directive} from '@angular/core/src/metadata';
|
||||
import {AsyncTestCompleter, beforeEach, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
|
||||
import {DOCUMENT} from '@angular/platform-browser/src/dom/dom_tokens';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig, Router} from '@angular/router-deprecated';
|
||||
|
||||
class _ArrayLogger {
|
||||
res: any[] = [];
|
||||
log(s: any): void { this.res.push(s); }
|
||||
logError(s: any): void { this.res.push(s); }
|
||||
logGroup(s: any): void { this.res.push(s); }
|
||||
logGroupEnd(){};
|
||||
}
|
||||
|
||||
class DummyConsole implements Console {
|
||||
log(message: any /** TODO #9100 */) {}
|
||||
warn(message: any /** TODO #9100 */) {}
|
||||
}
|
||||
|
||||
export function main() {
|
||||
describe('RouteConfig with POJO arguments', () => {
|
||||
var fakeDoc: any /** TODO #9100 */, el: any /** TODO #9100 */,
|
||||
testBindings: any /** TODO #9100 */;
|
||||
beforeEach(() => {
|
||||
disposePlatform();
|
||||
fakeDoc = getDOM().createHtmlDocument();
|
||||
el = getDOM().createElement('app-cmp', fakeDoc);
|
||||
getDOM().appendChild(fakeDoc.body, el);
|
||||
var logger = new _ArrayLogger();
|
||||
var exceptionHandler = new ExceptionHandler(logger, false);
|
||||
testBindings = [
|
||||
ROUTER_PROVIDERS, {provide: LocationStrategy, useClass: MockLocationStrategy},
|
||||
{provide: DOCUMENT, useValue: fakeDoc},
|
||||
{provide: ExceptionHandler, useValue: exceptionHandler},
|
||||
{provide: Console, useClass: DummyConsole}
|
||||
];
|
||||
});
|
||||
|
||||
afterEach(() => disposePlatform());
|
||||
|
||||
it('should bootstrap an app with a hierarchy',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(HierarchyAppCmp, testBindings).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('root [ parent [ hello ] ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('/parent/child');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/parent/child');
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should work in an app with redirects',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(RedirectAppCmp, testBindings).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('root [ hello ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('/after');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/before');
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should work in an app with async components',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(AsyncAppCmp, testBindings).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('root [ hello ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('/hello');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/hello');
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should work in an app with aux routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(AuxAppCmp, testBindings).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('root [ hello ] aside [ hello ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('/hello(aside)');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/hello(aside)');
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should work in an app with async components defined with "loader"',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(ConciseAsyncAppCmp, testBindings).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('root [ hello ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('/hello');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/hello');
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should work in an app with a constructor component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(ExplicitConstructorAppCmp, testBindings).then((applicationRef) => {
|
||||
var router = applicationRef.instance.router;
|
||||
router.subscribe((_: any /** TODO #9100 */) => {
|
||||
expect(el).toHaveText('root [ hello ]');
|
||||
expect(applicationRef.instance.location.path()).toEqual('/hello');
|
||||
async.done();
|
||||
});
|
||||
router.navigateByUrl('/hello');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw if a config is missing a target',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(WrongConfigCmp, testBindings).catch((e) => {
|
||||
expect(e.originalException)
|
||||
.toContainError(
|
||||
'Route config should contain exactly one "component", "loader", or "redirectTo" property.');
|
||||
async.done();
|
||||
return null;
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw if a config has an invalid component type',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(WrongComponentTypeCmp, testBindings).catch((e) => {
|
||||
expect(e.originalException)
|
||||
.toContainError(
|
||||
'Invalid component type "intentionallyWrongComponentType". Valid types are "constructor" and "loader".');
|
||||
async.done();
|
||||
return null;
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw if a config has an invalid alias name',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
bootstrap(BadAliasNameCmp, testBindings).catch((e) => {
|
||||
expect(e.originalException)
|
||||
.toContainError(
|
||||
`Route "/child" with name "child" does not begin with an uppercase letter. Route names should be PascalCase like "Child".`);
|
||||
async.done();
|
||||
return null;
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'hello-cmp', template: 'hello'})
|
||||
class HelloCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/before', redirectTo: ['Hello']}, {path: '/after', component: HelloCmp, name: 'Hello'}
|
||||
])
|
||||
class RedirectAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
function HelloLoader(): Promise<any> {
|
||||
return Promise.resolve(HelloCmp);
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/hello', component: {type: 'loader', loader: HelloLoader}},
|
||||
])
|
||||
class AsyncAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/hello', loader: HelloLoader},
|
||||
])
|
||||
class ConciseAsyncAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template:
|
||||
`root [ <router-outlet></router-outlet> ] aside [ <router-outlet name="aside"></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([{path: '/hello', component: HelloCmp}, {aux: 'aside', component: HelloCmp}])
|
||||
class AuxAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/hello', component: {type: 'constructor', constructor: HelloCmp}},
|
||||
])
|
||||
class ExplicitConstructorAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'parent-cmp',
|
||||
template: `parent [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([{path: '/child', component: HelloCmp}])
|
||||
class ParentCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([{path: '/parent/...', component: ParentCmp}])
|
||||
class HierarchyAppCmp {
|
||||
constructor(public router: Router, public location: LocationStrategy) {}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([{path: '/hello'}])
|
||||
class WrongConfigCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([{path: '/child', component: HelloCmp, name: 'child'}])
|
||||
class BadAliasNameCmp {
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-cmp',
|
||||
template: `root [ <router-outlet></router-outlet> ]`,
|
||||
directives: ROUTER_DIRECTIVES
|
||||
})
|
||||
@RouteConfig([
|
||||
{path: '/hello', component: {type: 'intentionallyWrongComponentType', constructor: HelloCmp}},
|
||||
])
|
||||
class WrongComponentTypeCmp {
|
||||
}
|
|
@ -1,365 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {AsyncTestCompleter, beforeEach, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
import {Type} from '../src/facade/lang';
|
||||
import {AsyncRoute, AuxRoute, Redirect, Route, RouteConfig} from '../src/route_config/route_config_decorator';
|
||||
import {RouteRegistry} from '../src/route_registry';
|
||||
|
||||
|
||||
export function main() {
|
||||
describe('RouteRegistry', () => {
|
||||
var registry: RouteRegistry;
|
||||
|
||||
beforeEach(() => { registry = new RouteRegistry(RootHostCmp); });
|
||||
|
||||
it('should match the full URL', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/', component: DummyCmpA}));
|
||||
registry.config(RootHostCmp, new Route({path: '/test', component: DummyCmpB}));
|
||||
|
||||
registry.recognize('/test', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpB);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate URLs starting at the given component', () => {
|
||||
registry.config(
|
||||
RootHostCmp,
|
||||
new Route({path: '/first/...', component: DummyParentCmp, name: 'FirstCmp'}));
|
||||
|
||||
var instr = registry.generate(['FirstCmp', 'SecondCmp'], []);
|
||||
expect(stringifyInstruction(instr)).toEqual('first/second');
|
||||
|
||||
expect(stringifyInstruction(registry.generate(['SecondCmp'], [instr, instr.child])))
|
||||
.toEqual('first/second');
|
||||
expect(stringifyInstruction(registry.generate(['./SecondCmp'], [instr, instr.child])))
|
||||
.toEqual('first/second');
|
||||
});
|
||||
|
||||
it('should generate URLs that account for default routes', () => {
|
||||
registry.config(
|
||||
RootHostCmp,
|
||||
new Route({path: '/first/...', component: ParentWithDefaultRouteCmp, name: 'FirstCmp'}));
|
||||
|
||||
var instruction = registry.generate(['FirstCmp'], []);
|
||||
|
||||
expect(instruction.toLinkUrl()).toEqual('first');
|
||||
expect(instruction.toRootUrl()).toEqual('first/second');
|
||||
});
|
||||
|
||||
it('should generate URLs in a hierarchy of default routes', () => {
|
||||
registry.config(
|
||||
RootHostCmp,
|
||||
new Route({path: '/first/...', component: MultipleDefaultCmp, name: 'FirstCmp'}));
|
||||
|
||||
var instruction = registry.generate(['FirstCmp'], []);
|
||||
|
||||
expect(instruction.toLinkUrl()).toEqual('first');
|
||||
expect(instruction.toRootUrl()).toEqual('first/second/third');
|
||||
});
|
||||
|
||||
it('should generate URLs with params', () => {
|
||||
registry.config(
|
||||
RootHostCmp,
|
||||
new Route({path: '/first/:param/...', component: DummyParentParamCmp, name: 'FirstCmp'}));
|
||||
|
||||
var url = stringifyInstruction(
|
||||
registry.generate(['FirstCmp', {param: 'one'}, 'SecondCmp', {param: 'two'}], []));
|
||||
expect(url).toEqual('first/one/second/two');
|
||||
});
|
||||
|
||||
it('should generate params as an empty StringMap when no params are given', () => {
|
||||
registry.config(RootHostCmp, new Route({path: '/test', component: DummyCmpA, name: 'Test'}));
|
||||
var instruction = registry.generate(['Test'], []);
|
||||
expect(instruction.component.params).toEqual({});
|
||||
});
|
||||
|
||||
it('should generate URLs with extra params in the query', () => {
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/first/second', component: DummyCmpA, name: 'FirstCmp'}));
|
||||
|
||||
var instruction = registry.generate(['FirstCmp', {a: 'one'}], []);
|
||||
expect(instruction.toLinkUrl()).toEqual('first/second?a=one');
|
||||
});
|
||||
|
||||
|
||||
it('should generate URLs of loaded components after they are loaded',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(
|
||||
RootHostCmp,
|
||||
new AsyncRoute({path: '/first/...', loader: asyncParentLoader, name: 'FirstCmp'}));
|
||||
|
||||
var instruction = registry.generate(['FirstCmp', 'SecondCmp'], []);
|
||||
|
||||
expect(stringifyInstruction(instruction)).toEqual('first');
|
||||
|
||||
registry.recognize('/first/second', []).then((_) => {
|
||||
var instruction = registry.generate(['FirstCmp', 'SecondCmp'], []);
|
||||
expect(stringifyInstruction(instruction)).toEqual('first/second');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw when generating a url and a parent has no config', () => {
|
||||
expect(() => registry.generate(['FirstCmp', 'SecondCmp'], [
|
||||
])).toThrowError('Component "RootHostCmp" has no route config.');
|
||||
});
|
||||
|
||||
it('should generate URLs for aux routes', () => {
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/primary', component: DummyCmpA, name: 'Primary'}));
|
||||
registry.config(RootHostCmp, new AuxRoute({path: '/aux', component: DummyCmpB, name: 'Aux'}));
|
||||
|
||||
expect(stringifyInstruction(registry.generate(['Primary', ['Aux']], [
|
||||
]))).toEqual('primary(aux)');
|
||||
});
|
||||
|
||||
it('should prefer static segments to dynamic',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/:site', component: DummyCmpB}));
|
||||
registry.config(RootHostCmp, new Route({path: '/home', component: DummyCmpA}));
|
||||
|
||||
registry.recognize('/home', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should prefer dynamic segments to star',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/:site', component: DummyCmpA}));
|
||||
registry.config(RootHostCmp, new Route({path: '/*site', component: DummyCmpB}));
|
||||
|
||||
registry.recognize('/home', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should prefer routes with more dynamic segments',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/:first/*rest', component: DummyCmpA}));
|
||||
registry.config(RootHostCmp, new Route({path: '/*all', component: DummyCmpB}));
|
||||
|
||||
registry.recognize('/some/path', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should prefer routes with more static segments',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/first/:second', component: DummyCmpA}));
|
||||
registry.config(RootHostCmp, new Route({path: '/:first/:second', component: DummyCmpB}));
|
||||
|
||||
registry.recognize('/first/second', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should prefer routes with static segments before dynamic segments',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/first/second/:third', component: DummyCmpB}));
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/first/:second/third', component: DummyCmpA}));
|
||||
|
||||
registry.recognize('/first/second/third', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpB);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should prefer routes with high specificity over routes with children with lower specificity',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/first', component: DummyCmpA}));
|
||||
|
||||
// terminates to DummyCmpB
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/:second/...', component: SingleSlashChildCmp}));
|
||||
|
||||
registry.recognize('/first', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should match the full URL using child components',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/first/...', component: DummyParentCmp}));
|
||||
|
||||
registry.recognize('/first/second', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyParentCmp);
|
||||
expect(instruction.child.component.componentType).toBe(DummyCmpB);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should match the URL using async child components',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/first/...', component: DummyAsyncCmp}));
|
||||
|
||||
registry.recognize('/first/second', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyAsyncCmp);
|
||||
|
||||
instruction.child.resolveComponent().then((childComponentInstruction) => {
|
||||
expect(childComponentInstruction.componentType).toBe(DummyCmpB);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should match the URL using an async parent component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(
|
||||
RootHostCmp, new AsyncRoute({path: '/first/...', loader: asyncParentLoader}));
|
||||
|
||||
registry.recognize('/first/second', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyParentCmp);
|
||||
|
||||
instruction.child.resolveComponent().then((childType) => {
|
||||
expect(childType.componentType).toBe(DummyCmpB);
|
||||
async.done();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw when a parent config is missing the `...` suffix any of its children add routes',
|
||||
() => {
|
||||
expect(
|
||||
() => registry.config(RootHostCmp, new Route({path: '/', component: DummyParentCmp})))
|
||||
.toThrowError(
|
||||
'Child routes are not allowed for "/". Use "..." on the parent\'s route path.');
|
||||
});
|
||||
|
||||
it('should throw when a parent config uses `...` suffix before the end of the route', () => {
|
||||
expect(
|
||||
() => registry.config(
|
||||
RootHostCmp, new Route({path: '/home/.../fun/', component: DummyParentCmp})))
|
||||
.toThrowError('Unexpected "..." before the end of the path for "home/.../fun/".');
|
||||
});
|
||||
|
||||
|
||||
it('should throw if a config has a component that is not defined', () => {
|
||||
expect(() => registry.config(RootHostCmp, new Route({path: '/', component: null})))
|
||||
.toThrowError('Component for route "/" is not defined, or is not a class.');
|
||||
expect(() => registry.config(RootHostCmp, new AuxRoute({path: '/', component: null})))
|
||||
.toThrowError('Component for route "/" is not defined, or is not a class.');
|
||||
|
||||
expect(() => registry.config(RootHostCmp, new Route({path: '/', component: <Type>(<any>4)})))
|
||||
.toThrowError('Component for route "/" is not defined, or is not a class.');
|
||||
});
|
||||
|
||||
it('should throw when linkParams are not terminal', () => {
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/first/...', component: DummyParentCmp, name: 'First'}));
|
||||
expect(() => {
|
||||
registry.generate(['First'], []);
|
||||
}).toThrowError(/Link "\["First"\]" does not resolve to a terminal instruction./);
|
||||
});
|
||||
|
||||
it('should match matrix params on child components and query params on the root component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(RootHostCmp, new Route({path: '/first/...', component: DummyParentCmp}));
|
||||
|
||||
registry.recognize('/first/second;filter=odd?comments=all', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(DummyParentCmp);
|
||||
expect(instruction.component.params).toEqual({'comments': 'all'});
|
||||
|
||||
expect(instruction.child.component.componentType).toBe(DummyCmpB);
|
||||
expect(instruction.child.component.params).toEqual({'filter': 'odd'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should match query params on the root component even when the next URL segment is null',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
registry.config(
|
||||
RootHostCmp, new Route({path: '/first/...', component: SingleSlashChildCmp}));
|
||||
|
||||
registry.recognize('/first?comments=all', []).then((instruction) => {
|
||||
expect(instruction.component.componentType).toBe(SingleSlashChildCmp);
|
||||
expect(instruction.component.params).toEqual({'comments': 'all'});
|
||||
|
||||
expect(instruction.child.component.componentType).toBe(DummyCmpB);
|
||||
expect(instruction.child.component.params).toEqual({});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should generate URLs with matrix and query params', () => {
|
||||
registry.config(
|
||||
RootHostCmp,
|
||||
new Route({path: '/first/:param/...', component: DummyParentParamCmp, name: 'FirstCmp'}));
|
||||
|
||||
var url = stringifyInstruction(registry.generate(
|
||||
[
|
||||
'FirstCmp', {param: 'one', query: 'cats'}, 'SecondCmp', {
|
||||
param: 'two',
|
||||
sort: 'asc',
|
||||
}
|
||||
],
|
||||
[]));
|
||||
expect(url).toEqual('first/one/second/two;sort=asc?query=cats');
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function stringifyInstruction(instruction: any /** TODO #9100 */): string {
|
||||
return instruction.toRootUrl();
|
||||
}
|
||||
|
||||
|
||||
function asyncParentLoader() {
|
||||
return Promise.resolve(DummyParentCmp);
|
||||
}
|
||||
|
||||
function asyncChildLoader() {
|
||||
return Promise.resolve(DummyCmpB);
|
||||
}
|
||||
|
||||
class RootHostCmp {}
|
||||
|
||||
@RouteConfig([new AsyncRoute({path: '/second', loader: asyncChildLoader})])
|
||||
class DummyAsyncCmp {
|
||||
}
|
||||
|
||||
class DummyCmpA {}
|
||||
class DummyCmpB {}
|
||||
|
||||
@RouteConfig(
|
||||
[new Route({path: '/third', component: DummyCmpB, name: 'ThirdCmp', useAsDefault: true})])
|
||||
class DefaultRouteCmp {
|
||||
}
|
||||
|
||||
@RouteConfig([new Route({path: '/', component: DummyCmpB, name: 'ThirdCmp'})])
|
||||
class SingleSlashChildCmp {
|
||||
}
|
||||
|
||||
|
||||
@RouteConfig([new Route(
|
||||
{path: '/second/...', component: DefaultRouteCmp, name: 'SecondCmp', useAsDefault: true})])
|
||||
class MultipleDefaultCmp {
|
||||
}
|
||||
|
||||
@RouteConfig(
|
||||
[new Route({path: '/second', component: DummyCmpB, name: 'SecondCmp', useAsDefault: true})])
|
||||
class ParentWithDefaultRouteCmp {
|
||||
}
|
||||
|
||||
@RouteConfig([new Route({path: '/second', component: DummyCmpB, name: 'SecondCmp'})])
|
||||
class DummyParentCmp {
|
||||
}
|
||||
|
||||
|
||||
@RouteConfig([new Route({path: '/second/:param', component: DummyCmpB, name: 'SecondCmp'})])
|
||||
class DummyParentParamCmp {
|
||||
}
|
|
@ -1,346 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {SpyLocation} from '@angular/common/testing';
|
||||
import {provide} from '@angular/core';
|
||||
import {AsyncTestCompleter, beforeEach, beforeEachProviders, ddescribe, describe, expect, iit, inject, it, xit} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {RouterOutlet} from '../src/directives/router_outlet';
|
||||
import {ListWrapper} from '../src/facade/collection';
|
||||
import {Type} from '../src/facade/lang';
|
||||
import {AsyncRoute, Redirect, Route, RouteConfig} from '../src/route_config/route_config_decorator';
|
||||
import {ROUTER_PRIMARY_COMPONENT, RouteRegistry} from '../src/route_registry';
|
||||
import {RootRouter, Router} from '../src/router';
|
||||
|
||||
import {SpyRouterOutlet} from './spies';
|
||||
|
||||
export function main() {
|
||||
describe('Router', () => {
|
||||
var router: Router;
|
||||
var location: Location;
|
||||
|
||||
beforeEachProviders(
|
||||
() =>
|
||||
[RouteRegistry, {provide: Location, useClass: SpyLocation},
|
||||
{provide: ROUTER_PRIMARY_COMPONENT, useValue: AppCmp},
|
||||
{provide: Router, useClass: RootRouter}]);
|
||||
|
||||
|
||||
beforeEach(inject([Router, Location], (rtr: Router, loc: Location) => {
|
||||
router = rtr;
|
||||
location = loc;
|
||||
}));
|
||||
|
||||
|
||||
it('should navigate based on the initial URL state',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.config([new Route({path: '/', component: DummyComponent})])
|
||||
.then((_) => router.registerPrimaryOutlet(outlet))
|
||||
.then((_) => {
|
||||
expect((<any>outlet).spy('activate')).toHaveBeenCalled();
|
||||
expect((<SpyLocation>location).urlChanges).toEqual([]);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should activate viewports and update URL on navigate',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([new Route({path: '/a', component: DummyComponent})]))
|
||||
.then((_) => router.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
expect((<any>outlet).spy('activate')).toHaveBeenCalled();
|
||||
expect((<SpyLocation>location).urlChanges).toEqual(['/a']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should activate viewports and update URL when navigating via DSL',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then(
|
||||
(_) =>
|
||||
router.config([new Route({path: '/a', component: DummyComponent, name: 'A'})]))
|
||||
.then((_) => router.navigate(['/A']))
|
||||
.then((_) => {
|
||||
expect((<any>outlet).spy('activate')).toHaveBeenCalled();
|
||||
expect((<SpyLocation>location).urlChanges).toEqual(['/a']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not push a history change on when navigate is called with skipUrlChange',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([new Route({path: '/b', component: DummyComponent})]))
|
||||
.then((_) => router.navigateByUrl('/b', true))
|
||||
.then((_) => {
|
||||
expect((<any>outlet).spy('activate')).toHaveBeenCalled();
|
||||
expect((<SpyLocation>location).urlChanges).toEqual([]);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
// See https://github.com/angular/angular/issues/5590
|
||||
// This test is disabled because it is flaky.
|
||||
// TODO: bford. make this test not flaky and reenable it.
|
||||
xit('should replace history when triggered by a hashchange with a redirect',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([
|
||||
new Redirect({path: '/a', redirectTo: ['B']}),
|
||||
new Route({path: '/b', component: DummyComponent, name: 'B'})
|
||||
]))
|
||||
.then((_) => {
|
||||
router.subscribe((_) => {
|
||||
expect((<SpyLocation>location).urlChanges).toEqual(['hash: a', 'replace: /b']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
(<SpyLocation>location).simulateHashChange('a');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should push history when triggered by a hashchange without a redirect',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([new Route({path: '/a', component: DummyComponent})]))
|
||||
.then((_) => {
|
||||
router.subscribe((_) => {
|
||||
expect((<SpyLocation>location).urlChanges).toEqual(['hash: a']);
|
||||
async.done();
|
||||
});
|
||||
|
||||
(<SpyLocation>location).simulateHashChange('a');
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should pass an object containing the component instruction to the router change subscription after a successful navigation',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([new Route({path: '/a', component: DummyComponent})]))
|
||||
.then((_) => {
|
||||
router.subscribe(({status, instruction}) => {
|
||||
expect(status).toEqual('success');
|
||||
expect(instruction)
|
||||
.toEqual(jasmine.objectContaining({urlPath: 'a', urlParams: []}));
|
||||
async.done();
|
||||
});
|
||||
(<SpyLocation>location).simulateHashChange('a');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should pass an object containing the bad url to the router change subscription after a failed navigation',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([new Route({path: '/a', component: DummyComponent})]))
|
||||
.then((_) => {
|
||||
router.subscribe(({status, url}) => {
|
||||
expect(status).toEqual('fail');
|
||||
expect(url).toEqual('b');
|
||||
async.done();
|
||||
});
|
||||
(<SpyLocation>location).simulateHashChange('b');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should navigate after being configured',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
expect((<any>outlet).spy('activate')).not.toHaveBeenCalled();
|
||||
return router.config([new Route({path: '/a', component: DummyComponent})]);
|
||||
})
|
||||
.then((_) => {
|
||||
expect((<any>outlet).spy('activate')).toHaveBeenCalled();
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should throw when linkParams does not include a route name', () => {
|
||||
expect(() => router.generate(['./']))
|
||||
.toThrowError(`Link "${ListWrapper.toJSON(['./'])}" must include a route name.`);
|
||||
expect(() => router.generate(['/']))
|
||||
.toThrowError(`Link "${ListWrapper.toJSON(['/'])}" must include a route name.`);
|
||||
});
|
||||
|
||||
it('should, when subscribed to, return a disposable subscription', () => {
|
||||
expect(() => {
|
||||
var subscription = router.subscribe((_) => {});
|
||||
(<any>subscription).unsubscribe();
|
||||
}).not.toThrow();
|
||||
});
|
||||
|
||||
it('should generate URLs from the root component when the path starts with /', () => {
|
||||
router.config(
|
||||
[new Route({path: '/first/...', component: DummyParentComp, name: 'FirstCmp'})]);
|
||||
|
||||
var instruction = router.generate(['/FirstCmp', 'SecondCmp']);
|
||||
expect(stringifyInstruction(instruction)).toEqual('first/second');
|
||||
|
||||
instruction = router.generate(['/FirstCmp/SecondCmp']);
|
||||
expect(stringifyInstruction(instruction)).toEqual('first/second');
|
||||
});
|
||||
|
||||
it('should generate an instruction with terminal async routes',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet);
|
||||
router.config([new AsyncRoute({path: '/first', loader: loader, name: 'FirstCmp'})]);
|
||||
|
||||
var instruction = router.generate(['/FirstCmp']);
|
||||
router.navigateByInstruction(instruction).then((_) => {
|
||||
expect((<any>outlet).spy('activate')).toHaveBeenCalled();
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should return whether a given instruction is active with isRouteActive',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([
|
||||
new Route({path: '/a', component: DummyComponent, name: 'A'}),
|
||||
new Route({path: '/b', component: DummyComponent, name: 'B'})
|
||||
]))
|
||||
.then((_) => router.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
var instruction = router.generate(['/A']);
|
||||
var otherInstruction = router.generate(['/B']);
|
||||
|
||||
expect(router.isRouteActive(instruction)).toEqual(true);
|
||||
expect(router.isRouteActive(otherInstruction)).toEqual(false);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should provide the current instruction',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
var outlet = makeDummyOutlet();
|
||||
|
||||
router.registerPrimaryOutlet(outlet)
|
||||
.then((_) => router.config([
|
||||
new Route({path: '/a', component: DummyComponent, name: 'A'}),
|
||||
new Route({path: '/b', component: DummyComponent, name: 'B'})
|
||||
]))
|
||||
.then((_) => router.navigateByUrl('/a'))
|
||||
.then((_) => {
|
||||
var instruction = router.generate(['/A']);
|
||||
|
||||
expect(router.currentInstruction).toEqual(instruction);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should provide the root level router from child routers', () => {
|
||||
let childRouter = router.childRouter(DummyComponent);
|
||||
expect(childRouter.root).toBe(router);
|
||||
});
|
||||
|
||||
describe('query string params', () => {
|
||||
it('should use query string params for the root route', () => {
|
||||
router.config(
|
||||
[new Route({path: '/hi/how/are/you', component: DummyComponent, name: 'GreetingUrl'})]);
|
||||
|
||||
var instruction = router.generate(['/GreetingUrl', {'name': 'brad'}]);
|
||||
var path = stringifyInstruction(instruction);
|
||||
expect(path).toEqual('hi/how/are/you?name=brad');
|
||||
});
|
||||
|
||||
it('should preserve the number 1 as a query string value', () => {
|
||||
router.config(
|
||||
[new Route({path: '/hi/how/are/you', component: DummyComponent, name: 'GreetingUrl'})]);
|
||||
|
||||
var instruction = router.generate(['/GreetingUrl', {'name': 1}]);
|
||||
var path = stringifyInstruction(instruction);
|
||||
expect(path).toEqual('hi/how/are/you?name=1');
|
||||
});
|
||||
|
||||
it('should serialize parameters that are not part of the route definition as query string params',
|
||||
() => {
|
||||
router.config([new Route(
|
||||
{path: '/one/two/:three', component: DummyComponent, name: 'NumberUrl'})]);
|
||||
|
||||
var instruction = router.generate(['/NumberUrl', {'three': 'three', 'four': 'four'}]);
|
||||
var path = stringifyInstruction(instruction);
|
||||
expect(path).toEqual('one/two/three?four=four');
|
||||
});
|
||||
});
|
||||
|
||||
describe('matrix params', () => {
|
||||
it('should generate matrix params for each non-root component', () => {
|
||||
router.config(
|
||||
[new Route({path: '/first/...', component: DummyParentComp, name: 'FirstCmp'})]);
|
||||
|
||||
var instruction =
|
||||
router.generate(['/FirstCmp', {'key': 'value'}, 'SecondCmp', {'project': 'angular'}]);
|
||||
var path = stringifyInstruction(instruction);
|
||||
expect(path).toEqual('first/second;project=angular?key=value');
|
||||
});
|
||||
|
||||
it('should work with named params', () => {
|
||||
router.config(
|
||||
[new Route({path: '/first/:token/...', component: DummyParentComp, name: 'FirstCmp'})]);
|
||||
|
||||
var instruction =
|
||||
router.generate(['/FirstCmp', {'token': 'min'}, 'SecondCmp', {'author': 'max'}]);
|
||||
var path = stringifyInstruction(instruction);
|
||||
expect(path).toEqual('first/min/second;author=max');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function stringifyInstruction(instruction: any /** TODO #9100 */): string {
|
||||
return instruction.toRootUrl();
|
||||
}
|
||||
|
||||
function loader(): Promise<Type> {
|
||||
return Promise.resolve(DummyComponent);
|
||||
}
|
||||
|
||||
class DummyComponent {}
|
||||
|
||||
@RouteConfig([new Route({path: '/second', component: DummyComponent, name: 'SecondCmp'})])
|
||||
class DummyParentComp {
|
||||
}
|
||||
|
||||
function makeDummyOutlet(): RouterOutlet {
|
||||
var ref = new SpyRouterOutlet();
|
||||
ref.spy('canActivate').andCallFake((_: any /** TODO #9100 */) => Promise.resolve(true));
|
||||
ref.spy('routerCanReuse').andCallFake((_: any /** TODO #9100 */) => Promise.resolve(false));
|
||||
ref.spy('routerCanDeactivate').andCallFake((_: any /** TODO #9100 */) => Promise.resolve(true));
|
||||
ref.spy('activate').andCallFake((_: any /** TODO #9100 */) => Promise.resolve(true));
|
||||
return <any>ref;
|
||||
}
|
||||
|
||||
class AppCmp {}
|
|
@ -1,128 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {beforeEach, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {ParamRoutePath} from '../../../src/rules/route_paths/param_route_path';
|
||||
import {Url, parser} from '../../../src/url_parser';
|
||||
|
||||
export function main() {
|
||||
describe('PathRecognizer', () => {
|
||||
|
||||
it('should throw when given an invalid path', () => {
|
||||
expect(() => new ParamRoutePath('/hi#'))
|
||||
.toThrowError(`Path "/hi#" should not include "#". Use "HashLocationStrategy" instead.`);
|
||||
expect(() => new ParamRoutePath('hi?'))
|
||||
.toThrowError(`Path "hi?" contains "?" which is not allowed in a route config.`);
|
||||
expect(() => new ParamRoutePath('hi;'))
|
||||
.toThrowError(`Path "hi;" contains ";" which is not allowed in a route config.`);
|
||||
expect(() => new ParamRoutePath('hi='))
|
||||
.toThrowError(`Path "hi=" contains "=" which is not allowed in a route config.`);
|
||||
expect(() => new ParamRoutePath('hi('))
|
||||
.toThrowError(`Path "hi(" contains "(" which is not allowed in a route config.`);
|
||||
expect(() => new ParamRoutePath('hi)'))
|
||||
.toThrowError(`Path "hi)" contains ")" which is not allowed in a route config.`);
|
||||
expect(() => new ParamRoutePath('hi//there'))
|
||||
.toThrowError(`Path "hi//there" contains "//" which is not allowed in a route config.`);
|
||||
});
|
||||
|
||||
describe('querystring params', () => {
|
||||
it('should parse querystring params so long as the recognizer is a root', () => {
|
||||
var rec = new ParamRoutePath('/hello/there');
|
||||
var url = parser.parse('/hello/there?name=igor');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'name': 'igor'});
|
||||
});
|
||||
|
||||
it('should return a combined map of parameters with the param expected in the URL path',
|
||||
() => {
|
||||
var rec = new ParamRoutePath('/hello/:name');
|
||||
var url = parser.parse('/hello/paul?topic=success');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'name': 'paul', 'topic': 'success'});
|
||||
});
|
||||
});
|
||||
|
||||
describe('dynamic segments', () => {
|
||||
it('should parse parameters', () => {
|
||||
var rec = new ParamRoutePath('/test/:id');
|
||||
var url = new Url('test', new Url('abc'));
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'id': 'abc'});
|
||||
});
|
||||
|
||||
it('should decode special characters when parsing', () => {
|
||||
var rec = new ParamRoutePath('/test/:id');
|
||||
var url = new Url('test', new Url('abc%25%2F%2f%28%29%3B'));
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'id': 'abc%//();'});
|
||||
});
|
||||
|
||||
it('should generate url', () => {
|
||||
var rec = new ParamRoutePath('/test/:id');
|
||||
expect(rec.generateUrl({'id': 'abc'}).urlPath).toEqual('test/abc');
|
||||
});
|
||||
|
||||
it('should encode special characters when generating', () => {
|
||||
var rec = new ParamRoutePath('/test/:id');
|
||||
expect(rec.generateUrl({'id': 'abc/def/%();'}).urlPath)
|
||||
.toEqual('test/abc%2Fdef%2F%25%28%29%3B');
|
||||
});
|
||||
});
|
||||
|
||||
describe('matrix params', () => {
|
||||
it('should be parsed along with dynamic paths', () => {
|
||||
var rec = new ParamRoutePath('/hello/:id');
|
||||
var url = new Url('hello', new Url('matias', null, null, {'key': 'value'}));
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'id': 'matias', 'key': 'value'});
|
||||
});
|
||||
|
||||
it('should be parsed on a static path', () => {
|
||||
var rec = new ParamRoutePath('/person');
|
||||
var url = new Url('person', null, null, {'name': 'dave'});
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'name': 'dave'});
|
||||
});
|
||||
|
||||
it('should be ignored on a wildcard segment', () => {
|
||||
var rec = new ParamRoutePath('/wild/*everything');
|
||||
var url = parser.parse('/wild/super;variable=value');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'everything': 'super;variable=value'});
|
||||
});
|
||||
|
||||
it('should set matrix param values to true when no value is present', () => {
|
||||
var rec = new ParamRoutePath('/path');
|
||||
var url = new Url('path', null, null, {'one': true, 'two': true, 'three': '3'});
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'one': true, 'two': true, 'three': '3'});
|
||||
});
|
||||
|
||||
it('should be parsed on the final segment of the path', () => {
|
||||
var rec = new ParamRoutePath('/one/two/three');
|
||||
|
||||
var three = new Url('three', null, null, {'c': '3'});
|
||||
var two = new Url('two', three, null, {'b': '2'});
|
||||
var one = new Url('one', two, null, {'a': '1'});
|
||||
|
||||
var match = rec.matchUrl(one);
|
||||
expect(match.allParams).toEqual({'c': '3'});
|
||||
});
|
||||
});
|
||||
|
||||
describe('wildcard segment', () => {
|
||||
it('should return a url path which matches the original url path', () => {
|
||||
var rec = new ParamRoutePath('/wild/*everything');
|
||||
var url = parser.parse('/wild/super;variable=value/anotherPartAfterSlash');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.urlPath).toEqual('wild/super;variable=value/anotherPartAfterSlash');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,65 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {beforeEach, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {RegexRoutePath} from '../../../src/rules/route_paths/regex_route_path';
|
||||
import {GeneratedUrl} from '../../../src/rules/route_paths/route_path';
|
||||
import {parser} from '../../../src/url_parser';
|
||||
|
||||
function emptySerializer(params: any /** TODO #9100 */) {
|
||||
return new GeneratedUrl('', {});
|
||||
}
|
||||
|
||||
export function main() {
|
||||
describe('RegexRoutePath', () => {
|
||||
|
||||
it('should throw when given an invalid regex',
|
||||
() => { expect(() => new RegexRoutePath('[abc', emptySerializer)).toThrowError(); });
|
||||
|
||||
it('should parse a single param using capture groups', () => {
|
||||
var rec = new RegexRoutePath('^(.+)$', emptySerializer);
|
||||
var url = parser.parse('hello');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'0': 'hello', '1': 'hello'});
|
||||
});
|
||||
|
||||
it('should parse multiple params using capture groups', () => {
|
||||
var rec = new RegexRoutePath('^(.+)\\.(.+)$', emptySerializer);
|
||||
var url = parser.parse('hello.goodbye');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'0': 'hello.goodbye', '1': 'hello', '2': 'goodbye'});
|
||||
});
|
||||
|
||||
it('should generate a url by calling the provided serializer', () => {
|
||||
function serializer(params: any /** TODO #9100 */) {
|
||||
return new GeneratedUrl(`/a/${params['a']}/b/${params['b']}`, {});
|
||||
}
|
||||
var rec = new RegexRoutePath('/a/(.+)/b/(.+)$', serializer);
|
||||
var params = {a: 'one', b: 'two'};
|
||||
var url = rec.generateUrl(params);
|
||||
expect(url.urlPath).toEqual('/a/one/b/two');
|
||||
});
|
||||
|
||||
it('should raise an error when the number of parameters doesnt match', () => {
|
||||
expect(() => {
|
||||
new RegexRoutePath('^a-([0-9]+)-b-([0-9]+)$', emptySerializer, ['complete_match', 'a']);
|
||||
}).toThrowError(`Regex group names [complete_match,a] must contain names for each matching \
|
||||
group and a name for the complete match as its first element of regex '^a-([0-9]+)-b-([0-9]+)$'. \
|
||||
3 group names are expected.`);
|
||||
});
|
||||
|
||||
it('should take group naming into account when passing params', () => {
|
||||
var rec = new RegexRoutePath(
|
||||
'^a-([0-9]+)-b-([0-9]+)$', emptySerializer, ['complete_match', 'a', 'b']);
|
||||
var url = parser.parse('a-123-b-345');
|
||||
var match = rec.matchUrl(url);
|
||||
expect(match.allParams).toEqual({'complete_match': 'a-123-b-345', 'a': '123', 'b': '345'});
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,268 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {AsyncTestCompleter, beforeEach, ddescribe, describe, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
import {expect} from '@angular/platform-browser/testing/matchers';
|
||||
import {Redirect, Route} from '../../src/route_config/route_config_decorator';
|
||||
import {GeneratedUrl} from '../../src/rules/route_paths/route_path';
|
||||
import {RuleSet} from '../../src/rules/rule_set';
|
||||
import {PathMatch, RedirectMatch, RouteMatch} from '../../src/rules/rules';
|
||||
import {parser} from '../../src/url_parser';
|
||||
|
||||
|
||||
export function main() {
|
||||
describe('RuleSet', () => {
|
||||
var recognizer: RuleSet;
|
||||
|
||||
beforeEach(() => { recognizer = new RuleSet(); });
|
||||
|
||||
|
||||
it('should recognize a static segment',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(new Route({path: '/test', component: DummyCmpA}));
|
||||
recognize(recognizer, '/test').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getComponentType(solutions[0])).toEqual(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should recognize a single slash',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(new Route({path: '/', component: DummyCmpA}));
|
||||
recognize(recognizer, '/').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getComponentType(solutions[0])).toEqual(DummyCmpA);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should recognize a dynamic segment',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(new Route({path: '/user/:name', component: DummyCmpA}));
|
||||
recognize(recognizer, '/user/brian').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getComponentType(solutions[0])).toEqual(DummyCmpA);
|
||||
expect(getParams(solutions[0])).toEqual({'name': 'brian'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should recognize a star segment',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(new Route({path: '/first/*rest', component: DummyCmpA}));
|
||||
recognize(recognizer, '/first/second/third').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getComponentType(solutions[0])).toEqual(DummyCmpA);
|
||||
expect(getParams(solutions[0])).toEqual({'rest': 'second/third'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should recognize a regex', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
function emptySerializer(params: any /** TODO #9100 */): GeneratedUrl {
|
||||
return new GeneratedUrl('', {});
|
||||
}
|
||||
|
||||
recognizer.config(
|
||||
new Route({regex: '^(.+)/(.+)$', serializer: emptySerializer, component: DummyCmpA}));
|
||||
recognize(recognizer, '/first/second').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getComponentType(solutions[0])).toEqual(DummyCmpA);
|
||||
expect(getParams(solutions[0]))
|
||||
.toEqual({'0': 'first/second', '1': 'first', '2': 'second'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should recognize a regex with named_groups',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
function emptySerializer(params: any /** TODO #9100 */): GeneratedUrl {
|
||||
return new GeneratedUrl('', {});
|
||||
}
|
||||
|
||||
recognizer.config(new Route({
|
||||
regex: '^(.+)/(.+)$',
|
||||
regex_group_names: ['cc', 'a', 'b'],
|
||||
serializer: emptySerializer,
|
||||
component: DummyCmpA
|
||||
}));
|
||||
recognize(recognizer, '/first/second').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getComponentType(solutions[0])).toEqual(DummyCmpA);
|
||||
expect(getParams(solutions[0]))
|
||||
.toEqual({'cc': 'first/second', 'a': 'first', 'b': 'second'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
|
||||
it('should throw when given two routes that start with the same static segment', () => {
|
||||
recognizer.config(new Route({path: '/hello', component: DummyCmpA}));
|
||||
expect(() => recognizer.config(new Route({path: '/hello', component: DummyCmpB})))
|
||||
.toThrowError('Configuration \'/hello\' conflicts with existing route \'/hello\'');
|
||||
});
|
||||
|
||||
|
||||
it('should throw when given two routes that have dynamic segments in the same order', () => {
|
||||
recognizer.config(new Route({path: '/hello/:person/how/:doyoudou', component: DummyCmpA}));
|
||||
expect(
|
||||
() => recognizer.config(
|
||||
new Route({path: '/hello/:friend/how/:areyou', component: DummyCmpA})))
|
||||
.toThrowError(
|
||||
'Configuration \'/hello/:friend/how/:areyou\' conflicts with existing route \'/hello/:person/how/:doyoudou\'');
|
||||
|
||||
expect(
|
||||
() => recognizer.config(
|
||||
new Redirect({path: '/hello/:pal/how/:goesit', redirectTo: ['/Foo']})))
|
||||
.toThrowError(
|
||||
'Configuration \'/hello/:pal/how/:goesit\' conflicts with existing route \'/hello/:person/how/:doyoudou\'');
|
||||
});
|
||||
|
||||
|
||||
it('should recognize redirects', inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(new Route({path: '/b', component: DummyCmpA}));
|
||||
recognizer.config(new Redirect({path: '/a', redirectTo: ['B']}));
|
||||
recognize(recognizer, '/a').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
var solution = solutions[0];
|
||||
expect(solution).toBeAnInstanceOf(RedirectMatch);
|
||||
if (solution instanceof RedirectMatch) {
|
||||
expect(solution.redirectTo).toEqual(['B']);
|
||||
}
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should generate URLs with params', () => {
|
||||
recognizer.config(new Route({path: '/app/user/:name', component: DummyCmpA, name: 'User'}));
|
||||
var instruction = recognizer.generate('User', {'name': 'misko'});
|
||||
expect(instruction.urlPath).toEqual('app/user/misko');
|
||||
});
|
||||
|
||||
|
||||
it('should generate URLs with numeric params', () => {
|
||||
recognizer.config(new Route({path: '/app/page/:number', component: DummyCmpA, name: 'Page'}));
|
||||
expect(recognizer.generate('Page', {'number': 42}).urlPath).toEqual('app/page/42');
|
||||
});
|
||||
|
||||
|
||||
it('should generate using a serializer', () => {
|
||||
function simpleSerializer(params: any /** TODO #9100 */): GeneratedUrl {
|
||||
var extra = {c: params['c']};
|
||||
return new GeneratedUrl(`/${params['a']}/${params['b']}`, extra);
|
||||
}
|
||||
|
||||
recognizer.config(new Route({
|
||||
name: 'Route1',
|
||||
regex: '^(.+)/(.+)$',
|
||||
serializer: simpleSerializer,
|
||||
component: DummyCmpA
|
||||
}));
|
||||
var params = {a: 'first', b: 'second', c: 'third'};
|
||||
var result = recognizer.generate('Route1', params);
|
||||
expect(result.urlPath).toEqual('/first/second');
|
||||
expect(result.urlParams).toEqual(['c=third']);
|
||||
});
|
||||
|
||||
|
||||
it('should throw in the absence of required params URLs', () => {
|
||||
recognizer.config(new Route({path: 'app/user/:name', component: DummyCmpA, name: 'User'}));
|
||||
expect(() => recognizer.generate('User', {}))
|
||||
.toThrowError('Route generator for \'name\' was not included in parameters passed.');
|
||||
});
|
||||
|
||||
|
||||
it('should throw if the route alias is not TitleCase', () => {
|
||||
expect(
|
||||
() => recognizer.config(
|
||||
new Route({path: 'app/user/:name', component: DummyCmpA, name: 'user'})))
|
||||
.toThrowError(
|
||||
`Route "app/user/:name" with name "user" does not begin with an uppercase letter. Route names should be PascalCase like "User".`);
|
||||
});
|
||||
|
||||
|
||||
describe('params', () => {
|
||||
it('should recognize parameters within the URL path',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(
|
||||
new Route({path: 'profile/:name', component: DummyCmpA, name: 'User'}));
|
||||
recognize(recognizer, '/profile/matsko?comments=all').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getParams(solutions[0])).toEqual({'name': 'matsko', 'comments': 'all'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should generate and populate the given static-based route with querystring params',
|
||||
() => {
|
||||
recognizer.config(
|
||||
new Route({path: 'forum/featured', component: DummyCmpA, name: 'ForumPage'}));
|
||||
|
||||
var params = {'start': 10, 'end': 100};
|
||||
|
||||
var result = recognizer.generate('ForumPage', params);
|
||||
expect(result.urlPath).toEqual('forum/featured');
|
||||
expect(result.urlParams).toEqual(['start=10', 'end=100']);
|
||||
});
|
||||
|
||||
|
||||
it('should prefer positional params over query params',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(
|
||||
new Route({path: 'profile/:name', component: DummyCmpA, name: 'User'}));
|
||||
recognize(recognizer, '/profile/yegor?name=igor').then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getParams(solutions[0])).toEqual({'name': 'yegor'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should ignore matrix params for the top-level component',
|
||||
inject([AsyncTestCompleter], (async: AsyncTestCompleter) => {
|
||||
recognizer.config(
|
||||
new Route({path: '/home/:subject', component: DummyCmpA, name: 'User'}));
|
||||
recognize(recognizer, '/home;sort=asc/zero;one=1?two=2')
|
||||
.then((solutions: RouteMatch[]) => {
|
||||
expect(solutions.length).toBe(1);
|
||||
expect(getParams(solutions[0])).toEqual({'subject': 'zero', 'two': '2'});
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function recognize(recognizer: RuleSet, url: string): Promise<RouteMatch[]> {
|
||||
var parsedUrl = parser.parse(url);
|
||||
return Promise.all(recognizer.recognize(parsedUrl));
|
||||
}
|
||||
|
||||
function getComponentType(routeMatch: RouteMatch): any {
|
||||
if (routeMatch instanceof PathMatch) {
|
||||
return routeMatch.instruction.componentType;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function getParams(routeMatch: RouteMatch): any {
|
||||
if (routeMatch instanceof PathMatch) {
|
||||
return routeMatch.instruction.params;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
class DummyCmpA {}
|
||||
class DummyCmpB {}
|
|
@ -1,30 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {SpyObject, proxy} from '@angular/core/testing/testing_internal';
|
||||
import {Router, RouterOutlet} from '@angular/router-deprecated';
|
||||
|
||||
export class SpyRouter extends SpyObject {
|
||||
constructor() { super(Router); }
|
||||
}
|
||||
|
||||
export class SpyRouterOutlet extends SpyObject {
|
||||
constructor() { super(RouterOutlet); }
|
||||
}
|
||||
|
||||
export class SpyLocation extends SpyObject {
|
||||
constructor() { super(Location); }
|
||||
}
|
||||
|
||||
export class SpyPlatformLocation extends SpyObject {
|
||||
pathname: string = null;
|
||||
search: string = null;
|
||||
hash: string = null;
|
||||
constructor() { super(SpyPlatformLocation); }
|
||||
}
|
|
@ -1,133 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {beforeEach, ddescribe, describe, expect, iit, inject, it} from '@angular/core/testing/testing_internal';
|
||||
|
||||
import {Url, UrlParser} from '../src/url_parser';
|
||||
|
||||
|
||||
export function main() {
|
||||
describe('ParsedUrl', () => {
|
||||
var urlParser: UrlParser;
|
||||
|
||||
beforeEach(() => { urlParser = new UrlParser(); });
|
||||
|
||||
it('should work in a simple case', () => {
|
||||
var url = urlParser.parse('hello/there');
|
||||
expect(url.toString()).toEqual('hello/there');
|
||||
});
|
||||
|
||||
it('should remove the leading slash', () => {
|
||||
var url = urlParser.parse('/hello/there');
|
||||
expect(url.toString()).toEqual('hello/there');
|
||||
});
|
||||
|
||||
it('should parse an empty URL', () => {
|
||||
var url = urlParser.parse('');
|
||||
expect(url.toString()).toEqual('');
|
||||
});
|
||||
|
||||
it('should work with a single aux route', () => {
|
||||
var url = urlParser.parse('hello/there(a)');
|
||||
expect(url.toString()).toEqual('hello/there(a)');
|
||||
});
|
||||
|
||||
it('should work with multiple aux routes', () => {
|
||||
var url = urlParser.parse('hello/there(a//b)');
|
||||
expect(url.toString()).toEqual('hello/there(a//b)');
|
||||
});
|
||||
|
||||
it('should work with children after an aux route', () => {
|
||||
var url = urlParser.parse('hello/there(a//b)/c/d');
|
||||
expect(url.toString()).toEqual('hello/there(a//b)/c/d');
|
||||
});
|
||||
|
||||
it('should work when aux routes have children', () => {
|
||||
var url = urlParser.parse('hello(aa/bb//bb/cc)');
|
||||
expect(url.toString()).toEqual('hello(aa/bb//bb/cc)');
|
||||
});
|
||||
|
||||
it('should parse an aux route with an aux route', () => {
|
||||
var url = urlParser.parse('hello(aa(bb))');
|
||||
expect(url.toString()).toEqual('hello(aa(bb))');
|
||||
});
|
||||
|
||||
it('should simplify an empty aux route definition', () => {
|
||||
var url = urlParser.parse('hello()/there');
|
||||
expect(url.toString()).toEqual('hello/there');
|
||||
});
|
||||
|
||||
it('should parse a key-value matrix param', () => {
|
||||
var url = urlParser.parse('hello/friend;name=bob');
|
||||
expect(url.toString()).toEqual('hello/friend;name=bob');
|
||||
});
|
||||
|
||||
it('should parse multiple key-value matrix params', () => {
|
||||
var url = urlParser.parse('hello/there;greeting=hi;whats=up');
|
||||
expect(url.toString()).toEqual('hello/there;greeting=hi;whats=up');
|
||||
});
|
||||
|
||||
it('should ignore matrix params on the first segment', () => {
|
||||
var url = urlParser.parse('profile;a=1/hi');
|
||||
expect(url.toString()).toEqual('profile/hi');
|
||||
});
|
||||
|
||||
it('should parse a key-only matrix param', () => {
|
||||
var url = urlParser.parse('hello/there;hi');
|
||||
expect(url.toString()).toEqual('hello/there;hi');
|
||||
});
|
||||
|
||||
it('should parse a URL with just a query param', () => {
|
||||
var url = urlParser.parse('?name=bob');
|
||||
expect(url.toString()).toEqual('?name=bob');
|
||||
});
|
||||
|
||||
it('should parse a key-value query param', () => {
|
||||
var url = urlParser.parse('hello/friend?name=bob');
|
||||
expect(url.toString()).toEqual('hello/friend?name=bob');
|
||||
});
|
||||
|
||||
it('should parse multiple key-value query params', () => {
|
||||
var url = urlParser.parse('hello/there?greeting=hi&whats=up');
|
||||
expect(url.params).toEqual({'greeting': 'hi', 'whats': 'up'});
|
||||
expect(url.toString()).toEqual('hello/there?greeting=hi&whats=up');
|
||||
});
|
||||
|
||||
it('should parse a key-only query param', () => {
|
||||
var url = urlParser.parse('hello/there?hi');
|
||||
expect(url.toString()).toEqual('hello/there?hi');
|
||||
});
|
||||
|
||||
it('should parse a route with matrix and query params', () => {
|
||||
var url = urlParser.parse('hello/there;sort=asc;unfiltered?hi&friend=true');
|
||||
expect(url.toString()).toEqual('hello/there;sort=asc;unfiltered?hi&friend=true');
|
||||
});
|
||||
|
||||
it('should parse a route with matrix params and aux routes', () => {
|
||||
var url = urlParser.parse('hello/there;sort=asc(modal)');
|
||||
expect(url.toString()).toEqual('hello/there;sort=asc(modal)');
|
||||
});
|
||||
|
||||
it('should parse an aux route with matrix params', () => {
|
||||
var url = urlParser.parse('hello/there(modal;sort=asc)');
|
||||
expect(url.toString()).toEqual('hello/there(modal;sort=asc)');
|
||||
});
|
||||
|
||||
it('should parse a route with matrix params, aux routes, and query params', () => {
|
||||
var url = urlParser.parse('hello/there;sort=asc(modal)?friend=true');
|
||||
expect(url.toString()).toEqual('hello/there;sort=asc(modal)?friend=true');
|
||||
});
|
||||
it('should allow slashes within query parameters', () => {
|
||||
var url = urlParser.parse(
|
||||
'hello?code=4/B8o0n_Y7XZTb-pVKBw5daZyGAUbMljyLf7uNgTy6ja8&scope=https://www.googleapis.com/auth/analytics');
|
||||
expect(url.toString())
|
||||
.toEqual(
|
||||
'hello?code=4/B8o0n_Y7XZTb-pVKBw5daZyGAUbMljyLf7uNgTy6ja8&scope=https://www.googleapis.com/auth/analytics');
|
||||
});
|
||||
});
|
||||
}
|
|
@ -1,10 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
// future location of testing for router.
|
||||
export var __nothing__: any /** TODO #9100 */;
|
|
@ -1,25 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"declaration": true,
|
||||
"stripInternal": true,
|
||||
"experimentalDecorators": true,
|
||||
"module": "es2015",
|
||||
"moduleResolution": "node",
|
||||
"outDir": "../../../dist/packages-dist/router-deprecated/esm",
|
||||
"paths": {
|
||||
"@angular/core": ["../../../dist/packages-dist/core"],
|
||||
"@angular/common": ["../../../dist/packages-dist/common"],
|
||||
"@angular/platform-browser": ["../../../dist/packages-dist/platform-browser"]
|
||||
},
|
||||
"rootDir": ".",
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"target": "es2015"
|
||||
},
|
||||
"files": [
|
||||
"index.ts",
|
||||
"testing.ts",
|
||||
"../../../node_modules/zone.js/dist/zone.js.d.ts"
|
||||
]
|
||||
}
|
|
@ -1,26 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"declaration": true,
|
||||
"stripInternal": true,
|
||||
"experimentalDecorators": true,
|
||||
"module": "commonjs",
|
||||
"moduleResolution": "node",
|
||||
"outDir": "../../../dist/packages-dist/router-deprecated/",
|
||||
"paths": {
|
||||
"@angular/core": ["../../../dist/packages-dist/core"],
|
||||
"@angular/common": ["../../../dist/packages-dist/common"],
|
||||
"@angular/platform-browser": ["../../../dist/packages-dist/platform-browser/"]
|
||||
},
|
||||
"rootDir": ".",
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"lib": ["es6", "dom"],
|
||||
"target": "es5"
|
||||
},
|
||||
"files": [
|
||||
"index.ts",
|
||||
"testing.ts",
|
||||
"../../../node_modules/zone.js/dist/zone.js.d.ts"
|
||||
]
|
||||
}
|
|
@ -1,51 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
|
||||
|
||||
function waitForElement(selector: any /** TODO #9100 */) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
describe('hash routing example app', function() {
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
var URL = 'all/playground/src/hash_routing/index.html';
|
||||
|
||||
it('should navigate between routes', function() {
|
||||
browser.get(URL + '#/bye');
|
||||
waitForElement('goodbye-cmp');
|
||||
|
||||
element(by.css('#hello-link')).click();
|
||||
waitForElement('hello-cmp');
|
||||
|
||||
expect(element(by.css('hello-cmp')).getText()).toContain('hello');
|
||||
|
||||
browser.navigate().back();
|
||||
waitForElement('goodbye-cmp');
|
||||
|
||||
expect(element(by.css('goodbye-cmp')).getText()).toContain('goodbye');
|
||||
});
|
||||
|
||||
|
||||
it('should open in new window if target is _blank', () => {
|
||||
var URL = 'all/playground/src/hash_routing/index.html';
|
||||
browser.get(URL + '#/');
|
||||
waitForElement('hello-cmp');
|
||||
|
||||
element(by.css('#goodbye-link-blank')).click();
|
||||
expect(browser.driver.getCurrentUrl()).not.toContain('#/bye');
|
||||
browser.getAllWindowHandles().then(function(windows) {
|
||||
browser.switchTo().window(windows[1]).then(function() {
|
||||
expect(browser.driver.getCurrentUrl()).toContain('#/bye');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
|
@ -1,99 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
|
||||
|
||||
function waitForElement(selector: any /** TODO #9100 */) {
|
||||
var EC = (<any>protractor).ExpectedConditions;
|
||||
// Waits for the element with id 'abc' to be present on the dom.
|
||||
browser.wait(EC.presenceOf($(selector)), 20000);
|
||||
}
|
||||
|
||||
describe('deprecated routing inbox-app', () => {
|
||||
|
||||
afterEach(verifyNoBrowserErrors);
|
||||
|
||||
describe('index view', () => {
|
||||
var URL = 'all/playground/src/routing_deprecated/';
|
||||
|
||||
it('should list out the current collection of items', () => {
|
||||
browser.get(URL);
|
||||
waitForElement('.inbox-item-record');
|
||||
expect(element.all(by.css('.inbox-item-record')).count()).toEqual(200);
|
||||
});
|
||||
|
||||
it('should build a link which points to the detail page', () => {
|
||||
browser.get(URL);
|
||||
waitForElement('#item-15');
|
||||
expect(element(by.css('#item-15')).getAttribute('href')).toMatch(/#\/detail\/15$/);
|
||||
element(by.css('#item-15')).click();
|
||||
waitForElement('#record-id');
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/detail\/15$/);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
describe('drafts view', () => {
|
||||
var URL = 'all/playground/src/routing_deprecated/#/drafts';
|
||||
|
||||
it('should navigate to the drafts view when the drafts link is clicked', () => {
|
||||
browser.get(URL);
|
||||
waitForElement('.inbox-item-record');
|
||||
element(by.linkText('Drafts')).click();
|
||||
waitForElement('.page-title');
|
||||
expect(element(by.css('.page-title')).getText()).toEqual('Drafts');
|
||||
});
|
||||
|
||||
it('should navigate to email details', () => {
|
||||
browser.get(URL);
|
||||
element(by.linkText('Drafts')).click();
|
||||
waitForElement('.inbox-item-record');
|
||||
expect(element.all(by.css('.inbox-item-record')).count()).toEqual(2);
|
||||
expect(element(by.css('#item-201')).getAttribute('href')).toMatch(/#\/detail\/201$/);
|
||||
element(by.css('#item-201')).click();
|
||||
waitForElement('#record-id');
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/detail\/201$/);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
describe('detail view', () => {
|
||||
var URL = 'all/playground/src/routing_deprecated/';
|
||||
|
||||
it('should navigate to the detail view when an email is clicked', () => {
|
||||
browser.get(URL);
|
||||
waitForElement('#item-10');
|
||||
element(by.css('#item-10')).click();
|
||||
waitForElement('#record-id');
|
||||
var recordId = element(by.css('#record-id'));
|
||||
browser.wait(protractor.until.elementTextIs(recordId, 'ID: 10'), 5000);
|
||||
expect(recordId.getText()).toEqual('ID: 10');
|
||||
});
|
||||
|
||||
it('should navigate back to the email inbox page when the back button is clicked', () => {
|
||||
browser.get(URL);
|
||||
waitForElement('#item-10');
|
||||
element(by.css('#item-10')).click();
|
||||
waitForElement('.back-button');
|
||||
element(by.css('.back-button')).click();
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/$/);
|
||||
});
|
||||
|
||||
it('should navigate back to index and sort the page items based on the provided querystring param',
|
||||
() => {
|
||||
browser.get(URL);
|
||||
waitForElement('#item-10');
|
||||
element(by.css('#item-10')).click();
|
||||
waitForElement('.sort-button');
|
||||
element(by.css('.sort-button')).click();
|
||||
expect(browser.getCurrentUrl()).toMatch(/\/#\?sort=date$/);
|
||||
waitForElement('.inbox-item-record');
|
||||
expect(element(by.css('.inbox-item-record > a')).getAttribute('id')).toEqual('item-137');
|
||||
});
|
||||
})
|
||||
});
|
|
@ -1,12 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<title>Routing Example</title>
|
||||
<base href="/all/playground/src/hash_routing/">
|
||||
<body>
|
||||
<example-app>
|
||||
Loading...
|
||||
</example-app>
|
||||
|
||||
<script src="../bootstrap.js"></script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,51 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {HashLocationStrategy, LocationStrategy} from '@angular/common';
|
||||
import {Component} from '@angular/core';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {ROUTER_DIRECTIVES, ROUTER_PROVIDERS, Route, RouteConfig} from '@angular/router-deprecated';
|
||||
|
||||
|
||||
@Component({selector: 'hello-cmp', template: `hello`})
|
||||
class HelloCmp {
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'goodbye-cmp', template: `goodbye`})
|
||||
class GoodByeCmp {
|
||||
}
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'example-app',
|
||||
template: `
|
||||
<h1>My App</h1>
|
||||
<nav>
|
||||
<a href="#/" id="hello-link">Navigate via href</a> |
|
||||
<a [routerLink]="['/GoodbyeCmp']" id="goodbye-link">Navigate with Link DSL</a>
|
||||
<a [routerLink]="['/GoodbyeCmp']" id="goodbye-link-blank" target="_blank">
|
||||
Navigate with Link DSL _blank target
|
||||
</a>
|
||||
</nav>
|
||||
<router-outlet></router-outlet>
|
||||
`,
|
||||
directives: [ROUTER_DIRECTIVES]
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/', component: HelloCmp, name: 'HelloCmp'}),
|
||||
new Route({path: '/bye', component: GoodByeCmp, name: 'GoodbyeCmp'})
|
||||
])
|
||||
class AppCmp {
|
||||
}
|
||||
|
||||
|
||||
export function main() {
|
||||
bootstrap(
|
||||
AppCmp, [ROUTER_PROVIDERS, {provide: LocationStrategy, useClass: HashLocationStrategy}]);
|
||||
}
|
File diff suppressed because it is too large
Load Diff
|
@ -1,11 +0,0 @@
|
|||
<div>
|
||||
<h2 class="page-title">Drafts</h2>
|
||||
|
||||
<ol class="inbox-list">
|
||||
<li *ngFor="let item of items" class="inbox-item-record">
|
||||
<a id="item-{{ item.id }}"
|
||||
[routerLink]="['/DetailPage', {'id':item.id}]">
|
||||
{{ item.subject }}</a>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
|
@ -1,5 +0,0 @@
|
|||
<inbox-side-menu class="inbox-aside">
|
||||
<a [routerLink]="['/Inbox']" class="link" [class.active]="inboxPageActive()">Inbox</a>
|
||||
<a [routerLink]="['/Drafts']" class="link" [class.active]="draftsPageActive()">Drafts</a>
|
||||
</inbox-side-menu>
|
||||
<router-outlet></router-outlet>
|
|
@ -1,159 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Location} from '@angular/common';
|
||||
import {Component, Injectable} from '@angular/core';
|
||||
import {DateWrapper, isPresent} from '@angular/core/src/facade/lang';
|
||||
import {Route, RouteConfig, RouteParams, Router, RouterLink, RouterOutlet} from '@angular/router-deprecated';
|
||||
|
||||
import * as db from './data';
|
||||
|
||||
class InboxRecord {
|
||||
id: string = '';
|
||||
subject: string = '';
|
||||
content: string = '';
|
||||
email: string = '';
|
||||
firstName: string = '';
|
||||
lastName: string = '';
|
||||
date: string;
|
||||
draft: boolean = false;
|
||||
|
||||
constructor(data: {
|
||||
id: string,
|
||||
subject: string,
|
||||
content: string,
|
||||
email: string,
|
||||
firstName: string,
|
||||
lastName: string,
|
||||
date: string, draft?: boolean
|
||||
} = null) {
|
||||
if (isPresent(data)) {
|
||||
this.setData(data);
|
||||
}
|
||||
}
|
||||
|
||||
setData(record: {
|
||||
id: string,
|
||||
subject: string,
|
||||
content: string,
|
||||
email: string,
|
||||
firstName: string,
|
||||
lastName: string,
|
||||
date: string, draft?: boolean
|
||||
}) {
|
||||
this.id = record['id'];
|
||||
this.subject = record['subject'];
|
||||
this.content = record['content'];
|
||||
this.email = record['email'];
|
||||
this.firstName = (record as any /** TODO #9100 */)['first-name'];
|
||||
this.lastName = (record as any /** TODO #9100 */)['last-name'];
|
||||
this.date = record['date'];
|
||||
this.draft = record['draft'] == true;
|
||||
}
|
||||
}
|
||||
|
||||
@Injectable()
|
||||
class DbService {
|
||||
getData(): Promise<any[]> { return Promise.resolve(db.data); }
|
||||
|
||||
drafts(): Promise<any[]> {
|
||||
return this.getData().then(
|
||||
(data: any[]): any[] =>
|
||||
data.filter(record => isPresent(record['draft']) && record['draft'] == true));
|
||||
}
|
||||
|
||||
emails(): Promise<any[]> {
|
||||
return this.getData().then(
|
||||
(data: any[]): any[] => data.filter(record => !isPresent(record['draft'])));
|
||||
}
|
||||
|
||||
email(id: any /** TODO #9100 */): Promise<any> {
|
||||
return this.getData().then((data: any[]) => {
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
var entry = data[i];
|
||||
if (entry['id'] == id) {
|
||||
return entry;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@Component(
|
||||
{selector: 'inbox-detail', directives: [RouterLink], templateUrl: 'app/inbox-detail.html'})
|
||||
class InboxDetailCmp {
|
||||
record: InboxRecord = new InboxRecord();
|
||||
ready: boolean = false;
|
||||
|
||||
constructor(db: DbService, params: RouteParams) {
|
||||
var id = params.get('id');
|
||||
db.email(id).then((data) => { this.record.setData(data); });
|
||||
}
|
||||
}
|
||||
|
||||
@Component({selector: 'inbox', templateUrl: 'app/inbox.html', directives: [RouterLink]})
|
||||
class InboxCmp {
|
||||
items: InboxRecord[] = [];
|
||||
ready: boolean = false;
|
||||
|
||||
constructor(public router: Router, db: DbService, params: RouteParams) {
|
||||
var sortType = params.get('sort');
|
||||
var sortEmailsByDate = isPresent(sortType) && sortType == 'date';
|
||||
|
||||
db.emails().then((emails: any[]) => {
|
||||
this.ready = true;
|
||||
this.items = emails.map(data => new InboxRecord(data));
|
||||
|
||||
if (sortEmailsByDate) {
|
||||
this.items.sort(
|
||||
(a: InboxRecord, b: InboxRecord) =>
|
||||
DateWrapper.toMillis(DateWrapper.fromISOString(a.date)) <
|
||||
DateWrapper.toMillis(DateWrapper.fromISOString(b.date)) ?
|
||||
-1 :
|
||||
1);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@Component({selector: 'drafts', templateUrl: 'app/drafts.html', directives: [RouterLink]})
|
||||
class DraftsCmp {
|
||||
items: InboxRecord[] = [];
|
||||
ready: boolean = false;
|
||||
|
||||
constructor(public router: Router, db: DbService) {
|
||||
db.drafts().then((drafts: any[]) => {
|
||||
this.ready = true;
|
||||
this.items = drafts.map(data => new InboxRecord(data));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'inbox-app',
|
||||
viewProviders: [DbService],
|
||||
templateUrl: 'app/inbox-app.html',
|
||||
directives: [RouterOutlet, RouterLink]
|
||||
})
|
||||
@RouteConfig([
|
||||
new Route({path: '/', component: InboxCmp, name: 'Inbox'}),
|
||||
new Route({path: '/drafts', component: DraftsCmp, name: 'Drafts'}),
|
||||
new Route({path: '/detail/:id', component: InboxDetailCmp, name: 'DetailPage'})
|
||||
])
|
||||
export class InboxApp {
|
||||
router: Router;
|
||||
location: Location;
|
||||
constructor(router: Router, location: Location) {
|
||||
this.router = router;
|
||||
this.location = location;
|
||||
}
|
||||
inboxPageActive() { return this.location.path() == ''; }
|
||||
draftsPageActive() { return this.location.path() == '/drafts'; }
|
||||
}
|
|
@ -1,24 +0,0 @@
|
|||
<div>
|
||||
<h2 class="page-title">{{ record.subject }}</h2>
|
||||
|
||||
<ul>
|
||||
<li id="record-id">ID: {{ record.id }}</li>
|
||||
<li id="record-name">Name: {{ record.firstName }} {{ record.lastName }}</li>
|
||||
<li id="record-email">Email: {{ record.email }}</li>
|
||||
<li id="record-date">Date: {{ record.date }}</li>
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
{{ record.content }}
|
||||
</p>
|
||||
|
||||
<span class="btn medium primary">
|
||||
<a [routerLink]="record.draft ? ['../Drafts'] : ['../Inbox']" class="back-button">Back</a>
|
||||
</span>
|
||||
|
||||
<hr />
|
||||
|
||||
<a [routerLink]="['../Inbox', { sort: 'date'} ]" class="sort-button">
|
||||
View Latest Messages
|
||||
</a>
|
||||
</div>
|
|
@ -1,10 +0,0 @@
|
|||
<div>
|
||||
<h2 class="page-title">Inbox</h2>
|
||||
|
||||
<ol class="inbox-list">
|
||||
<li *ngFor="let item of items" class="inbox-item-record">
|
||||
<a id="item-{{ item.id }}"
|
||||
[routerLink]="['/DetailPage', {'id':item.id}]">{{ item.subject }}</a>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
|
@ -1,57 +0,0 @@
|
|||
body {
|
||||
background:#eee;
|
||||
color:black;
|
||||
}
|
||||
|
||||
.inbox-list,
|
||||
.inbox-list li {
|
||||
list-style:none;
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
.inbox-list a {
|
||||
padding:5px;
|
||||
display:block;
|
||||
}
|
||||
|
||||
inbox, drafts, inbox-side-menu {
|
||||
display:block;
|
||||
}
|
||||
|
||||
inbox-side-menu .link {
|
||||
display:block;
|
||||
text-align:center;
|
||||
padding:1em;
|
||||
}
|
||||
|
||||
inbox-side-menu .link.active {
|
||||
background:white;
|
||||
}
|
||||
|
||||
inbox-side-menu .link:hover {
|
||||
background:#eee;
|
||||
}
|
||||
|
||||
inbox-side-menu {
|
||||
position:fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
bottom:0;
|
||||
width:200px;
|
||||
background:#ddd;
|
||||
}
|
||||
|
||||
inbox-side-menu a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
inbox, drafts, inbox-detail {
|
||||
padding:1em;
|
||||
margin-left:200px;
|
||||
}
|
||||
|
||||
inbox-detail {
|
||||
display:block;
|
||||
margin-left:200px;
|
||||
}
|
|
@ -1,14 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<title>Routing Example</title>
|
||||
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/gumby/2.6.0/css/gumby.css" />
|
||||
<link rel="stylesheet" type="text/css" href="./css/app.css" />
|
||||
<base href="/all/playground/src/routing_deprecated/">
|
||||
<body>
|
||||
<inbox-app>
|
||||
Loading...
|
||||
</inbox-app>
|
||||
|
||||
<script src="../bootstrap.js"></script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,18 +0,0 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Google Inc. All Rights Reserved.
|
||||
*
|
||||
* Use of this source code is governed by an MIT-style license that can be
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {HashLocationStrategy, LocationStrategy} from '@angular/common';
|
||||
import {bootstrap} from '@angular/platform-browser-dynamic';
|
||||
import {ROUTER_PROVIDERS} from '@angular/router-deprecated';
|
||||
|
||||
import {InboxApp} from './app/inbox-app';
|
||||
|
||||
export function main() {
|
||||
bootstrap(
|
||||
InboxApp, [ROUTER_PROVIDERS, {provide: LocationStrategy, useClass: HashLocationStrategy}]);
|
||||
}
|
Loading…
Reference in New Issue