feat(router): add regex matchers
@petebacondarwin deserves credit for most of this commit.
This allows you to specify a regex and serializer function instead
of the path DSL in your route declaration.
```
@RouteConfig([
{ regex: '[a-z]+.[0-9]+',
serializer: (params) => `{params.a}.params.b}`,
component: MyComponent }
])
class Component {}
```
Closes #7325
Closes #7126
This commit is contained in:
Brian Ford
committed by
Vikram Subramanian
Vikram Subramanian
parent
2548ce86db
commit
75343eb340
@ -0,0 +1,103 @@
|
||||
import {
|
||||
AsyncTestCompleter,
|
||||
describe,
|
||||
it,
|
||||
iit,
|
||||
ddescribe,
|
||||
expect,
|
||||
inject,
|
||||
beforeEach,
|
||||
SpyObject
|
||||
} from 'angular2/testing_internal';
|
||||
|
||||
import {ParamRoutePath} from 'angular2/src/router/rules/route_paths/param_route_path';
|
||||
import {parser, Url} from 'angular2/src/router/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('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');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
@ -0,0 +1,51 @@
|
||||
import {
|
||||
AsyncTestCompleter,
|
||||
describe,
|
||||
it,
|
||||
iit,
|
||||
ddescribe,
|
||||
expect,
|
||||
inject,
|
||||
beforeEach,
|
||||
SpyObject
|
||||
} from 'angular2/testing_internal';
|
||||
|
||||
import {GeneratedUrl} from 'angular2/src/router/rules/route_paths/route_path';
|
||||
import {RegexRoutePath} from 'angular2/src/router/rules/route_paths/regex_route_path';
|
||||
import {parser, Url} from 'angular2/src/router/url_parser';
|
||||
|
||||
function emptySerializer(params) {
|
||||
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) {
|
||||
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');
|
||||
});
|
||||
});
|
||||
}
|
||||
251
modules/angular2/test/router/rules/rule_set_spec.ts
Normal file
251
modules/angular2/test/router/rules/rule_set_spec.ts
Normal file
@ -0,0 +1,251 @@
|
||||
import {
|
||||
AsyncTestCompleter,
|
||||
describe,
|
||||
it,
|
||||
iit,
|
||||
ddescribe,
|
||||
expect,
|
||||
inject,
|
||||
beforeEach,
|
||||
SpyObject
|
||||
} from 'angular2/testing_internal';
|
||||
|
||||
import {Map, StringMapWrapper} from 'angular2/src/facade/collection';
|
||||
|
||||
import {RouteMatch, PathMatch, RedirectMatch} from 'angular2/src/router/rules/rules';
|
||||
import {RuleSet} from 'angular2/src/router/rules/rule_set';
|
||||
import {GeneratedUrl} from 'angular2/src/router/rules/route_paths/route_path';
|
||||
|
||||
import {Route, Redirect} from 'angular2/src/router/route_config/route_config_decorator';
|
||||
import {parser} from 'angular2/src/router/url_parser';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/promise';
|
||||
|
||||
|
||||
export function main() {
|
||||
describe('RuleSet', () => {
|
||||
var recognizer: RuleSet;
|
||||
|
||||
beforeEach(() => { recognizer = new RuleSet(); });
|
||||
|
||||
|
||||
it('should recognize a static segment', inject([AsyncTestCompleter], (async) => {
|
||||
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) => {
|
||||
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) => {
|
||||
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) => {
|
||||
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) => {
|
||||
function emptySerializer(params): 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 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) => {
|
||||
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): 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 CamelCase like "User".`);
|
||||
});
|
||||
|
||||
|
||||
describe('params', () => {
|
||||
it('should recognize parameters within the URL path',
|
||||
inject([AsyncTestCompleter], (async) => {
|
||||
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) => {
|
||||
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) => {
|
||||
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 PromiseWrapper.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 {}
|
||||
Reference in New Issue
Block a user