cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(tests): exctract createElement into a helper

Browse Source
This commit is contained in:
vsavkin
2015-01-08 09:11:33 -08:00
parent c5b0baf805
commit bf609f0e56
20 changed files with 206 additions and 268 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
modules/core/test/compiler/compiler_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, ddescribe, iit} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, ddescribe, iit, el} from 'test_lib/test_lib';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {List} from 'facade/collection'; import {List} from 'facade/collection';
@ -32,19 +32,19 @@ export function main() {
var compiler = createCompiler( (parent, current, control) => { var compiler = createCompiler( (parent, current, control) => {
current.inheritedProtoView = rootProtoView; current.inheritedProtoView = rootProtoView;
}); });
compiler.compile(MainComponent, createElement('<div></div>')).then( (protoView) => { compiler.compile(MainComponent, el('<div></div>')).then( (protoView) => {
expect(protoView).toBe(rootProtoView); expect(protoView).toBe(rootProtoView);
done(); done();
}); });
}); });
it('should use the given element', (done) => { it('should use the given element', (done) => {
var el = createElement('<div></div>'); var element = el('<div></div>');
var compiler = createCompiler( (parent, current, control) => { var compiler = createCompiler( (parent, current, control) => {
current.inheritedProtoView = new ProtoView(current.element, null); current.inheritedProtoView = new ProtoView(current.element, null);
}); });
compiler.compile(MainComponent, el).then( (protoView) => { compiler.compile(MainComponent, element).then( (protoView) => {
expect(protoView.element).toBe(el); expect(protoView.element).toBe(element);
done(); done();
}); });
}); });
@ -60,7 +60,7 @@ export function main() {
}); });
it('should load nested components', (done) => { it('should load nested components', (done) => {
var mainEl = createElement('<div></div>'); var mainEl = el('<div></div>');
var compiler = createCompiler( (parent, current, control) => { var compiler = createCompiler( (parent, current, control) => {
current.inheritedProtoView = new ProtoView(current.element, null); current.inheritedProtoView = new ProtoView(current.element, null);
current.inheritedElementBinder = current.inheritedProtoView.bindElement(null); current.inheritedElementBinder = current.inheritedProtoView.bindElement(null);
@ -77,14 +77,14 @@ export function main() {
}); });
it('should cache components', (done) => { it('should cache components', (done) => {
var el = createElement('<div></div>'); var element = el('<div></div>');
var compiler = createCompiler( (parent, current, control) => { var compiler = createCompiler( (parent, current, control) => {
current.inheritedProtoView = new ProtoView(current.element, null); current.inheritedProtoView = new ProtoView(current.element, null);
}); });
var firstProtoView; var firstProtoView;
compiler.compile(MainComponent, el).then( (protoView) => { compiler.compile(MainComponent, element).then( (protoView) => {
firstProtoView = protoView; firstProtoView = protoView;
return compiler.compile(MainComponent, el); return compiler.compile(MainComponent, element);
}).then( (protoView) => { }).then( (protoView) => {
expect(firstProtoView).toBe(protoView); expect(firstProtoView).toBe(protoView);
done(); done();
@ -151,7 +151,3 @@ class MockStep extends CompileStep {
this.processClosure(parent, current, control); this.processClosure(parent, current, control);
} }
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

23
modules/core/test/compiler/integration_spec.js
View File

@ -1,4 +1,4 @@
import {describe, xit, it, expect, beforeEach, ddescribe, iit} from 'test_lib/test_lib'; import {describe, xit, it, expect, beforeEach, ddescribe, iit, el} from 'test_lib/test_lib';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
@ -33,7 +33,7 @@ export function main() {
} }
it('should consume text node changes', (done) => { it('should consume text node changes', (done) => {
compiler.compile(MyComp, createElement('<div>{{ctxProp}}</div>')).then((pv) => { compiler.compile(MyComp, el('<div>{{ctxProp}}</div>')).then((pv) => {
createView(pv); createView(pv);
ctx.ctxProp = 'Hello World!'; ctx.ctxProp = 'Hello World!';
@ -44,7 +44,7 @@ export function main() {
}); });
it('should consume element binding changes', (done) => { it('should consume element binding changes', (done) => {
compiler.compile(MyComp, createElement('<div [id]="ctxProp"></div>')).then((pv) => { compiler.compile(MyComp, el('<div [id]="ctxProp"></div>')).then((pv) => {
createView(pv); createView(pv);
ctx.ctxProp = 'Hello World!'; ctx.ctxProp = 'Hello World!';
@ -56,7 +56,7 @@ export function main() {
}); });
it('should consume directive watch expression change.', (done) => { it('should consume directive watch expression change.', (done) => {
compiler.compile(MyComp, createElement('<div my-dir [elprop]="ctxProp"></div>')).then((pv) => { compiler.compile(MyComp, el('<div my-dir [elprop]="ctxProp"></div>')).then((pv) => {
createView(pv); createView(pv);
ctx.ctxProp = 'Hello World!'; ctx.ctxProp = 'Hello World!';
@ -69,7 +69,7 @@ export function main() {
}); });
it('should support nested components.', (done) => { it('should support nested components.', (done) => {
compiler.compile(MyComp, createElement('<child-cmp></child-cmp>')).then((pv) => { compiler.compile(MyComp, el('<child-cmp></child-cmp>')).then((pv) => {
createView(pv); createView(pv);
cd.detectChanges(); cd.detectChanges();
@ -80,7 +80,7 @@ export function main() {
}); });
it('should support template directives via `<template>` elements.', (done) => { it('should support template directives via `<template>` elements.', (done) => {
compiler.compile(MyComp, createElement('<div><template let-some-tmpl="greeting"><copy-me>{{greeting}}</copy-me></template></div>')).then((pv) => { compiler.compile(MyComp, el('<div><template let-some-tmpl="greeting"><copy-me>{{greeting}}</copy-me></template></div>')).then((pv) => {
createView(pv); createView(pv);
cd.detectChanges(); cd.detectChanges();
@ -95,7 +95,7 @@ export function main() {
}); });
it('should support template directives via `template` attribute.', (done) => { it('should support template directives via `template` attribute.', (done) => {
compiler.compile(MyComp, createElement('<div><copy-me template="some-tmpl #greeting">{{greeting}}</copy-me></div>')).then((pv) => { compiler.compile(MyComp, el('<div><copy-me template="some-tmpl #greeting">{{greeting}}</copy-me></div>')).then((pv) => {
createView(pv); createView(pv);
cd.detectChanges(); cd.detectChanges();
@ -111,7 +111,7 @@ export function main() {
}); });
it('should emulate content tag', (done) => { it('should emulate content tag', (done) => {
var el = `<emulated-shadow-dom-component>` + var temp = `<emulated-shadow-dom-component>` +
`<div>Light</div>` + `<div>Light</div>` +
`<div template="trivial-template">DOM</div>` + `<div template="trivial-template">DOM</div>` +
`</emulated-shadow-dom-component>`; `</emulated-shadow-dom-component>`;
@ -122,7 +122,7 @@ export function main() {
return view; return view;
} }
compiler.compile(MyComp, createElement(el)). compiler.compile(MyComp, el(temp)).
then(createView). then(createView).
then((view) => { then((view) => {
expect(DOM.getText(view.nodes[0])).toEqual('Before LightDOM After'); expect(DOM.getText(view.nodes[0])).toEqual('Before LightDOM After');
@ -207,8 +207,3 @@ class MyService {
this.greeting = 'hello'; this.greeting = 'hello';
} }
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

40
modules/core/test/compiler/pipeline/directive_parser_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {isPresent} from 'facade/lang'; import {isPresent} from 'facade/lang';
import {ListWrapper, MapWrapper, StringMapWrapper} from 'facade/collection'; import {ListWrapper, MapWrapper, StringMapWrapper} from 'facade/collection';
import {DirectiveParser} from 'core/compiler/pipeline/directive_parser'; import {DirectiveParser} from 'core/compiler/pipeline/directive_parser';
@ -50,7 +50,7 @@ export function main() {
} }
it('should not add directives if they are not used', () => { it('should not add directives if they are not used', () => {
var results = createPipeline().process(createElement('<div></div>')); var results = createPipeline().process(el('<div></div>'));
expect(results[0].decoratorDirectives).toBe(null); expect(results[0].decoratorDirectives).toBe(null);
expect(results[0].componentDirective).toBe(null); expect(results[0].componentDirective).toBe(null);
expect(results[0].templateDirective).toBe(null); expect(results[0].templateDirective).toBe(null);
@ -58,7 +58,7 @@ export function main() {
describe('component directives', () => { describe('component directives', () => {
it('should detect them in attributes', () => { it('should detect them in attributes', () => {
var results = createPipeline().process(createElement('<div some-comp></div>')); var results = createPipeline().process(el('<div some-comp></div>'));
expect(results[0].componentDirective).toEqual(reader.read(SomeComponent)); expect(results[0].componentDirective).toEqual(reader.read(SomeComponent));
}); });
@ -66,7 +66,7 @@ export function main() {
var pipeline = createPipeline({propertyBindings: { var pipeline = createPipeline({propertyBindings: {
'some-comp': 'someExpr' 'some-comp': 'someExpr'
}}); }});
var results = pipeline.process(createElement('<div></div>')); var results = pipeline.process(el('<div></div>'));
expect(results[0].componentDirective).toEqual(reader.read(SomeComponent)); expect(results[0].componentDirective).toEqual(reader.read(SomeComponent));
}); });
@ -74,14 +74,14 @@ export function main() {
var pipeline = createPipeline({variableBindings: { var pipeline = createPipeline({variableBindings: {
'some-comp': 'someExpr' 'some-comp': 'someExpr'
}}); }});
var results = pipeline.process(createElement('<div></div>')); var results = pipeline.process(el('<div></div>'));
expect(results[0].componentDirective).toEqual(reader.read(SomeComponent)); expect(results[0].componentDirective).toEqual(reader.read(SomeComponent));
}); });
it('should not allow multiple component directives on the same element', () => { it('should not allow multiple component directives on the same element', () => {
expect( () => { expect( () => {
createPipeline().process( createPipeline().process(
createElement('<div some-comp some-comp2></div>') el('<div some-comp some-comp2></div>')
); );
}).toThrowError('Only one component directive per element is allowed!'); }).toThrowError('Only one component directive per element is allowed!');
}); });
@ -89,7 +89,7 @@ export function main() {
it('should not allow component directives on <template> elements', () => { it('should not allow component directives on <template> elements', () => {
expect( () => { expect( () => {
createPipeline().process( createPipeline().process(
createElement('<template some-comp></template>') el('<template some-comp></template>')
); );
}).toThrowError('Only template directives are allowed on <template> elements!'); }).toThrowError('Only template directives are allowed on <template> elements!');
}); });
@ -97,7 +97,7 @@ export function main() {
describe('template directives', () => { describe('template directives', () => {
it('should detect them in attributes', () => { it('should detect them in attributes', () => {
var results = createPipeline().process(createElement('<template some-templ></template>')); var results = createPipeline().process(el('<template some-templ></template>'));
expect(results[0].templateDirective).toEqual(reader.read(SomeTemplate)); expect(results[0].templateDirective).toEqual(reader.read(SomeTemplate));
}); });
@ -105,7 +105,7 @@ export function main() {
var pipeline = createPipeline({propertyBindings: { var pipeline = createPipeline({propertyBindings: {
'some-templ': 'someExpr' 'some-templ': 'someExpr'
}}); }});
var results = pipeline.process(createElement('<template></template>')); var results = pipeline.process(el('<template></template>'));
expect(results[0].templateDirective).toEqual(reader.read(SomeTemplate)); expect(results[0].templateDirective).toEqual(reader.read(SomeTemplate));
}); });
@ -113,14 +113,14 @@ export function main() {
var pipeline = createPipeline({variableBindings: { var pipeline = createPipeline({variableBindings: {
'some-templ': 'someExpr' 'some-templ': 'someExpr'
}}); }});
var results = pipeline.process(createElement('<template></template>')); var results = pipeline.process(el('<template></template>'));
expect(results[0].templateDirective).toEqual(reader.read(SomeTemplate)); expect(results[0].templateDirective).toEqual(reader.read(SomeTemplate));
}); });
it('should not allow multiple template directives on the same element', () => { it('should not allow multiple template directives on the same element', () => {
expect( () => { expect( () => {
createPipeline().process( createPipeline().process(
createElement('<template some-templ some-templ2></template>') el('<template some-templ some-templ2></template>')
); );
}).toThrowError('Only one template directive per element is allowed!'); }).toThrowError('Only one template directive per element is allowed!');
}); });
@ -128,7 +128,7 @@ export function main() {
it('should not allow template directives on non <template> elements', () => { it('should not allow template directives on non <template> elements', () => {
expect( () => { expect( () => {
createPipeline().process( createPipeline().process(
createElement('<div some-templ></div>') el('<div some-templ></div>')
); );
}).toThrowError('Template directives need to be placed on <template> elements or elements with template attribute!'); }).toThrowError('Template directives need to be placed on <template> elements or elements with template attribute!');
}); });
@ -136,7 +136,7 @@ export function main() {
describe('decorator directives', () => { describe('decorator directives', () => {
it('should detect them in attributes', () => { it('should detect them in attributes', () => {
var results = createPipeline().process(createElement('<div some-decor></div>')); var results = createPipeline().process(el('<div some-decor></div>'));
expect(results[0].decoratorDirectives).toEqual([reader.read(SomeDecorator)]); expect(results[0].decoratorDirectives).toEqual([reader.read(SomeDecorator)]);
}); });
@ -144,17 +144,17 @@ export function main() {
var pipeline = createPipeline({propertyBindings: { var pipeline = createPipeline({propertyBindings: {
'some-decor': 'someExpr' 'some-decor': 'someExpr'
}}); }});
var results = pipeline.process(createElement('<div></div>')); var results = pipeline.process(el('<div></div>'));
expect(results[0].decoratorDirectives).toEqual([reader.read(SomeDecorator)]); expect(results[0].decoratorDirectives).toEqual([reader.read(SomeDecorator)]);
}); });
it('should compile children by default', () => { it('should compile children by default', () => {
var results = createPipeline().process(createElement('<div some-decor></div>')); var results = createPipeline().process(el('<div some-decor></div>'));
expect(results[0].compileChildren).toEqual(true); expect(results[0].compileChildren).toEqual(true);
}); });
it('should stop compiling children when specified in the decorator config', () => { it('should stop compiling children when specified in the decorator config', () => {
var results = createPipeline().process(createElement('<div some-decor-ignoring-children></div>')); var results = createPipeline().process(el('<div some-decor-ignoring-children></div>'));
expect(results[0].compileChildren).toEqual(false); expect(results[0].compileChildren).toEqual(false);
}); });
@ -162,14 +162,14 @@ export function main() {
var pipeline = createPipeline({variableBindings: { var pipeline = createPipeline({variableBindings: {
'some-decor': 'someExpr' 'some-decor': 'someExpr'
}}); }});
var results = pipeline.process(createElement('<div></div>')); var results = pipeline.process(el('<div></div>'));
expect(results[0].decoratorDirectives).toEqual([reader.read(SomeDecorator)]); expect(results[0].decoratorDirectives).toEqual([reader.read(SomeDecorator)]);
}); });
it('should not allow decorator directives on <template> elements', () => { it('should not allow decorator directives on <template> elements', () => {
expect( () => { expect( () => {
createPipeline().process( createPipeline().process(
createElement('<template some-decor></template>') el('<template some-decor></template>')
); );
}).toThrowError('Only template directives are allowed on <template> elements!'); }).toThrowError('Only template directives are allowed on <template> elements!');
}); });
@ -226,7 +226,3 @@ class SomeComponent2 {}
}) })
}) })
class MyComp {} class MyComp {}
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

33
modules/core/test/compiler/pipeline/element_binder_builder_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {isPresent} from 'facade/lang'; import {isPresent} from 'facade/lang';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {ListWrapper, MapWrapper} from 'facade/collection'; import {ListWrapper, MapWrapper} from 'facade/collection';
@ -82,7 +82,7 @@ export function main() {
it('should not create an ElementBinder for elements that have no bindings', () => { it('should not create an ElementBinder for elements that have no bindings', () => {
var pipeline = createPipeline(); var pipeline = createPipeline();
var results = pipeline.process(createElement('<div viewroot><span></span></div>')); var results = pipeline.process(el('<div viewroot><span></span></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders.length).toBe(0); expect(pv.elementBinders.length).toBe(0);
@ -90,7 +90,7 @@ export function main() {
it('should create an ElementBinder for elements that have bindings', () => { it('should create an ElementBinder for elements that have bindings', () => {
var pipeline = createPipeline(); var pipeline = createPipeline();
var results = pipeline.process(createElement('<div viewroot prop-binding><span prop-binding></span></div>')); var results = pipeline.process(el('<div viewroot prop-binding><span prop-binding></span></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders.length).toBe(2); expect(pv.elementBinders.length).toBe(2);
@ -99,7 +99,7 @@ export function main() {
it('should inherit ElementBinders to children that have no bindings', () => { it('should inherit ElementBinders to children that have no bindings', () => {
var pipeline = createPipeline(); var pipeline = createPipeline();
var results = pipeline.process(createElement('<div viewroot prop-binding><span></span></div>')); var results = pipeline.process(el('<div viewroot prop-binding><span></span></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders.length).toBe(1); expect(pv.elementBinders.length).toBe(1);
@ -111,7 +111,7 @@ export function main() {
var protoElementInjector = new ProtoElementInjector(null, 0, directives); var protoElementInjector = new ProtoElementInjector(null, 0, directives);
var pipeline = createPipeline({protoElementInjector: protoElementInjector, directives: directives}); var pipeline = createPipeline({protoElementInjector: protoElementInjector, directives: directives});
var results = pipeline.process(createElement('<div viewroot directives></div>')); var results = pipeline.process(el('<div viewroot directives></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders[0].protoElementInjector).toBe(protoElementInjector); expect(pv.elementBinders[0].protoElementInjector).toBe(protoElementInjector);
@ -120,7 +120,7 @@ export function main() {
it('should store the component directive', () => { it('should store the component directive', () => {
var directives = [SomeComponentDirective]; var directives = [SomeComponentDirective];
var pipeline = createPipeline({protoElementInjector: null, directives: directives}); var pipeline = createPipeline({protoElementInjector: null, directives: directives});
var results = pipeline.process(createElement('<div viewroot directives></div>')); var results = pipeline.process(el('<div viewroot directives></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders[0].componentDirective.type).toBe(SomeComponentDirective); expect(pv.elementBinders[0].componentDirective.type).toBe(SomeComponentDirective);
@ -129,7 +129,7 @@ export function main() {
it('should store the template directive', () => { it('should store the template directive', () => {
var directives = [SomeTemplateDirective]; var directives = [SomeTemplateDirective];
var pipeline = createPipeline({protoElementInjector: null, directives: directives}); var pipeline = createPipeline({protoElementInjector: null, directives: directives});
var results = pipeline.process(createElement('<div viewroot directives></div>')); var results = pipeline.process(el('<div viewroot directives></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders[0].templateDirective.type).toBe(SomeTemplateDirective); expect(pv.elementBinders[0].templateDirective.type).toBe(SomeTemplateDirective);
@ -140,7 +140,7 @@ export function main() {
MapWrapper.set(textNodeBindings, 0, 'prop1'); MapWrapper.set(textNodeBindings, 0, 'prop1');
MapWrapper.set(textNodeBindings, 2, 'prop2'); MapWrapper.set(textNodeBindings, 2, 'prop2');
var pipeline = createPipeline({textNodeBindings: textNodeBindings}); var pipeline = createPipeline({textNodeBindings: textNodeBindings});
var results = pipeline.process(createElement('<div viewroot text-binding>{{}}<span></span>{{}}</div>')); var results = pipeline.process(el('<div viewroot text-binding>{{}}<span></span>{{}}</div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(sortArr(pv.elementBinders[0].textNodeIndices)).toEqual([0, 2]); expect(sortArr(pv.elementBinders[0].textNodeIndices)).toEqual([0, 2]);
@ -160,7 +160,7 @@ export function main() {
'hidden': 'prop2' 'hidden': 'prop2'
}); });
var pipeline = createPipeline({propertyBindings: propertyBindings}); var pipeline = createPipeline({propertyBindings: propertyBindings});
var results = pipeline.process(createElement('<input viewroot prop-binding>')); var results = pipeline.process(el('<input viewroot prop-binding>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
expect(pv.elementBinders[0].hasElementPropertyBindings).toBe(true); expect(pv.elementBinders[0].hasElementPropertyBindings).toBe(true);
@ -179,7 +179,7 @@ export function main() {
'event1': '1+1' 'event1': '1+1'
}); });
var pipeline = createPipeline({eventBindings: eventBindings}); var pipeline = createPipeline({eventBindings: eventBindings});
var results = pipeline.process(createElement('<div viewroot event-binding></div>')); var results = pipeline.process(el('<div viewroot event-binding></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
var ast = MapWrapper.get(pv.elementBinders[0].events, 'event1'); var ast = MapWrapper.get(pv.elementBinders[0].events, 'event1');
@ -201,10 +201,10 @@ export function main() {
directives: directives, directives: directives,
protoElementInjector: protoElementInjector protoElementInjector: protoElementInjector
}); });
var results = pipeline.process(createElement('<div viewroot prop-binding directives></div>')); var results = pipeline.process(el('<div viewroot prop-binding directives></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
results[0].inheritedElementBinder.nestedProtoView = new ProtoView( results[0].inheritedElementBinder.nestedProtoView = new ProtoView(
createElement('<div></div>'), new ProtoRecordRange()); el('<div></div>'), new ProtoRecordRange());
instantiateView(pv); instantiateView(pv);
evalContext.prop1 = 'a'; evalContext.prop1 = 'a';
@ -230,7 +230,7 @@ export function main() {
protoElementInjector: protoElementInjector protoElementInjector: protoElementInjector
}); });
var results = pipeline.process( var results = pipeline.process(
createElement('<div viewroot><div prop-binding directives>'+ el('<div viewroot><div prop-binding directives>'+
'</div><div prop-binding directives></div></div>')); '</div><div prop-binding directives></div></div>'));
var pv = results[0].inheritedProtoView; var pv = results[0].inheritedProtoView;
@ -246,7 +246,7 @@ export function main() {
it('should throw if there is no element property bindings for a directive property binding', () => { it('should throw if there is no element property bindings for a directive property binding', () => {
var pipeline = createPipeline({propertyBindings: MapWrapper.create(), directives: [SomeDecoratorDirectiveWithBinding]}); var pipeline = createPipeline({propertyBindings: MapWrapper.create(), directives: [SomeDecoratorDirectiveWithBinding]});
expect( () => { expect( () => {
pipeline.process(createElement('<div viewroot prop-binding directives>')); pipeline.process(el('<div viewroot prop-binding directives>'));
}).toThrowError('No element binding found for property boundprop1 which is required by directive SomeDecoratorDirectiveWithBinding'); }).toThrowError('No element binding found for property boundprop1 which is required by directive SomeDecoratorDirectiveWithBinding');
}); });
@ -341,8 +341,3 @@ function sortArr(arr) {
arr2.sort(); arr2.sort();
return arr2; return arr2;
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

24
modules/core/test/compiler/pipeline/element_binding_marker_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {isPresent} from 'facade/lang'; import {isPresent} from 'facade/lang';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {MapWrapper} from 'facade/collection'; import {MapWrapper} from 'facade/collection';
@ -40,53 +40,53 @@ export function main() {
} }
it('should not mark empty elements', () => { it('should not mark empty elements', () => {
var results = createPipeline().process(createElement('<div></div>')); var results = createPipeline().process(el('<div></div>'));
assertBinding(results[0], false); assertBinding(results[0], false);
}); });
it('should mark elements with text node bindings', () => { it('should mark elements with text node bindings', () => {
var textNodeBindings = MapWrapper.create(); var textNodeBindings = MapWrapper.create();
MapWrapper.set(textNodeBindings, 0, 'expr'); MapWrapper.set(textNodeBindings, 0, 'expr');
var results = createPipeline({textNodeBindings: textNodeBindings}).process(createElement('<div></div>')); var results = createPipeline({textNodeBindings: textNodeBindings}).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
it('should mark elements with property bindings', () => { it('should mark elements with property bindings', () => {
var propertyBindings = MapWrapper.createFromStringMap({'a': 'expr'}); var propertyBindings = MapWrapper.createFromStringMap({'a': 'expr'});
var results = createPipeline({propertyBindings: propertyBindings}).process(createElement('<div></div>')); var results = createPipeline({propertyBindings: propertyBindings}).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
it('should mark elements with variable bindings', () => { it('should mark elements with variable bindings', () => {
var variableBindings = MapWrapper.createFromStringMap({'a': 'expr'}); var variableBindings = MapWrapper.createFromStringMap({'a': 'expr'});
var results = createPipeline({variableBindings: variableBindings}).process(createElement('<div></div>')); var results = createPipeline({variableBindings: variableBindings}).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
it('should mark elements with event bindings', () => { it('should mark elements with event bindings', () => {
var eventBindings = MapWrapper.createFromStringMap({'click': 'expr'}); var eventBindings = MapWrapper.createFromStringMap({'click': 'expr'});
var results = createPipeline({eventBindings: eventBindings}).process(createElement('<div></div>')); var results = createPipeline({eventBindings: eventBindings}).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
it('should mark elements with decorator directives', () => { it('should mark elements with decorator directives', () => {
var results = createPipeline({ var results = createPipeline({
directives: [SomeDecoratorDirective] directives: [SomeDecoratorDirective]
}).process(createElement('<div></div>')); }).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
it('should mark elements with template directives', () => { it('should mark elements with template directives', () => {
var results = createPipeline({ var results = createPipeline({
directives: [SomeTemplateDirective] directives: [SomeTemplateDirective]
}).process(createElement('<div></div>')); }).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
it('should mark elements with component directives', () => { it('should mark elements with component directives', () => {
var results = createPipeline({ var results = createPipeline({
directives: [SomeComponentDirective] directives: [SomeComponentDirective]
}).process(createElement('<div></div>')); }).process(el('<div></div>'));
assertBinding(results[0], true); assertBinding(results[0], true);
}); });
@ -115,8 +115,4 @@ class SomeTemplateDirective {}
class SomeComponentDirective {} class SomeComponentDirective {}
@Decorator() @Decorator()
class SomeDecoratorDirective {} class SomeDecoratorDirective {}
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

26
modules/core/test/compiler/pipeline/pipeline_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {ListWrapper, List, MapWrapper} from 'facade/collection'; import {ListWrapper, List, MapWrapper} from 'facade/collection';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {isPresent, NumberWrapper, StringWrapper} from 'facade/lang'; import {isPresent, NumberWrapper, StringWrapper} from 'facade/lang';
@ -12,7 +12,7 @@ export function main() {
describe('compile_pipeline', () => { describe('compile_pipeline', () => {
describe('children compilation', () => { describe('children compilation', () => {
it('should walk the tree in depth first order including template contents', () => { it('should walk the tree in depth first order including template contents', () => {
var element = createElement('<div id="1"><template id="2"><span id="3"></span></template></div>'); var element = el('<div id="1"><template id="2"><span id="3"></span></template></div>');
var step0Log = []; var step0Log = [];
var results = new CompilePipeline([createLoggerStep(step0Log)]).process(element); var results = new CompilePipeline([createLoggerStep(step0Log)]).process(element);
@ -22,7 +22,7 @@ export function main() {
}); });
it('should stop walking the tree when compileChildren is false', () => { it('should stop walking the tree when compileChildren is false', () => {
var element = createElement('<div id="1"><template id="2" ignore-children><span id="3"></span></template></div>'); var element = el('<div id="1"><template id="2" ignore-children><span id="3"></span></template></div>');
var step0Log = []; var step0Log = [];
var pipeline = new CompilePipeline([new IgnoreChildrenStep(), createLoggerStep(step0Log)]); var pipeline = new CompilePipeline([new IgnoreChildrenStep(), createLoggerStep(step0Log)]);
@ -35,7 +35,7 @@ export function main() {
describe('control.addParent', () => { describe('control.addParent', () => {
it('should report the new parent to the following processor and the result', () => { it('should report the new parent to the following processor and the result', () => {
var element = createElement('<div id="1"><span wrap0="1" id="2"><b id="3"></b></span></div>'); var element = el('<div id="1"><span wrap0="1" id="2"><b id="3"></b></span></div>');
var step0Log = []; var step0Log = [];
var step1Log = []; var step1Log = [];
var pipeline = new CompilePipeline([ var pipeline = new CompilePipeline([
@ -49,7 +49,7 @@ export function main() {
}); });
it('should allow to add a parent by multiple processors to the same element', () => { it('should allow to add a parent by multiple processors to the same element', () => {
var element = createElement('<div id="1"><span wrap0="1" wrap1="1" id="2"><b id="3"></b></span></div>'); var element = el('<div id="1"><span wrap0="1" wrap1="1" id="2"><b id="3"></b></span></div>');
var step0Log = []; var step0Log = [];
var step1Log = []; var step1Log = [];
var step2Log = []; var step2Log = [];
@ -66,7 +66,7 @@ export function main() {
}); });
it('should allow to add a parent by multiple processors to different elements', () => { it('should allow to add a parent by multiple processors to different elements', () => {
var element = createElement('<div id="1"><span wrap0="1" id="2"><b id="3" wrap1="1"></b></span></div>'); var element = el('<div id="1"><span wrap0="1" id="2"><b id="3" wrap1="1"></b></span></div>');
var step0Log = []; var step0Log = [];
var step1Log = []; var step1Log = [];
var step2Log = []; var step2Log = [];
@ -83,7 +83,7 @@ export function main() {
}); });
it('should allow to add multiple parents by the same processor', () => { it('should allow to add multiple parents by the same processor', () => {
var element = createElement('<div id="1"><span wrap0="2" id="2"><b id="3"></b></span></div>'); var element = el('<div id="1"><span wrap0="2" id="2"><b id="3"></b></span></div>');
var step0Log = []; var step0Log = [];
var step1Log = []; var step1Log = [];
var pipeline = new CompilePipeline([ var pipeline = new CompilePipeline([
@ -100,9 +100,9 @@ export function main() {
describe('control.addChild', () => { describe('control.addChild', () => {
it('should report the new child to all processors and the result', () => { it('should report the new child to all processors and the result', () => {
var element = createElement('<div id="1"><div id="2"></div></div>'); var element = el('<div id="1"><div id="2"></div></div>');
var resultLog = []; var resultLog = [];
var newChild = new CompileElement(createElement('<div id="3"></div>')); var newChild = new CompileElement(el('<div id="3"></div>'));
var pipeline = new CompilePipeline([ var pipeline = new CompilePipeline([
new MockStep((parent, current, control) => { new MockStep((parent, current, control) => {
if (StringWrapper.equals(current.element.id, '1')) { if (StringWrapper.equals(current.element.id, '1')) {
@ -161,7 +161,7 @@ function createWrapperStep(wrapperId, log) {
if (isPresent(parentCountStr)) { if (isPresent(parentCountStr)) {
var parentCount = NumberWrapper.parseInt(parentCountStr, 10); var parentCount = NumberWrapper.parseInt(parentCountStr, 10);
while (parentCount > 0) { while (parentCount > 0) {
control.addParent(new CompileElement(createElement(`<a id="${wrapperId}#${nextElementId++}"></a>`))); control.addParent(new CompileElement(el(`<a id="${wrapperId}#${nextElementId++}"></a>`)));
parentCount--; parentCount--;
} }
} }
@ -175,8 +175,4 @@ function resultIdLog(result) {
logEntry(idLog, null, current); logEntry(idLog, null, current);
}); });
return idLog; return idLog;
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

24
modules/core/test/compiler/pipeline/property_binding_parser_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {PropertyBindingParser} from 'core/compiler/pipeline/property_binding_parser'; import {PropertyBindingParser} from 'core/compiler/pipeline/property_binding_parser';
import {CompilePipeline} from 'core/compiler/pipeline/compile_pipeline'; import {CompilePipeline} from 'core/compiler/pipeline/compile_pipeline';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
@ -13,49 +13,45 @@ export function main() {
} }
it('should detect [] syntax', () => { it('should detect [] syntax', () => {
var results = createPipeline().process(createElement('<div [a]="b"></div>')); var results = createPipeline().process(el('<div [a]="b"></div>'));
expect(MapWrapper.get(results[0].propertyBindings, 'a').source).toEqual('b'); expect(MapWrapper.get(results[0].propertyBindings, 'a').source).toEqual('b');
}); });
it('should detect bind- syntax', () => { it('should detect bind- syntax', () => {
var results = createPipeline().process(createElement('<div bind-a="b"></div>')); var results = createPipeline().process(el('<div bind-a="b"></div>'));
expect(MapWrapper.get(results[0].propertyBindings, 'a').source).toEqual('b'); expect(MapWrapper.get(results[0].propertyBindings, 'a').source).toEqual('b');
}); });
it('should detect interpolation syntax', () => { it('should detect interpolation syntax', () => {
// Note: we don't test all corner cases of interpolation as we assume shared functionality between text interpolation // Note: we don't test all corner cases of interpolation as we assume shared functionality between text interpolation
// and attribute interpolation. // and attribute interpolation.
var results = createPipeline().process(createElement('<div a="{{b}}"></div>')); var results = createPipeline().process(el('<div a="{{b}}"></div>'));
expect(MapWrapper.get(results[0].propertyBindings, 'a').source).toEqual('(b)'); expect(MapWrapper.get(results[0].propertyBindings, 'a').source).toEqual('(b)');
}); });
it('should detect let- syntax', () => { it('should detect let- syntax', () => {
var results = createPipeline().process(createElement('<template let-a="b"></template>')); var results = createPipeline().process(el('<template let-a="b"></template>'));
expect(MapWrapper.get(results[0].variableBindings, 'a')).toEqual('b'); expect(MapWrapper.get(results[0].variableBindings, 'a')).toEqual('b');
}); });
it('should not allow let- syntax on non template elements', () => { it('should not allow let- syntax on non template elements', () => {
expect( () => { expect( () => {
createPipeline().process(createElement('<div let-a="b"></div>')) createPipeline().process(el('<div let-a="b"></div>'))
}).toThrowError('let-* is only allowed on <template> elements!'); }).toThrowError('let-* is only allowed on <template> elements!');
}); });
it('should detect () syntax', () => { it('should detect () syntax', () => {
var results = createPipeline().process(createElement('<div (click)="b()"></div>')); var results = createPipeline().process(el('<div (click)="b()"></div>'));
expect(MapWrapper.get(results[0].eventBindings, 'click').source).toEqual('b()'); expect(MapWrapper.get(results[0].eventBindings, 'click').source).toEqual('b()');
// "(click[])" is not an expected syntax and is only used to validate the regexp // "(click[])" is not an expected syntax and is only used to validate the regexp
results = createPipeline().process(createElement('<div (click[])="b()"></div>')); results = createPipeline().process(el('<div (click[])="b()"></div>'));
expect(MapWrapper.get(results[0].eventBindings, 'click[]').source).toEqual('b()'); expect(MapWrapper.get(results[0].eventBindings, 'click[]').source).toEqual('b()');
}); });
it('should detect on- syntax', () => { it('should detect on- syntax', () => {
var results = createPipeline().process(createElement('<div on-click="b()"></div>')); var results = createPipeline().process(el('<div on-click="b()"></div>'));
expect(MapWrapper.get(results[0].eventBindings, 'click').source).toEqual('b()'); expect(MapWrapper.get(results[0].eventBindings, 'click').source).toEqual('b()');
}); });
}); });
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

42
modules/core/test/compiler/pipeline/proto_element_injector_builder_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {isPresent, isBlank} from 'facade/lang'; import {isPresent, isBlank} from 'facade/lang';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {List, ListWrapper} from 'facade/collection'; import {List, ListWrapper} from 'facade/collection';
@ -44,20 +44,20 @@ export function main() {
} }
it('should not create a ProtoElementInjector for elements without directives', () => { it('should not create a ProtoElementInjector for elements without directives', () => {
var results = createPipeline().process(createElement('<div></div>')); var results = createPipeline().process(el('<div></div>'));
expect(results[0].inheritedProtoElementInjector).toBe(null); expect(results[0].inheritedProtoElementInjector).toBe(null);
}); });
it('should create a ProtoElementInjector for elements directives', () => { it('should create a ProtoElementInjector for elements directives', () => {
var directives = [SomeComponentDirective, SomeTemplateDirective, SomeDecoratorDirective]; var directives = [SomeComponentDirective, SomeTemplateDirective, SomeDecoratorDirective];
var results = createPipeline(directives).process(createElement('<div directives></div>')); var results = createPipeline(directives).process(el('<div directives></div>'));
var creationArgs = getCreationArgs(results[0].inheritedProtoElementInjector); var creationArgs = getCreationArgs(results[0].inheritedProtoElementInjector);
expect(creationArgs['bindings']).toEqual(directives); expect(creationArgs['bindings']).toEqual(directives);
}); });
it('should mark ProtoElementInjector for elements with component directives and use the ComponentDirective as first binding', () => { it('should mark ProtoElementInjector for elements with component directives and use the ComponentDirective as first binding', () => {
var directives = [SomeDecoratorDirective, SomeComponentDirective]; var directives = [SomeDecoratorDirective, SomeComponentDirective];
var results = createPipeline(directives).process(createElement('<div directives></div>')); var results = createPipeline(directives).process(el('<div directives></div>'));
var creationArgs = getCreationArgs(results[0].inheritedProtoElementInjector); var creationArgs = getCreationArgs(results[0].inheritedProtoElementInjector);
expect(creationArgs['firstBindingIsComponent']).toBe(true); expect(creationArgs['firstBindingIsComponent']).toBe(true);
expect(creationArgs['bindings']).toEqual([SomeComponentDirective, SomeDecoratorDirective]); expect(creationArgs['bindings']).toEqual([SomeComponentDirective, SomeDecoratorDirective]);
@ -68,7 +68,7 @@ export function main() {
ListWrapper.push(protoView.elementBinders, null); ListWrapper.push(protoView.elementBinders, null);
ListWrapper.push(protoView.elementBinders, null); ListWrapper.push(protoView.elementBinders, null);
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(createElement('<div directives></div>')); var results = createPipeline(directives).process(el('<div directives></div>'));
var creationArgs = getCreationArgs(results[0].inheritedProtoElementInjector); var creationArgs = getCreationArgs(results[0].inheritedProtoElementInjector);
expect(creationArgs['index']).toBe(protoView.elementBinders.length); expect(creationArgs['index']).toBe(protoView.elementBinders.length);
}); });
@ -76,52 +76,52 @@ export function main() {
describe("inheritedProtoElementInjector", () => { describe("inheritedProtoElementInjector", () => {
it('should inherit the ProtoElementInjector down to children without directives', () => { it('should inherit the ProtoElementInjector down to children without directives', () => {
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(createElement('<div directives><span></span></div>')); var results = createPipeline(directives).process(el('<div directives><span></span></div>'));
expect(results[1].inheritedProtoElementInjector).toBe(results[0].inheritedProtoElementInjector); expect(results[1].inheritedProtoElementInjector).toBe(results[0].inheritedProtoElementInjector);
}); });
it('should use the ProtoElementInjector of the parent element as parent', () => { it('should use the ProtoElementInjector of the parent element as parent', () => {
var el = createElement('<div directives><span><a directives></a></span></div>'); var element = el('<div directives><span><a directives></a></span></div>');
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(el); var results = createPipeline(directives).process(element);
expect(results[2].inheritedProtoElementInjector.parent).toBe( expect(results[2].inheritedProtoElementInjector.parent).toBe(
results[0].inheritedProtoElementInjector); results[0].inheritedProtoElementInjector);
}); });
it('should use a null parent for viewRoots', () => { it('should use a null parent for viewRoots', () => {
var el = createElement('<div directives><span viewroot directives></span></div>'); var element = el('<div directives><span viewroot directives></span></div>');
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(el); var results = createPipeline(directives).process(element);
expect(results[1].inheritedProtoElementInjector.parent).toBe(null); expect(results[1].inheritedProtoElementInjector.parent).toBe(null);
}); });
it('should use a null parent if there is an intermediate viewRoot', () => { it('should use a null parent if there is an intermediate viewRoot', () => {
var el = createElement('<div directives><span viewroot><a directives></a></span></div>'); var element = el('<div directives><span viewroot><a directives></a></span></div>');
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(el); var results = createPipeline(directives).process(element);
expect(results[2].inheritedProtoElementInjector.parent).toBe(null); expect(results[2].inheritedProtoElementInjector.parent).toBe(null);
}); });
}); });
describe("distanceToParentInjector", () => { describe("distanceToParentInjector", () => {
it("should be 0 for root elements", () => { it("should be 0 for root elements", () => {
var el = createElement('<div directives></div>'); var element = el('<div directives></div>');
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(el); var results = createPipeline(directives).process(element);
expect(results[0].inheritedProtoElementInjector.distanceToParent).toBe(0); expect(results[0].inheritedProtoElementInjector.distanceToParent).toBe(0);
}); });
it("should be 1 when a parent element has an injector", () => { it("should be 1 when a parent element has an injector", () => {
var el = createElement('<div directives><span directives></span></div>'); var element = el('<div directives><span directives></span></div>');
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(el); var results = createPipeline(directives).process(element);
expect(results[1].inheritedProtoElementInjector.distanceToParent).toBe(1); expect(results[1].inheritedProtoElementInjector.distanceToParent).toBe(1);
}); });
it("should add 1 for every element that does not have an injector", () => { it("should add 1 for every element that does not have an injector", () => {
var el = createElement('<div directives><a><b><span directives></span></b></a></div>'); var element = el('<div directives><a><b><span directives></span></b></a></div>');
var directives = [SomeDecoratorDirective]; var directives = [SomeDecoratorDirective];
var results = createPipeline(directives).process(el); var results = createPipeline(directives).process(element);
expect(results[3].inheritedProtoElementInjector.distanceToParent).toBe(3); expect(results[3].inheritedProtoElementInjector.distanceToParent).toBe(3);
}); });
}); });
@ -171,8 +171,4 @@ class SomeTemplateDirective {}
class SomeComponentDirective {} class SomeComponentDirective {}
@Decorator() @Decorator()
class SomeDecoratorDirective {} class SomeDecoratorDirective {}
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

24
modules/core/test/compiler/pipeline/proto_view_builder_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {isPresent} from 'facade/lang'; import {isPresent} from 'facade/lang';
import {ElementBinder} from 'core/compiler/element_binder'; import {ElementBinder} from 'core/compiler/element_binder';
import {ProtoViewBuilder} from 'core/compiler/pipeline/proto_view_builder'; import {ProtoViewBuilder} from 'core/compiler/pipeline/proto_view_builder';
@ -24,35 +24,35 @@ export function main() {
} }
it('should not create a ProtoView when the isViewRoot flag is not set', () => { it('should not create a ProtoView when the isViewRoot flag is not set', () => {
var results = createPipeline().process(createElement('<div></div>')); var results = createPipeline().process(el('<div></div>'));
expect(results[0].inheritedProtoView).toBe(null); expect(results[0].inheritedProtoView).toBe(null);
}); });
it('should create a ProtoView when the isViewRoot flag is set', () => { it('should create a ProtoView when the isViewRoot flag is set', () => {
var viewRootElement = createElement('<div viewroot></div>'); var viewRootElement = el('<div viewroot></div>');
var results = createPipeline().process(viewRootElement); var results = createPipeline().process(viewRootElement);
expect(results[0].inheritedProtoView.element).toBe(viewRootElement); expect(results[0].inheritedProtoView.element).toBe(viewRootElement);
}); });
it('should inherit the ProtoView down to children that have no isViewRoot set', () => { it('should inherit the ProtoView down to children that have no isViewRoot set', () => {
var viewRootElement = createElement('<div viewroot><span></span></div>'); var viewRootElement = el('<div viewroot><span></span></div>');
var results = createPipeline().process(viewRootElement); var results = createPipeline().process(viewRootElement);
expect(results[0].inheritedProtoView.element).toBe(viewRootElement); expect(results[0].inheritedProtoView.element).toBe(viewRootElement);
expect(results[1].inheritedProtoView.element).toBe(viewRootElement); expect(results[1].inheritedProtoView.element).toBe(viewRootElement);
}); });
it('should save ProtoView into the elementBinder of parent element', () => { it('should save ProtoView into the elementBinder of parent element', () => {
var el = createElement('<div viewroot><template><a viewroot></a></template></div>'); var element = el('<div viewroot><template><a viewroot></a></template></div>');
var results = createPipeline().process(el); var results = createPipeline().process(element);
expect(results[1].inheritedElementBinder.nestedProtoView).toBe(results[2].inheritedProtoView); expect(results[1].inheritedElementBinder.nestedProtoView).toBe(results[2].inheritedProtoView);
}); });
it('should bind variables to the nested ProtoView', () => { it('should bind variables to the nested ProtoView', () => {
var el = createElement('<div viewroot><template var-binding><a viewroot></a></template></div>'); var element = el('<div viewroot><template var-binding><a viewroot></a></template></div>');
var results = createPipeline({ var results = createPipeline({
'var1': 'map1', 'var1': 'map1',
'var2': 'map2' 'var2': 'map2'
}).process(el); }).process(element);
var npv = results[1].inheritedElementBinder.nestedProtoView; var npv = results[1].inheritedElementBinder.nestedProtoView;
expect(npv.variableBindings).toEqual(MapWrapper.createFromStringMap({ expect(npv.variableBindings).toEqual(MapWrapper.createFromStringMap({
'var1': 'map1', 'var1': 'map1',
@ -63,9 +63,9 @@ export function main() {
describe('errors', () => { describe('errors', () => {
it('should not allow multiple nested ProtoViews for the same parent element', () => { it('should not allow multiple nested ProtoViews for the same parent element', () => {
var el = createElement('<div viewroot><template><a viewroot></a><a viewroot></a></template></div>'); var element = el('<div viewroot><template><a viewroot></a><a viewroot></a></template></div>');
expect( () => { expect( () => {
createPipeline().process(el); createPipeline().process(element);
}).toThrowError('Only one nested view per element is allowed'); }).toThrowError('Only one nested view per element is allowed');
}); });
@ -82,8 +82,4 @@ class MockStep extends CompileStep {
process(parent:CompileElement, current:CompileElement, control:CompileControl) { process(parent:CompileElement, current:CompileElement, control:CompileControl) {
this.processClosure(parent, current, control); this.processClosure(parent, current, control);
} }
}
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
} }

18
modules/core/test/compiler/pipeline/text_interpolation_parser_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, expect, it, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, expect, it, iit, ddescribe, el} from 'test_lib/test_lib';
import {TextInterpolationParser} from 'core/compiler/pipeline/text_interpolation_parser'; import {TextInterpolationParser} from 'core/compiler/pipeline/text_interpolation_parser';
import {CompilePipeline} from 'core/compiler/pipeline/compile_pipeline'; import {CompilePipeline} from 'core/compiler/pipeline/compile_pipeline';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
@ -17,45 +17,41 @@ export function main() {
} }
it('should find text interpolation in normal elements', () => { it('should find text interpolation in normal elements', () => {
var results = createPipeline().process(createElement('<div>{{expr1}}<span></span>{{expr2}}</div>')); var results = createPipeline().process(el('<div>{{expr1}}<span></span>{{expr2}}</div>'));
var bindings = results[0].textNodeBindings; var bindings = results[0].textNodeBindings;
expect(MapWrapper.get(bindings, 0).source).toEqual("(expr1)"); expect(MapWrapper.get(bindings, 0).source).toEqual("(expr1)");
expect(MapWrapper.get(bindings, 2).source).toEqual("(expr2)"); expect(MapWrapper.get(bindings, 2).source).toEqual("(expr2)");
}); });
it('should find text interpolation in template elements', () => { it('should find text interpolation in template elements', () => {
var results = createPipeline().process(createElement('<template>{{expr1}}<span></span>{{expr2}}</template>')); var results = createPipeline().process(el('<template>{{expr1}}<span></span>{{expr2}}</template>'));
var bindings = results[0].textNodeBindings; var bindings = results[0].textNodeBindings;
expect(MapWrapper.get(bindings, 0).source).toEqual("(expr1)"); expect(MapWrapper.get(bindings, 0).source).toEqual("(expr1)");
expect(MapWrapper.get(bindings, 2).source).toEqual("(expr2)"); expect(MapWrapper.get(bindings, 2).source).toEqual("(expr2)");
}); });
it('should allow multiple expressions', () => { it('should allow multiple expressions', () => {
var results = createPipeline().process(createElement('<div>{{expr1}}{{expr2}}</div>')); var results = createPipeline().process(el('<div>{{expr1}}{{expr2}}</div>'));
var bindings = results[0].textNodeBindings; var bindings = results[0].textNodeBindings;
expect(MapWrapper.get(bindings, 0).source).toEqual("(expr1)+(expr2)"); expect(MapWrapper.get(bindings, 0).source).toEqual("(expr1)+(expr2)");
}); });
it('should not interpolate when compileChildren is false', () => { it('should not interpolate when compileChildren is false', () => {
var results = createPipeline().process(createElement('<div>{{included}}<span ignore-children>{{excluded}}</span></div>')); var results = createPipeline().process(el('<div>{{included}}<span ignore-children>{{excluded}}</span></div>'));
var bindings = results[0].textNodeBindings; var bindings = results[0].textNodeBindings;
expect(MapWrapper.get(bindings, 0).source).toEqual("(included)"); expect(MapWrapper.get(bindings, 0).source).toEqual("(included)");
expect(results[1].textNodeBindings).toBe(null); expect(results[1].textNodeBindings).toBe(null);
}); });
it('should allow fixed text before, in between and after expressions', () => { it('should allow fixed text before, in between and after expressions', () => {
var results = createPipeline().process(createElement('<div>a{{expr1}}b{{expr2}}c</div>')); var results = createPipeline().process(el('<div>a{{expr1}}b{{expr2}}c</div>'));
var bindings = results[0].textNodeBindings; var bindings = results[0].textNodeBindings;
expect(MapWrapper.get(bindings, 0).source).toEqual("'a'+(expr1)+'b'+(expr2)+'c'"); expect(MapWrapper.get(bindings, 0).source).toEqual("'a'+(expr1)+'b'+(expr2)+'c'");
}); });
it('should escape quotes in fixed parts', () => { it('should escape quotes in fixed parts', () => {
var results = createPipeline().process(createElement("<div>'\"a{{expr1}}</div>")); var results = createPipeline().process(el("<div>'\"a{{expr1}}</div>"));
expect(MapWrapper.get(results[0].textNodeBindings, 0).source).toEqual("'\\'\"a'+(expr1)"); expect(MapWrapper.get(results[0].textNodeBindings, 0).source).toEqual("'\\'\"a'+(expr1)");
}); });
}); });
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

26
modules/core/test/compiler/pipeline/view_splitter_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'test_lib/test_lib';
import {isPresent} from 'facade/lang'; import {isPresent} from 'facade/lang';
import {MapWrapper} from 'facade/collection'; import {MapWrapper} from 'facade/collection';
@ -16,7 +16,7 @@ export function main() {
} }
it('should mark root elements as viewRoot', () => { it('should mark root elements as viewRoot', () => {
var rootElement = createElement('<div></div>'); var rootElement = el('<div></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(results[0].isViewRoot).toBe(true); expect(results[0].isViewRoot).toBe(true);
}); });
@ -24,7 +24,7 @@ export function main() {
describe('<template> elements', () => { describe('<template> elements', () => {
it('should move the content into a new <template> element and mark that as viewRoot', () => { it('should move the content into a new <template> element and mark that as viewRoot', () => {
var rootElement = createElement('<div><template if="true">a</template></div>'); var rootElement = el('<div><template if="true">a</template></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(DOM.getOuterHTML(results[1].element)).toEqual('<template if="true"></template>'); expect(DOM.getOuterHTML(results[1].element)).toEqual('<template if="true"></template>');
expect(results[1].isViewRoot).toBe(false); expect(results[1].isViewRoot).toBe(false);
@ -33,7 +33,7 @@ export function main() {
}); });
it('should not wrap a root <template> element', () => { it('should not wrap a root <template> element', () => {
var rootElement = createElement('<div></div>'); var rootElement = el('<div></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(results.length).toBe(1); expect(results.length).toBe(1);
expect(DOM.getOuterHTML(rootElement)).toEqual('<div></div>'); expect(DOM.getOuterHTML(rootElement)).toEqual('<div></div>');
@ -44,7 +44,7 @@ export function main() {
describe('elements with template attribute', () => { describe('elements with template attribute', () => {
it('should replace the element with an empty <template> element', () => { it('should replace the element with an empty <template> element', () => {
var rootElement = createElement('<div><span template=""></span></div>'); var rootElement = el('<div><span template=""></span></div>');
var originalChild = rootElement.childNodes[0]; var originalChild = rootElement.childNodes[0];
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(results[0].element).toBe(rootElement); expect(results[0].element).toBe(rootElement);
@ -54,25 +54,25 @@ export function main() {
}); });
it('should mark the element as viewRoot', () => { it('should mark the element as viewRoot', () => {
var rootElement = createElement('<div><div template></div></div>'); var rootElement = el('<div><div template></div></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(results[2].isViewRoot).toBe(true); expect(results[2].isViewRoot).toBe(true);
}); });
it('should add property bindings from the template attribute', () => { it('should add property bindings from the template attribute', () => {
var rootElement = createElement('<div><div template="prop:expr"></div></div>'); var rootElement = el('<div><div template="prop:expr"></div></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(MapWrapper.get(results[1].propertyBindings, 'prop').source).toEqual('expr'); expect(MapWrapper.get(results[1].propertyBindings, 'prop').source).toEqual('expr');
}); });
it('should add variable mappings from the template attribute', () => { it('should add variable mappings from the template attribute', () => {
var rootElement = createElement('<div><div template="varName #mapName"></div></div>'); var rootElement = el('<div><div template="varName #mapName"></div></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(results[1].variableBindings).toEqual(MapWrapper.createFromStringMap({'varName': 'mapName'})); expect(results[1].variableBindings).toEqual(MapWrapper.createFromStringMap({'varName': 'mapName'}));
}); });
it('should add entries without value as attribute to the element', () => { it('should add entries without value as attribute to the element', () => {
var rootElement = createElement('<div><div template="varname"></div></div>'); var rootElement = el('<div><div template="varname"></div></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
expect(results[1].attrs()).toEqual(MapWrapper.createFromStringMap({'varname': ''})); expect(results[1].attrs()).toEqual(MapWrapper.createFromStringMap({'varname': ''}));
expect(results[1].propertyBindings).toBe(null); expect(results[1].propertyBindings).toBe(null);
@ -80,7 +80,7 @@ export function main() {
}); });
it('should iterate properly after a template dom modification', () => { it('should iterate properly after a template dom modification', () => {
var rootElement = createElement('<div><div template></div><after></after></div>'); var rootElement = el('<div><div template></div><after></after></div>');
var results = createPipeline().process(rootElement); var results = createPipeline().process(rootElement);
// 1 root + 2 initial + 1 generated template elements // 1 root + 2 initial + 1 generated template elements
expect(results.length).toEqual(4); expect(results.length).toEqual(4);
@ -89,8 +89,4 @@ export function main() {
}); });
}); });
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

10
modules/core/test/compiler/selector_spec.js
View File

@ -1,4 +1,4 @@
import {describe, it, expect, beforeEach, ddescribe, iit, xit} from 'test_lib/test_lib'; import {describe, it, expect, beforeEach, ddescribe, iit, xit, el} from 'test_lib/test_lib';
import {SelectorMatcher} from 'core/compiler/selector'; import {SelectorMatcher} from 'core/compiler/selector';
import {CssSelector} from 'core/compiler/selector'; import {CssSelector} from 'core/compiler/selector';
import {List, ListWrapper, MapWrapper} from 'facade/collection'; import {List, ListWrapper, MapWrapper} from 'facade/collection';
@ -68,8 +68,8 @@ export function main() {
matcher.addSelectable(CssSelector.parse('[some-decor]'), 1); matcher.addSelectable(CssSelector.parse('[some-decor]'), 1);
var elementSelector = new CssSelector(); var elementSelector = new CssSelector();
var el = createElement('<div attr></div>'); var element = el('<div attr></div>');
var empty = el.getAttribute('attr'); var empty = element.getAttribute('attr');
elementSelector.addAttribute('some-decor', empty); elementSelector.addAttribute('some-decor', empty);
matcher.match(elementSelector, selectableCollector); matcher.match(elementSelector, selectableCollector);
expect(matched).toEqual([1]); expect(matched).toEqual([1]);
@ -163,8 +163,4 @@ export function main() {
expect(cssSelector.toString()).toEqual('sometag.someclass[attrname=attrvalue]'); expect(cssSelector.toString()).toEqual('sometag.someclass[attrname=attrvalue]');
}); });
}); });
}
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
} }

22
modules/core/test/compiler/shadow_dom/content_tag_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, ddescribe, iit, SpyObject} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, ddescribe, iit, SpyObject, el} from 'test_lib/test_lib';
import {proxy, IMPLEMENTS} from 'facade/lang'; import {proxy, IMPLEMENTS} from 'facade/lang';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {Content} from 'core/compiler/shadow_dom_emulation/content_tag'; import {Content} from 'core/compiler/shadow_dom_emulation/content_tag';
@ -15,41 +15,37 @@ export function main() {
describe('Content', function() { describe('Content', function() {
it("should insert the nodes", () => { it("should insert the nodes", () => {
var lightDom = new DummyLightDom(); var lightDom = new DummyLightDom();
var parent = createElement("<div><content></content></div>"); var parent = el("<div><content></content></div>");
var content = DOM.firstChild(parent); var content = DOM.firstChild(parent);
var c = new Content(lightDom, new NgElement(content)); var c = new Content(lightDom, new NgElement(content));
c.insert([createElement("<a></a>"), createElement("<b></b>")]) c.insert([el("<a></a>"), el("<b></b>")])
expect(DOM.getInnerHTML(parent)).toEqual(`${_script}<a></a><b></b>${_script}`); expect(DOM.getInnerHTML(parent)).toEqual(`${_script}<a></a><b></b>${_script}`);
}); });
it("should remove the nodes from the previous insertion", () => { it("should remove the nodes from the previous insertion", () => {
var lightDom = new DummyLightDom(); var lightDom = new DummyLightDom();
var parent = createElement("<div><content></content></div>"); var parent = el("<div><content></content></div>");
var content = DOM.firstChild(parent); var content = DOM.firstChild(parent);
var c = new Content(lightDom, new NgElement(content)); var c = new Content(lightDom, new NgElement(content));
c.insert([createElement("<a></a>")]); c.insert([el("<a></a>")]);
c.insert([createElement("<b></b>")]); c.insert([el("<b></b>")]);
expect(DOM.getInnerHTML(parent)).toEqual(`${_script}<b></b>${_script}`); expect(DOM.getInnerHTML(parent)).toEqual(`${_script}<b></b>${_script}`);
}); });
it("should insert empty list", () => { it("should insert empty list", () => {
var lightDom = new DummyLightDom(); var lightDom = new DummyLightDom();
var parent = createElement("<div><content></content></div>"); var parent = el("<div><content></content></div>");
var content = DOM.firstChild(parent); var content = DOM.firstChild(parent);
var c = new Content(lightDom, new NgElement(content)); var c = new Content(lightDom, new NgElement(content));
c.insert([createElement("<a></a>")]); c.insert([el("<a></a>")]);
c.insert([]); c.insert([]);
expect(DOM.getInnerHTML(parent)).toEqual(`${_script}${_script}`); expect(DOM.getInnerHTML(parent)).toEqual(`${_script}${_script}`);
}); });
}); });
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

22
modules/core/test/compiler/shadow_dom/light_dom_spec.js
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, ddescribe, iit, SpyObject} from 'test_lib/test_lib'; import {describe, beforeEach, it, expect, ddescribe, iit, SpyObject, el} from 'test_lib/test_lib';
import {proxy, IMPLEMENTS, isBlank} from 'facade/lang'; import {proxy, IMPLEMENTS, isBlank} from 'facade/lang';
import {ListWrapper, MapWrapper} from 'facade/collection'; import {ListWrapper, MapWrapper} from 'facade/collection';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
@ -119,7 +119,7 @@ export function main() {
var tag = new FakeContentTag(); var tag = new FakeContentTag();
var shadowDomView = new FakeView([new FakeElementInjector(tag, null)]); var shadowDomView = new FakeView([new FakeElementInjector(tag, null)]);
var lightDom = new LightDom(lightDomView, shadowDomView, createElement("<div></div>")); var lightDom = new LightDom(lightDomView, shadowDomView, el("<div></div>"));
expect(lightDom.contentTags()).toEqual([tag]); expect(lightDom.contentTags()).toEqual([tag]);
}); });
@ -132,7 +132,7 @@ export function main() {
var shadowDomView = new FakeView([new FakeElementInjector(null, vp)]); var shadowDomView = new FakeView([new FakeElementInjector(null, vp)]);
var lightDom = new LightDom(lightDomView, shadowDomView, createElement("<div></div>")); var lightDom = new LightDom(lightDomView, shadowDomView, el("<div></div>"));
expect(lightDom.contentTags()).toEqual([tag]); expect(lightDom.contentTags()).toEqual([tag]);
}); });
@ -140,18 +140,18 @@ export function main() {
describe("expanded roots", () => { describe("expanded roots", () => {
it("should contain root nodes", () => { it("should contain root nodes", () => {
var lightDomEl = createElement("<div><a></a></div>") var lightDomEl = el("<div><a></a></div>")
var lightDom = new LightDom(lightDomView, new FakeView(), lightDomEl); var lightDom = new LightDom(lightDomView, new FakeView(), lightDomEl);
expect(toHtml(lightDom.expandedDomNodes())).toEqual(["<a></a>"]); expect(toHtml(lightDom.expandedDomNodes())).toEqual(["<a></a>"]);
}); });
it("should include view port nodes", () => { it("should include view port nodes", () => {
var lightDomEl = createElement("<div><template></template></div>") var lightDomEl = el("<div><template></template></div>")
var template = lightDomEl.childNodes[0]; var template = lightDomEl.childNodes[0];
var lightDomView = new FakeView([], var lightDomView = new FakeView([],
MapWrapper.createFromPairs([ MapWrapper.createFromPairs([
[template, new FakeViewPort([createElement("<a></a>")], null)] [template, new FakeViewPort([el("<a></a>")], null)]
]) ])
); );
@ -166,7 +166,7 @@ export function main() {
var contentA = new FakeContentTag("a"); var contentA = new FakeContentTag("a");
var contentB = new FakeContentTag("b"); var contentB = new FakeContentTag("b");
var lightDomEl = createElement("<div><a>1</a><b>2</b><a>3</a></div>") var lightDomEl = el("<div><a>1</a><b>2</b><a>3</a></div>")
var lightDom = new LightDom(lightDomView, new FakeView([ var lightDom = new LightDom(lightDomView, new FakeView([
new FakeElementInjector(contentA, null), new FakeElementInjector(contentA, null),
@ -183,7 +183,7 @@ export function main() {
var wildcard = new FakeContentTag(null); var wildcard = new FakeContentTag(null);
var contentB = new FakeContentTag("b"); var contentB = new FakeContentTag("b");
var lightDomEl = createElement("<div><a>1</a><b>2</b><a>3</a></div>") var lightDomEl = el("<div><a>1</a><b>2</b><a>3</a></div>")
var lightDom = new LightDom(lightDomView, new FakeView([ var lightDom = new LightDom(lightDomView, new FakeView([
new FakeElementInjector(wildcard, null), new FakeElementInjector(wildcard, null),
@ -202,8 +202,4 @@ export function main() {
function toHtml(nodes) { function toHtml(nodes) {
if (isBlank(nodes)) return []; if (isBlank(nodes)) return [];
return ListWrapper.map(nodes, DOM.getOuterHTML); return ListWrapper.map(nodes, DOM.getOuterHTML);
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}

72
modules/core/test/compiler/view_spec.js
View File

@ -1,4 +1,4 @@
import {describe, xit, it, expect, beforeEach, ddescribe, iit} from 'test_lib/test_lib'; import {describe, xit, it, expect, beforeEach, ddescribe, iit, el} from 'test_lib/test_lib';
import {ProtoView, ElementPropertyMemento, DirectivePropertyMemento} from 'core/compiler/view'; import {ProtoView, ElementPropertyMemento, DirectivePropertyMemento} from 'core/compiler/view';
import {ProtoElementInjector, ElementInjector} from 'core/compiler/element_injector'; import {ProtoElementInjector, ElementInjector} from 'core/compiler/element_injector';
import {ShadowDomEmulated} from 'core/compiler/shadow_dom'; import {ShadowDomEmulated} from 'core/compiler/shadow_dom';
@ -51,7 +51,7 @@ export function main() {
describe('instatiated from protoView', () => { describe('instatiated from protoView', () => {
var view; var view;
beforeEach(() => { beforeEach(() => {
var pv = new ProtoView(createElement('<div id="1"></div>'), new ProtoRecordRange()); var pv = new ProtoView(el('<div id="1"></div>'), new ProtoRecordRange());
view = pv.instantiate(null); view = pv.instantiate(null);
}); });
@ -73,7 +73,7 @@ export function main() {
var view, viewPort, templateElement; var view, viewPort, templateElement;
beforeEach(() => { beforeEach(() => {
templateElement = createElement("<template></template>"); templateElement = el("<template></template>");
view = new View(null, null, new ProtoRecordRange(), MapWrapper.create()); view = new View(null, null, new ProtoRecordRange(), MapWrapper.create());
viewPort = new FakeViewPort(templateElement); viewPort = new FakeViewPort(templateElement);
view.viewPorts = [viewPort]; view.viewPorts = [viewPort];
@ -91,7 +91,7 @@ export function main() {
describe('with locals', function() { describe('with locals', function() {
var view; var view;
beforeEach(() => { beforeEach(() => {
var pv = new ProtoView(createElement('<div id="1"></div>'), new ProtoRecordRange()); var pv = new ProtoView(el('<div id="1"></div>'), new ProtoRecordRange());
pv.bindVariable('context-foo', 'template-foo'); pv.bindVariable('context-foo', 'template-foo');
view = createView(pv); view = createView(pv);
}); });
@ -123,7 +123,7 @@ export function main() {
function createCollectDomNodesTestCases(useTemplateElement:boolean) { function createCollectDomNodesTestCases(useTemplateElement:boolean) {
function templateAwareCreateElement(html) { function templateAwareCreateElement(html) {
return createElement(useTemplateElement ? `<template>${html}</template>` : html); return el(useTemplateElement ? `<template>${html}</template>` : html);
} }
it('should collect the root node in the ProtoView element', () => { it('should collect the root node in the ProtoView element', () => {
@ -193,7 +193,7 @@ export function main() {
describe('inplace instantiation', () => { describe('inplace instantiation', () => {
it('should be supported.', () => { it('should be supported.', () => {
var template = createElement('<div></div>'); var template = el('<div></div>');
var pv = new ProtoView(template, new ProtoRecordRange()); var pv = new ProtoView(template, new ProtoRecordRange());
pv.instantiateInPlace = true; pv.instantiateInPlace = true;
var view = pv.instantiate(null); var view = pv.instantiate(null);
@ -202,7 +202,7 @@ export function main() {
}); });
it('should be off by default.', () => { it('should be off by default.', () => {
var template = createElement('<div></div>') var template = el('<div></div>')
var view = new ProtoView(template, new ProtoRecordRange()) var view = new ProtoView(template, new ProtoRecordRange())
.instantiate(null); .instantiate(null);
view.hydrate(null, null, null); view.hydrate(null, null, null);
@ -220,7 +220,7 @@ export function main() {
describe('create ElementInjectors', () => { describe('create ElementInjectors', () => {
it('should use the directives of the ProtoElementInjector', () => { it('should use the directives of the ProtoElementInjector', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"></div>'), new ProtoRecordRange()); var pv = new ProtoView(el('<div class="ng-binding"></div>'), new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 1, [SomeDirective])); pv.bindElement(new ProtoElementInjector(null, 1, [SomeDirective]));
var view = pv.instantiate(null); var view = pv.instantiate(null);
@ -230,7 +230,7 @@ export function main() {
}); });
it('should use the correct parent', () => { it('should use the correct parent', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"><span class="ng-binding"></span></div>'), var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]); var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]);
pv.bindElement(protoParent); pv.bindElement(protoParent);
@ -244,7 +244,7 @@ export function main() {
}); });
it('should not pass the host injector when a parent injector exists', () => { it('should not pass the host injector when a parent injector exists', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"><span class="ng-binding"></span></div>'), var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]); var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]);
pv.bindElement(protoParent); pv.bindElement(protoParent);
@ -260,7 +260,7 @@ export function main() {
}); });
it('should pass the host injector when there is no parent injector', () => { it('should pass the host injector when there is no parent injector', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"><span class="ng-binding"></span></div>'), var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 0, [SomeDirective])); pv.bindElement(new ProtoElementInjector(null, 0, [SomeDirective]));
var testProtoElementInjector = new TestProtoElementInjector(null, 1, [AnotherDirective]); var testProtoElementInjector = new TestProtoElementInjector(null, 1, [AnotherDirective]);
@ -277,7 +277,7 @@ export function main() {
describe('collect root element injectors', () => { describe('collect root element injectors', () => {
it('should collect a single root element injector', () => { it('should collect a single root element injector', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"><span class="ng-binding"></span></div>'), var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]); var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]);
pv.bindElement(protoParent); pv.bindElement(protoParent);
@ -290,7 +290,7 @@ export function main() {
}); });
it('should collect multiple root element injectors', () => { it('should collect multiple root element injectors', () => {
var pv = new ProtoView(createElement('<div><span class="ng-binding"></span><span class="ng-binding"></span></div>'), var pv = new ProtoView(el('<div><span class="ng-binding"></span><span class="ng-binding"></span></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 1, [SomeDirective])); pv.bindElement(new ProtoElementInjector(null, 1, [SomeDirective]));
pv.bindElement(new ProtoElementInjector(null, 2, [AnotherDirective])); pv.bindElement(new ProtoElementInjector(null, 2, [AnotherDirective]));
@ -308,7 +308,7 @@ export function main() {
var ctx; var ctx;
function createComponentWithSubPV(subProtoView) { function createComponentWithSubPV(subProtoView) {
var pv = new ProtoView(createElement('<cmp class="ng-binding"></cmp>'), new ProtoRecordRange()); var pv = new ProtoView(el('<cmp class="ng-binding"></cmp>'), new ProtoRecordRange());
var binder = pv.bindElement(new ProtoElementInjector(null, 0, [SomeComponent], true)); var binder = pv.bindElement(new ProtoElementInjector(null, 0, [SomeComponent], true));
binder.componentDirective = someComponentDirective; binder.componentDirective = someComponentDirective;
binder.nestedProtoView = subProtoView; binder.nestedProtoView = subProtoView;
@ -323,7 +323,7 @@ export function main() {
} }
it('should expose component services to the component', () => { it('should expose component services to the component', () => {
var subpv = new ProtoView(createElement('<span></span>'), new ProtoRecordRange()); var subpv = new ProtoView(el('<span></span>'), new ProtoRecordRange());
var pv = createComponentWithSubPV(subpv); var pv = createComponentWithSubPV(subpv);
var view = createNestedView(pv); var view = createNestedView(pv);
@ -335,7 +335,7 @@ export function main() {
it('should expose component services and component instance to directives in the shadow Dom', it('should expose component services and component instance to directives in the shadow Dom',
() => { () => {
var subpv = new ProtoView( var subpv = new ProtoView(
createElement('<div dec class="ng-binding">hello shadow dom</div>'), new ProtoRecordRange()); el('<div dec class="ng-binding">hello shadow dom</div>'), new ProtoRecordRange());
subpv.bindElement( subpv.bindElement(
new ProtoElementInjector(null, 0, [ServiceDependentDecorator])); new ProtoElementInjector(null, 0, [ServiceDependentDecorator]));
var pv = createComponentWithSubPV(subpv); var pv = createComponentWithSubPV(subpv);
@ -358,7 +358,7 @@ export function main() {
it('dehydration should dehydrate child component views too', () => { it('dehydration should dehydrate child component views too', () => {
var subpv = new ProtoView( var subpv = new ProtoView(
createElement('<div dec class="ng-binding">hello shadow dom</div>'), new ProtoRecordRange()); el('<div dec class="ng-binding">hello shadow dom</div>'), new ProtoRecordRange());
subpv.bindElement( subpv.bindElement(
new ProtoElementInjector(null, 0, [ServiceDependentDecorator])); new ProtoElementInjector(null, 0, [ServiceDependentDecorator]));
var pv = createComponentWithSubPV(subpv); var pv = createComponentWithSubPV(subpv);
@ -373,7 +373,7 @@ export function main() {
}); });
it('should create shadow dom', () => { it('should create shadow dom', () => {
var subpv = new ProtoView(createElement('<span>hello shadow dom</span>'), new ProtoRecordRange()); var subpv = new ProtoView(el('<span>hello shadow dom</span>'), new ProtoRecordRange());
var pv = createComponentWithSubPV(subpv); var pv = createComponentWithSubPV(subpv);
var view = createNestedView(pv); var view = createNestedView(pv);
@ -382,9 +382,9 @@ export function main() {
}); });
it('should use the provided shadow DOM strategy', () => { it('should use the provided shadow DOM strategy', () => {
var subpv = new ProtoView(createElement('<span>hello shadow dom</span>'), new ProtoRecordRange()); var subpv = new ProtoView(el('<span>hello shadow dom</span>'), new ProtoRecordRange());
var pv = new ProtoView(createElement('<cmp class="ng-binding"></cmp>'), new ProtoRecordRange()); var pv = new ProtoView(el('<cmp class="ng-binding"></cmp>'), new ProtoRecordRange());
var binder = pv.bindElement(new ProtoElementInjector(null, 0, [SomeComponentWithEmulatedShadowDom], true)); var binder = pv.bindElement(new ProtoElementInjector(null, 0, [SomeComponentWithEmulatedShadowDom], true));
binder.componentDirective = new DirectiveMetadataReader().read(SomeComponentWithEmulatedShadowDom); binder.componentDirective = new DirectiveMetadataReader().read(SomeComponentWithEmulatedShadowDom);
binder.nestedProtoView = subpv; binder.nestedProtoView = subpv;
@ -398,8 +398,8 @@ export function main() {
describe('with template views', () => { describe('with template views', () => {
function createViewWithTemplate() { function createViewWithTemplate() {
var templateProtoView = new ProtoView( var templateProtoView = new ProtoView(
createElement('<div id="1"></div>'), new ProtoRecordRange()); el('<div id="1"></div>'), new ProtoRecordRange());
var pv = new ProtoView(createElement('<someTmpl class="ng-binding"></someTmpl>'), new ProtoRecordRange()); var pv = new ProtoView(el('<someTmpl class="ng-binding"></someTmpl>'), new ProtoRecordRange());
var binder = pv.bindElement(new ProtoElementInjector(null, 0, [SomeTemplate])); var binder = pv.bindElement(new ProtoElementInjector(null, 0, [SomeTemplate]));
binder.templateDirective = someTemplateDirective; binder.templateDirective = someTemplateDirective;
binder.nestedProtoView = templateProtoView; binder.nestedProtoView = templateProtoView;
@ -437,7 +437,7 @@ export function main() {
} }
it('should fire on non-bubbling native events', () => { it('should fire on non-bubbling native events', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"><div></div></div>'), var pv = new ProtoView(el('<div class="ng-binding"><div></div></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(null); pv.bindElement(null);
pv.bindEvent('click', parser.parseBinding('callMe()', null)); pv.bindEvent('click', parser.parseBinding('callMe()', null));
@ -463,7 +463,7 @@ export function main() {
} }
it('should consume text node changes', () => { it('should consume text node changes', () => {
var pv = new ProtoView(createElement('<div class="ng-binding">{{}}</div>'), var pv = new ProtoView(el('<div class="ng-binding">{{}}</div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(null); pv.bindElement(null);
pv.bindTextNode(0, parser.parseBinding('foo', null)); pv.bindTextNode(0, parser.parseBinding('foo', null));
@ -475,7 +475,7 @@ export function main() {
}); });
it('should consume element binding changes', () => { it('should consume element binding changes', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"></div>'), var pv = new ProtoView(el('<div class="ng-binding"></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(null); pv.bindElement(null);
pv.bindElementProperty(parser.parseBinding('foo', null), 'id', reflector.setter('id')); pv.bindElementProperty(parser.parseBinding('foo', null), 'id', reflector.setter('id'));
@ -487,7 +487,7 @@ export function main() {
}); });
it('should consume directive watch expression change', () => { it('should consume directive watch expression change', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"></div>'), var pv = new ProtoView(el('<div class="ng-binding"></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 0, [SomeDirective])); pv.bindElement(new ProtoElementInjector(null, 0, [SomeDirective]));
pv.bindDirectiveProperty(0, parser.parseBinding('foo', null), 'prop', reflector.setter('prop'), false); pv.bindDirectiveProperty(0, parser.parseBinding('foo', null), 'prop', reflector.setter('prop'), false);
@ -499,7 +499,7 @@ export function main() {
}); });
it('should notify a directive about changes after all its properties have been set', () => { it('should notify a directive about changes after all its properties have been set', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"></div>'), var pv = new ProtoView(el('<div class="ng-binding"></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 0, [DirectiveImplementingOnChange])); pv.bindElement(new ProtoElementInjector(null, 0, [DirectiveImplementingOnChange]));
@ -516,7 +516,7 @@ export function main() {
}); });
it('should provide a map of updated properties', () => { it('should provide a map of updated properties', () => {
var pv = new ProtoView(createElement('<div class="ng-binding"></div>'), var pv = new ProtoView(el('<div class="ng-binding"></div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 0, [DirectiveImplementingOnChange])); pv.bindElement(new ProtoElementInjector(null, 0, [DirectiveImplementingOnChange]));
@ -539,24 +539,24 @@ export function main() {
}); });
describe('protoView createRootProtoView', () => { describe('protoView createRootProtoView', () => {
var el, pv; var element, pv;
beforeEach(() => { beforeEach(() => {
el = DOM.createElement('div'); element = DOM.createElement('div');
pv = new ProtoView(createElement('<div>hi</div>'), new ProtoRecordRange()); pv = new ProtoView(el('<div>hi</div>'), new ProtoRecordRange());
}); });
it('should create the root component when instantiated', () => { it('should create the root component when instantiated', () => {
var rootProtoView = ProtoView.createRootProtoView(pv, el, someComponentDirective); var rootProtoView = ProtoView.createRootProtoView(pv, element, someComponentDirective);
var view = rootProtoView.instantiate(null); var view = rootProtoView.instantiate(null);
view.hydrate(new Injector([]), null, null); view.hydrate(new Injector([]), null, null);
expect(view.rootElementInjectors[0].get(SomeComponent)).not.toBe(null); expect(view.rootElementInjectors[0].get(SomeComponent)).not.toBe(null);
}); });
it('should inject the protoView into the shadowDom', () => { it('should inject the protoView into the shadowDom', () => {
var rootProtoView = ProtoView.createRootProtoView(pv, el, someComponentDirective); var rootProtoView = ProtoView.createRootProtoView(pv, element, someComponentDirective);
var view = rootProtoView.instantiate(null); var view = rootProtoView.instantiate(null);
view.hydrate(new Injector([]), null, null); view.hydrate(new Injector([]), null, null);
expect(el.shadowRoot.childNodes[0].childNodes[0].nodeValue).toEqual('hi'); expect(element.shadowRoot.childNodes[0].childNodes[0].nodeValue).toEqual('hi');
}); });
}); });
}); });
@ -639,10 +639,6 @@ class MyEvaluationContext {
}; };
} }
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}
class TestProtoElementInjector extends ProtoElementInjector { class TestProtoElementInjector extends ProtoElementInjector {
parentElementInjector: ElementInjector; parentElementInjector: ElementInjector;
hostElementInjector: ElementInjector; hostElementInjector: ElementInjector;

18
modules/core/test/compiler/viewport_spec.js
View File

@ -1,4 +1,4 @@
import {describe, xit, it, expect, beforeEach, ddescribe, iit} from 'test_lib/test_lib'; import {describe, xit, it, expect, beforeEach, ddescribe, iit, el} from 'test_lib/test_lib';
import {View, ProtoView} from 'core/compiler/view'; import {View, ProtoView} from 'core/compiler/view';
import {ViewPort} from 'core/compiler/viewport'; import {ViewPort} from 'core/compiler/viewport';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
@ -7,10 +7,6 @@ import {Injector} from 'di/di';
import {ProtoElementInjector, ElementInjector} from 'core/compiler/element_injector'; import {ProtoElementInjector, ElementInjector} from 'core/compiler/element_injector';
import {ProtoRecordRange, Lexer, Parser} from 'change_detection/change_detection'; import {ProtoRecordRange, Lexer, Parser} from 'change_detection/change_detection';
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}
function createView(nodes) { function createView(nodes) {
var view = new View(null, nodes, new ProtoRecordRange(), MapWrapper.create()); var view = new View(null, nodes, new ProtoRecordRange(), MapWrapper.create());
view.init([], [], [], [], [], [], []); view.init([], [], [], [], [], [], []);
@ -23,14 +19,14 @@ export function main() {
customViewWithTwoNodes, elementInjector; customViewWithTwoNodes, elementInjector;
beforeEach(() => { beforeEach(() => {
dom = createElement(`<div><stuff></stuff><div insert-after-me></div><stuff></stuff></div>`); dom = el(`<div><stuff></stuff><div insert-after-me></div><stuff></stuff></div>`);
var insertionElement = dom.childNodes[1]; var insertionElement = dom.childNodes[1];
parentView = createView([dom.childNodes[0]]); parentView = createView([dom.childNodes[0]]);
protoView = new ProtoView(createElement('<div>hi</div>'), new ProtoRecordRange()); protoView = new ProtoView(el('<div>hi</div>'), new ProtoRecordRange());
elementInjector = new ElementInjector(null, null, null); elementInjector = new ElementInjector(null, null, null);
viewPort = new ViewPort(parentView, insertionElement, protoView, elementInjector); viewPort = new ViewPort(parentView, insertionElement, protoView, elementInjector);
customViewWithOneNode = createView([createElement('<div>single</div>')]); customViewWithOneNode = createView([el('<div>single</div>')]);
customViewWithTwoNodes = createView([createElement('<div>one</div>'), createElement('<div>two</div>')]); customViewWithTwoNodes = createView([el('<div>one</div>'), el('<div>two</div>')]);
}); });
describe('when dehydrated', () => { describe('when dehydrated', () => {
@ -52,7 +48,7 @@ export function main() {
beforeEach(() => { beforeEach(() => {
viewPort.hydrate(new Injector([]), null); viewPort.hydrate(new Injector([]), null);
var fillerView = createView([createElement('<filler>filler</filler>')]); var fillerView = createView([el('<filler>filler</filler>')]);
viewPort.insert(fillerView); viewPort.insert(fillerView);
}); });
@ -120,7 +116,7 @@ export function main() {
var parser = new Parser(new Lexer()); var parser = new Parser(new Lexer());
viewPort.hydrate(new Injector([]), null); viewPort.hydrate(new Injector([]), null);
var pv = new ProtoView(createElement('<div class="ng-binding">{{}}</div>'), var pv = new ProtoView(el('<div class="ng-binding">{{}}</div>'),
new ProtoRecordRange()); new ProtoRecordRange());
pv.bindElement(new ProtoElementInjector(null, 1, [SomeDirective])); pv.bindElement(new ProtoElementInjector(null, 1, [SomeDirective]));
pv.bindTextNode(0, parser.parseBinding('foo', null)); pv.bindTextNode(0, parser.parseBinding('foo', null));

8
modules/directives/test/ng_non_bindable_spec.js
View File

@ -1,4 +1,4 @@
import {describe, xit, it, expect, beforeEach, ddescribe, iit} from 'test_lib/test_lib'; import {describe, xit, it, expect, beforeEach, ddescribe, iit, el} from 'test_lib/test_lib';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
import {Injector} from 'di/di'; import {Injector} from 'di/di';
import {Lexer, Parser, ChangeDetector} from 'change_detection/change_detection'; import {Lexer, Parser, ChangeDetector} from 'change_detection/change_detection';
@ -16,10 +16,6 @@ export function main() {
compiler = new Compiler(null, new DirectiveMetadataReader(), new Parser(new Lexer()), new CompilerCache()); compiler = new Compiler(null, new DirectiveMetadataReader(), new Parser(new Lexer()), new CompilerCache());
}); });
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}
function createView(pv) { function createView(pv) {
component = new TestComponent(); component = new TestComponent();
view = pv.instantiate(null); view = pv.instantiate(null);
@ -28,7 +24,7 @@ export function main() {
} }
function compileWithTemplate(template) { function compileWithTemplate(template) {
return compiler.compile(TestComponent, createElement(template)); return compiler.compile(TestComponent, el(template));
} }
it('should not interpolate children', (done) => { it('should not interpolate children', (done) => {

8
modules/directives/test/ng_repeat_spec.js
View File

@ -1,4 +1,4 @@
import {describe, xit, it, expect, beforeEach, ddescribe, iit} from 'test_lib/test_lib'; import {describe, xit, it, expect, beforeEach, ddescribe, iit, el} from 'test_lib/test_lib';
import {DOM} from 'facade/dom'; import {DOM} from 'facade/dom';
@ -23,10 +23,6 @@ export function main() {
compiler = new Compiler(null, new DirectiveMetadataReader(), new Parser(new Lexer()), new CompilerCache()); compiler = new Compiler(null, new DirectiveMetadataReader(), new Parser(new Lexer()), new CompilerCache());
}); });
function createElement(html) {
return DOM.createTemplate(html).content.firstChild;
}
function createView(pv) { function createView(pv) {
component = new TestComponent(); component = new TestComponent();
view = pv.instantiate(null); view = pv.instantiate(null);
@ -35,7 +31,7 @@ export function main() {
} }
function compileWithTemplate(template) { function compileWithTemplate(template) {
return compiler.compile(TestComponent, createElement(template)); return compiler.compile(TestComponent, el(template));
} }
var TEMPLATE = '<div><copy-me template="ng-repeat #item in items">{{item.toString()}};</copy-me></div>'; var TEMPLATE = '<div><copy-me template="ng-repeat #item in items">{{item.toString()}};</copy-me></div>';

5
modules/test_lib/src/test_lib.dart
View File

@ -6,6 +6,7 @@ import 'package:unittest/unittest.dart' hide expect;
import 'dart:mirrors'; import 'dart:mirrors';
import 'dart:async'; import 'dart:async';
import 'package:reflection/reflection.dart'; import 'package:reflection/reflection.dart';
import 'package:facade/dom.dart';
import 'package:reflection/reflection_capabilities.dart'; import 'package:reflection/reflection_capabilities.dart';
bool IS_DARTIUM = true; bool IS_DARTIUM = true;
@ -67,4 +68,8 @@ _handleAsync(fn) {
} }
return fn; return fn;
}
el(String html) {
return DOM.createTemplate(html).content.firstChild;
} }

7
modules/test_lib/src/test_lib.es6
View File

@ -1,3 +1,5 @@
import {DOM} from 'facade/dom';
export var describe = window.describe; export var describe = window.describe;
export var xdescribe = window.xdescribe; export var xdescribe = window.xdescribe;
export var ddescribe = window.ddescribe; export var ddescribe = window.ddescribe;
@ -127,4 +129,9 @@ function mapToString(m) {
res.push(`${k}:${v}`); res.push(`${k}:${v}`);
}); });
return `{ ${res.join(',')} }`; return `{ ${res.join(',')} }`;
}
export function el(html) {
return DOM.createTemplate(html).content.firstChild;
} }