test(refactor): cleanup test to use the new UrlMapper

This commit is contained in:
Victor Berchet 2015-06-24 10:27:53 +02:00
parent 0a2f6ddc64
commit b89c0672e6
4 changed files with 87 additions and 106 deletions

View File

@ -60,7 +60,7 @@ export function main() {
function createCompiler(renderCompileResults: List<renderApi.ProtoViewDto>,
protoViewFactoryResults: List<List<AppProtoView>>) {
var urlResolver = new FakeUrlResolver();
var urlResolver = new UrlResolver();
renderCompileRequests = [];
renderCompiler.spy('compile').andCallFake((view) => {
renderCompileRequests.push(view);
@ -111,17 +111,17 @@ export function main() {
it('should fill templateAbsUrl given inline templates',
inject([AsyncTestCompleter], (async) => {
cmpUrlMapper.setComponentUrl(MainComponent, '/mainComponent');
cmpUrlMapper.setComponentUrl(MainComponent, '/cmp/main.js');
captureTemplate(new viewAnn.View({template: '<div></div>'}))
.then((renderTpl) => {
expect(renderTpl.templateAbsUrl).toEqual('http://www.app.com/mainComponent');
expect(renderTpl.templateAbsUrl).toEqual('http://www.app.com/cmp/main.js');
async.done();
});
}));
it('should not fill templateAbsUrl given no inline template or template url',
inject([AsyncTestCompleter], (async) => {
cmpUrlMapper.setComponentUrl(MainComponent, '/mainComponent');
cmpUrlMapper.setComponentUrl(MainComponent, '/cmp/main.js');
captureTemplate(new viewAnn.View({template: null, templateUrl: null}))
.then((renderTpl) => {
expect(renderTpl.templateAbsUrl).toBe(null);
@ -130,23 +130,23 @@ export function main() {
}));
it('should fill templateAbsUrl given url template', inject([AsyncTestCompleter], (async) => {
cmpUrlMapper.setComponentUrl(MainComponent, '/mainComponent');
captureTemplate(new viewAnn.View({templateUrl: '/someTemplate'}))
cmpUrlMapper.setComponentUrl(MainComponent, '/cmp/main.js');
captureTemplate(new viewAnn.View({templateUrl: 'tpl/main.html'}))
.then((renderTpl) => {
expect(renderTpl.templateAbsUrl)
.toEqual('http://www.app.com/mainComponent/someTemplate');
.toEqual('http://www.app.com/cmp/tpl/main.html');
async.done();
});
}));
it('should fill styleAbsUrls given styleUrls', inject([AsyncTestCompleter], (async) => {
cmpUrlMapper.setComponentUrl(MainComponent, '/mainComponent');
captureTemplate(new viewAnn.View({styleUrls: ['/1.css', '/2.css']}))
cmpUrlMapper.setComponentUrl(MainComponent, '/cmp/main.js');
captureTemplate(new viewAnn.View({styleUrls: ['css/1.css', 'css/2.css']}))
.then((renderTpl) => {
expect(renderTpl.styleAbsUrls)
.toEqual([
'http://www.app.com/mainComponent/1.css',
'http://www.app.com/mainComponent/2.css'
'http://www.app.com/cmp/css/1.css',
'http://www.app.com/cmp/css/2.css'
]);
async.done();
});
@ -566,17 +566,10 @@ class SpyRenderCompiler extends SpyObject {
noSuchMethod(m) { return super.noSuchMethod(m) }
}
class FakeUrlResolver extends UrlResolver {
constructor() { super(); }
resolve(baseUrl: string, url: string): string { return baseUrl + url; }
}
class FakeAppRootUrl extends AppRootUrl {
get value() { return 'http://www.app.com'; }
}
class FakeTemplateResolver extends TemplateResolver {
_cmpViews: Map<Type, viewAnn.View> = new Map();

View File

@ -5,8 +5,13 @@ import {UrlResolver} from 'angular2/src/services/url_resolver';
export function main() {
describe('StyleUrlResolver', () => {
let styleUrlResolver;
beforeEach(() => {
styleUrlResolver = new StyleUrlResolver(new UrlResolver());
});
it('should resolve "url()" urls', () => {
var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
var css = `
.foo {
background-image: url("double.jpg");
@ -15,64 +20,57 @@ export function main() {
}`;
var expectedCss = `
.foo {
background-image: url('base/double.jpg');
background-image: url('base/simple.jpg');
background-image: url('base/noquote.jpg');
background-image: url('http://ng.io/double.jpg');
background-image: url('http://ng.io/simple.jpg');
background-image: url('http://ng.io/noquote.jpg');
}`;
var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
var resolvedCss = styleUrlResolver.resolveUrls(css, 'http://ng.io');
expect(resolvedCss).toEqual(expectedCss);
});
it('should resolve "@import" urls', () => {
var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
var css = `
@import '1.css';
@import "2.css";
`;
var expectedCss = `
@import 'base/1.css';
@import 'base/2.css';
@import 'http://ng.io/1.css';
@import 'http://ng.io/2.css';
`;
var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
var resolvedCss = styleUrlResolver.resolveUrls(css, 'http://ng.io');
expect(resolvedCss).toEqual(expectedCss);
});
it('should resolve "@import url()" urls', () => {
var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
var css = `
@import url('3.css');
@import url("4.css");
@import url(5.css);
`;
var expectedCss = `
@import url('base/3.css');
@import url('base/4.css');
@import url('base/5.css');
@import url('http://ng.io/3.css');
@import url('http://ng.io/4.css');
@import url('http://ng.io/5.css');
`;
var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
var resolvedCss = styleUrlResolver.resolveUrls(css, 'http://ng.io');
expect(resolvedCss).toEqual(expectedCss);
});
it('should support media query in "@import"', () => {
var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
var css = `
@import 'print.css' print;
@import url(print.css) print;
`;
var expectedCss = `
@import 'base/print.css' print;
@import url('base/print.css') print;
@import 'http://ng.io/print.css' print;
@import url('http://ng.io/print.css') print;
`;
var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
var resolvedCss = styleUrlResolver.resolveUrls(css, 'http://ng.io');
expect(resolvedCss).toEqual(expectedCss);
});
});
}
class FakeUrlResolver extends UrlResolver {
resolve(baseUrl: string, url: string): string { return baseUrl + '/' + url; }
}

View File

@ -18,7 +18,6 @@ import {UrlResolver} from 'angular2/src/services/url_resolver';
import {ViewDefinition} from 'angular2/src/render/api';
import {PromiseWrapper, Promise} from 'angular2/src/facade/async';
import {StringWrapper, isBlank, isPresent} from 'angular2/src/facade/lang';
import {MapWrapper, ListWrapper} from 'angular2/src/facade/collection';
import {XHR} from 'angular2/src/render/xhr';
import {MockXHR} from 'angular2/src/render/xhr_mock';
@ -29,7 +28,7 @@ export function main() {
beforeEach(() => {
xhr = new MockXHR();
urlResolver = new FakeUrlResolver();
urlResolver = new UrlResolver();
styleUrlResolver = new StyleUrlResolver(urlResolver);
let styleInliner = new StyleInliner(xhr, styleUrlResolver, urlResolver);
loader = new TemplateLoader(xhr, styleInliner, styleUrlResolver);
@ -37,17 +36,17 @@ export function main() {
describe('html', () => {
it('should load inline templates', inject([AsyncTestCompleter], (async) => {
var template = new ViewDefinition({template: 'template template'});
loader.load(template).then((el) => {
var view = new ViewDefinition({template: 'template template'});
loader.load(view).then((el) => {
expect(DOM.content(el)).toHaveText('template template');
async.done();
});
}));
it('should load templates through XHR', inject([AsyncTestCompleter], (async) => {
xhr.expect('base/foo.html', 'xhr template');
var template = new ViewDefinition({templateAbsUrl: 'base/foo.html'});
loader.load(template).then((el) => {
xhr.expect('http://ng.io/foo.html', 'xhr template');
var view = new ViewDefinition({templateAbsUrl: 'http://ng.io/foo.html'});
loader.load(view).then((el) => {
expect(DOM.content(el)).toHaveText('xhr template');
async.done();
});
@ -55,12 +54,12 @@ export function main() {
}));
it('should resolve urls in styles', inject([AsyncTestCompleter], (async) => {
xhr.expect('base/foo.html',
xhr.expect('http://ng.io/foo.html',
'<style>.foo { background-image: url("double.jpg"); }</style>');
var template = new ViewDefinition({templateAbsUrl: 'base/foo.html'});
loader.load(template).then((el) => {
var view = new ViewDefinition({templateAbsUrl: 'http://ng.io/foo.html'});
loader.load(view).then((el) => {
expect(DOM.content(el))
.toHaveText(".foo { background-image: url('/base/double.jpg'); }");
.toHaveText(".foo { background-image: url('http://ng.io/double.jpg'); }");
async.done();
});
xhr.flush();
@ -68,14 +67,14 @@ export function main() {
it('should inline styles', inject([AsyncTestCompleter], (async) => {
let xhr = new FakeXHR();
xhr.reply('base/foo.html', '<style>@import "foo.css";</style>');
xhr.reply('/base/foo.css', '/* foo.css */');
xhr.reply('http://ng.io/foo.html', '<style>@import "foo.css";</style>');
xhr.reply('http://ng.io/foo.css', '/* foo.css */');
let styleInliner = new StyleInliner(xhr, styleUrlResolver, urlResolver);
let loader = new TemplateLoader(xhr, styleInliner, styleUrlResolver);
var template = new ViewDefinition({templateAbsUrl: 'base/foo.html'});
loader.load(template).then((el) => {
var view = new ViewDefinition({templateAbsUrl: 'http://ng.io/foo.html'});
loader.load(view).then((el) => {
expect(DOM.getInnerHTML(el)).toEqual("<style>/* foo.css */\n</style>");
async.done();
});
@ -85,13 +84,13 @@ export function main() {
inject([AsyncTestCompleter], (async) => {
var firstEl;
// we have only one xhr.expect, so there can only be one xhr call!
xhr.expect('base/foo.html', 'xhr template');
var template = new ViewDefinition({templateAbsUrl: 'base/foo.html'});
loader.load(template)
xhr.expect('http://ng.io/foo.html', 'xhr template');
var view = new ViewDefinition({templateAbsUrl: 'http://ng.io/foo.html'});
loader.load(view)
.then((el) => {
expect(DOM.content(el)).toHaveText('xhr template');
firstEl = el;
return loader.load(template);
return loader.load(view);
})
.then((el) => {
expect(el).not.toBe(firstEl);
@ -102,19 +101,19 @@ export function main() {
}));
it('should throw when no template is defined', () => {
var template = new ViewDefinition({template: null, templateAbsUrl: null});
expect(() => loader.load(template))
var view = new ViewDefinition({template: null, templateAbsUrl: null});
expect(() => loader.load(view))
.toThrowError('View should have either the templateUrl or template property set');
});
it('should return a rejected Promise when XHR loading fails',
inject([AsyncTestCompleter], (async) => {
xhr.expect('base/foo.html', null);
var template = new ViewDefinition({templateAbsUrl: 'base/foo.html'});
PromiseWrapper.then(loader.load(template), function(_) { throw 'Unexpected response'; },
xhr.expect('http://ng.io/foo.html', null);
var view = new ViewDefinition({templateAbsUrl: 'http://ng.io/foo.html'});
PromiseWrapper.then(loader.load(view), function(_) { throw 'Unexpected response'; },
function(error) {
expect(error.message)
.toEqual('Failed to fetch url "base/foo.html"');
.toEqual('Failed to fetch url "http://ng.io/foo.html"');
async.done();
});
xhr.flush();
@ -123,8 +122,8 @@ export function main() {
describe('css', () => {
it('should load inline styles', inject([AsyncTestCompleter], (async) => {
var template = new ViewDefinition({template: 'html', styles: ['style 1', 'style 2']});
loader.load(template).then((el) => {
var view = new ViewDefinition({template: 'html', styles: ['style 1', 'style 2']});
loader.load(view).then((el) => {
expect(DOM.getInnerHTML(el))
.toEqual('<style>style 1</style><style>style 2</style>html');
async.done();
@ -132,25 +131,30 @@ export function main() {
}));
it('should resolve urls in inline styles', inject([AsyncTestCompleter], (async) => {
var template = new ViewDefinition(
{template: 'html', styles: ['.foo { background-image: url("double.jpg"); }']});
loader.load(template).then((el) => {
xhr.expect('http://ng.io/foo.html', 'html');
var view = new ViewDefinition({
templateAbsUrl: 'http://ng.io/foo.html',
styles: ['.foo { background-image: url("double.jpg"); }']
});
loader.load(view).then((el) => {
expect(DOM.getInnerHTML(el))
.toEqual("<style>.foo { background-image: url('/double.jpg'); }</style>html");
.toEqual(
"<style>.foo { background-image: url('http://ng.io/double.jpg'); }</style>html");
async.done();
});
xhr.flush();
}));
it('should load templates through XHR', inject([AsyncTestCompleter], (async) => {
xhr.expect('base/foo.html', 'xhr template');
xhr.expect('base/foo-1.css', '1');
xhr.expect('base/foo-2.css', '2');
var template = new ViewDefinition({
templateAbsUrl: 'base/foo.html',
xhr.expect('http://ng.io/foo.html', 'xhr template');
xhr.expect('http://ng.io/foo-1.css', '1');
xhr.expect('http://ng.io/foo-2.css', '2');
var view = new ViewDefinition({
templateAbsUrl: 'http://ng.io/foo.html',
styles: ['i1'],
styleAbsUrls: ['base/foo-1.css', 'base/foo-2.css']
styleAbsUrls: ['http://ng.io/foo-1.css', 'http://ng.io/foo-2.css']
});
loader.load(template).then((el) => {
loader.load(view).then((el) => {
expect(DOM.getInnerHTML(el))
.toEqual('<style>i1</style><style>1</style><style>2</style>xhr template');
async.done();
@ -160,15 +164,15 @@ export function main() {
it('should inline styles', inject([AsyncTestCompleter], (async) => {
let xhr = new FakeXHR();
xhr.reply('base/foo.html', '<p>template</p>');
xhr.reply('/base/foo.css', '/* foo.css */');
xhr.reply('http://ng.io/foo.html', '<p>template</p>');
xhr.reply('http://ng.io/foo.css', '/* foo.css */');
let styleInliner = new StyleInliner(xhr, styleUrlResolver, urlResolver);
let loader = new TemplateLoader(xhr, styleInliner, styleUrlResolver);
var template = new ViewDefinition(
{templateAbsUrl: 'base/foo.html', styles: ['@import "foo.css";']});
loader.load(template).then((el) => {
var view = new ViewDefinition(
{templateAbsUrl: 'http://ng.io/foo.html', styles: ['@import "foo.css";']});
loader.load(view).then((el) => {
expect(DOM.getInnerHTML(el)).toEqual("<style>/* foo.css */\n</style><p>template</p>");
async.done();
});
@ -177,12 +181,12 @@ export function main() {
it('should return a rejected Promise when XHR loading fails',
inject([AsyncTestCompleter], (async) => {
xhr.expect('base/foo.css', null);
var template = new ViewDefinition({template: '', styleAbsUrls: ['base/foo.css']});
PromiseWrapper.then(loader.load(template), function(_) { throw 'Unexpected response'; },
xhr.expect('http://ng.io/foo.css', null);
var view = new ViewDefinition({template: '', styleAbsUrls: ['http://ng.io/foo.css']});
PromiseWrapper.then(loader.load(view), function(_) { throw 'Unexpected response'; },
function(error) {
expect(error.message)
.toEqual('Failed to fetch url "base/foo.css"');
.toEqual('Failed to fetch url "http://ng.io/foo.css"');
async.done();
});
xhr.flush();
@ -193,21 +197,6 @@ export function main() {
class SomeComponent {}
class FakeUrlResolver extends UrlResolver {
constructor() { super(); }
resolve(baseUrl: string, url: string): string {
if (url.length > 0 && url[0] == '/') return url;
if (!isPresent(baseUrl)) return `/${url}`;
var parts: List<string> = baseUrl.split('/');
if (parts.length > 1) {
ListWrapper.removeLast(parts);
}
parts.push(url);
return '/' + parts.join('/');
}
}
class FakeXHR extends XHR {
_responses: Map<string, string> = new Map();

View File

@ -53,11 +53,12 @@ export function main() {
});
describe('relative base url', () => {
it('should add a relative path to the base url',
() => { expect(resolver.resolve('foo/', './bar')).toEqual('foo/bar'); });
it('should add a relative path to the base url', () => {
expect(resolver.resolve('foo/', './bar')).toEqual('foo/bar');
expect(resolver.resolve('foo/baz', './bar')).toEqual('foo/bar');
expect(resolver.resolve('foo/baz', 'bar')).toEqual('foo/bar');
it('should replace the base path',
() => { expect(resolver.resolve('foo/baz', './bar')).toEqual('foo/bar'); });
});
it('should support ".." in the path', () => {
expect(resolver.resolve('foo/baz', '../bar')).toEqual('bar');