import { ddescribe, describe, xdescribe, it, iit, xit, expect, beforeEach, afterEach, AsyncTestCompleter, inject, beforeEachBindings } from 'angular2/test_lib'; import {CONST_EXPR, stringify, isType, Type, isBlank} from 'angular2/src/core/facade/lang'; import {PromiseWrapper, Promise} from 'angular2/src/core/facade/async'; import {TemplateParser} from 'angular2/src/compiler/template_parser'; import { CommandVisitor, TextCmd, NgContentCmd, BeginElementCmd, BeginComponentCmd, EmbeddedTemplateCmd, TemplateCmd, visitAllCommands, CompiledTemplate } from 'angular2/src/core/compiler/template_commands'; import {CommandCompiler} from 'angular2/src/compiler/command_compiler'; import { CompileDirectiveMetadata, CompileTypeMetadata, CompileTemplateMetadata } from 'angular2/src/compiler/directive_metadata'; import {SourceModule, SourceExpression, moduleRef} from 'angular2/src/compiler/source_module'; import {ViewEncapsulation} from 'angular2/src/core/render/api'; import {evalModule} from './eval_module'; import { escapeSingleQuoteString, codeGenValueFn, codeGenExportVariable } from 'angular2/src/compiler/util'; import {TEST_BINDINGS} from './test_bindings'; const BEGIN_ELEMENT = 'BEGIN_ELEMENT'; const END_ELEMENT = 'END_ELEMENT'; const BEGIN_COMPONENT = 'BEGIN_COMPONENT'; const END_COMPONENT = 'END_COMPONENT'; const TEXT = 'TEXT'; const NG_CONTENT = 'NG_CONTENT'; const EMBEDDED_TEMPLATE = 'EMBEDDED_TEMPLATE'; // Attention: These module names have to correspond to real modules! const THIS_MODULE_NAME = 'angular2/test/compiler/command_compiler_spec'; var THIS_MODULE_REF = moduleRef(THIS_MODULE_NAME); var TEMPLATE_COMMANDS_MODULE_REF = moduleRef('angular2/src/core/compiler/template_commands'); // Attention: read by eval! export class RootComp {} export class SomeDir {} export class AComp {} var RootCompTypeMeta = new CompileTypeMetadata( {id: 1, name: 'RootComp', runtime: RootComp, moduleId: THIS_MODULE_NAME}); var SomeDirTypeMeta = new CompileTypeMetadata({id: 2, name: 'SomeDir', runtime: SomeDir, moduleId: THIS_MODULE_NAME}); var ACompTypeMeta = new CompileTypeMetadata({id: 3, name: 'AComp', runtime: AComp, moduleId: THIS_MODULE_NAME}); var NESTED_COMPONENT = new CompiledTemplate(45, () => []); export function main() { describe('CommandCompiler', () => { beforeEachBindings(() => TEST_BINDINGS); var parser: TemplateParser; var commandCompiler: CommandCompiler; var componentTemplateFactory: Function; beforeEach(inject([TemplateParser, CommandCompiler], (_templateParser, _commandCompiler) => { parser = _templateParser; commandCompiler = _commandCompiler; })); function createComp({type, selector, template, encapsulation, ngContentSelectors}: { type?: CompileTypeMetadata, selector?: string, template?: string, encapsulation?: ViewEncapsulation, ngContentSelectors?: string[] }): CompileDirectiveMetadata { if (isBlank(encapsulation)) { encapsulation = ViewEncapsulation.None; } if (isBlank(selector)) { selector = 'root'; } if (isBlank(ngContentSelectors)) { ngContentSelectors = []; } if (isBlank(template)) { template = ''; } return CompileDirectiveMetadata.create({ selector: selector, isComponent: true, type: type, template: new CompileTemplateMetadata({ template: template, ngContentSelectors: ngContentSelectors, encapsulation: encapsulation }) }); } function createDirective(type: CompileTypeMetadata, selector: string, exportAs: string = null): CompileDirectiveMetadata { return CompileDirectiveMetadata.create( {selector: selector, exportAs: exportAs, isComponent: false, type: type}); } function createTests(run: Function) { describe('text', () => { it('should create unbound text commands', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: 'a'}); run(rootComp, []) .then((data) => { expect(data).toEqual([[TEXT, 'a', false, null]]); async.done(); }); })); it('should create bound text commands', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: '{{a}}'}); run(rootComp, []) .then((data) => { expect(data).toEqual([[TEXT, null, true, null]]); async.done(); }); })); }); describe('elements', () => { it('should create unbound element commands', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: '
'}); run(rootComp, []) .then((data) => { expect(data).toEqual([ [BEGIN_ELEMENT, 'div', ['a', 'b'], [], [], [], false, null], [END_ELEMENT] ]); async.done(); }); })); it('should create bound element commands', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({ type: RootCompTypeMeta, template: '
' }); run(rootComp, []) .then((data) => { expect(data).toEqual([ [ BEGIN_ELEMENT, 'div', ['a', 'b'], [null, 'click', 'window', 'scroll'], ['someVar', null], [], true, null ], [END_ELEMENT] ]); async.done(); }); })); it('should create element commands with directives', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: '
'}); var dir = CompileDirectiveMetadata.create({ selector: '[a]', exportAs: 'someExport', isComponent: false, type: SomeDirTypeMeta, host: {'(click)': 'doIt()', '(window:scroll)': 'doIt()', 'role': 'button'} }); run(rootComp, [dir]) .then((data) => { expect(data).toEqual([ [ BEGIN_ELEMENT, 'div', ['a', '', 'role', 'button'], [null, 'click', 'window', 'scroll'], ['someVar', 0], ['SomeDirType'], true, null ], [END_ELEMENT] ]); async.done(); }); })); it('should emulate style encapsulation', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({ type: RootCompTypeMeta, template: '
', encapsulation: ViewEncapsulation.Emulated }); run(rootComp, []) .then((data) => { expect(data).toEqual([ [BEGIN_ELEMENT, 'div', ['_ngcontent-1', ''], [], [], [], false, null], [END_ELEMENT] ]); async.done(); }); })); it('should create nested nodes', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: '
a
'}); run(rootComp, []) .then((data) => { expect(data).toEqual([ [BEGIN_ELEMENT, 'div', [], [], [], [], false, null], [TEXT, 'a', false, null], [END_ELEMENT] ]); async.done(); }); })); }); describe('components', () => { it('should create component commands', inject([AsyncTestCompleter], (async) => { var rootComp = createComp( {type: RootCompTypeMeta, template: ''}); var comp = createComp({type: ACompTypeMeta, selector: 'a'}); run(rootComp, [comp]) .then((data) => { expect(data).toEqual([ [ BEGIN_COMPONENT, 'a', ['a', 'b'], [null, 'click'], ['someVar', 0], ['ACompType'], false, null, 3 ], [END_COMPONENT] ]); async.done(); }); })); it('should emulate style encapsulation on host elements', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({ type: RootCompTypeMeta, template: '', encapsulation: ViewEncapsulation.Emulated }); var comp = createComp( {type: ACompTypeMeta, selector: 'a', encapsulation: ViewEncapsulation.Emulated}); run(rootComp, [comp]) .then((data) => { expect(data).toEqual([ [ BEGIN_COMPONENT, 'a', ['_nghost-3', '', '_ngcontent-1', ''], [], [], ['ACompType'], false, null, 3 ], [END_COMPONENT] ]); async.done(); }); })); it('should set nativeShadow flag', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: ''}); var comp = createComp( {type: ACompTypeMeta, selector: 'a', encapsulation: ViewEncapsulation.Native}); run(rootComp, [comp]) .then((data) => { expect(data).toEqual([ [BEGIN_COMPONENT, 'a', [], [], [], ['ACompType'], true, null, 3], [END_COMPONENT] ]); async.done(); }); })); it('should create nested nodes and set ngContentIndex', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: 't'}); var comp = createComp({type: ACompTypeMeta, selector: 'a', ngContentSelectors: ['*']}); run(rootComp, [comp]) .then((data) => { expect(data).toEqual([ [BEGIN_COMPONENT, 'a', [], [], [], ['ACompType'], false, null, 3], [TEXT, 't', false, 0], [END_COMPONENT] ]); async.done(); }); })); }); describe('embedded templates', () => { it('should create embedded template commands', inject([AsyncTestCompleter], (async) => { var rootComp = createComp({type: RootCompTypeMeta, template: ''}); var dir = createDirective(SomeDirTypeMeta, '[a]'); run(rootComp, [dir], 1) .then((data) => { expect(data).toEqual([ [EMBEDDED_TEMPLATE, ['a', 'b'], [], ['SomeDirType'], false, null, 'cd1', []] ]); async.done(); }); })); it('should keep variable name and value for