import { AsyncTestCompleter, beforeEach, ddescribe, xdescribe, describe, dispatchEvent, expect, iit, inject, beforeEachProviders, it, xit, TestComponentBuilder } from 'angular2/testing_internal'; import {Injectable, provide} from 'angular2/core'; import {NgIf} from 'angular2/common'; import {Directive, Component, View, ViewMetadata} from 'angular2/src/core/metadata'; @Component({selector: 'child-comp'}) @View({template: `Original {{childBinding}}`, directives: []}) @Injectable() class ChildComp { childBinding: string; constructor() { this.childBinding = 'Child'; } } @Component({selector: 'child-comp'}) @View({template: `Mock`}) @Injectable() class MockChildComp { } @Component({selector: 'parent-comp'}) @View({template: `Parent()`, directives: [ChildComp]}) @Injectable() class ParentComp { } @Component({selector: 'my-if-comp'}) @View({template: `MyIf(More)`, directives: [NgIf]}) @Injectable() class MyIfComp { showMore: boolean = false; } @Component({selector: 'child-child-comp'}) @View({template: `ChildChild`}) @Injectable() class ChildChildComp { } @Component({selector: 'child-comp'}) @View({ template: `Original {{childBinding}}()`, directives: [ChildChildComp] }) @Injectable() class ChildWithChildComp { childBinding: string; constructor() { this.childBinding = 'Child'; } } @Component({selector: 'child-child-comp'}) @View({template: `ChildChild Mock`}) @Injectable() class MockChildChildComp { } class FancyService { value: string = 'real value'; } class MockFancyService extends FancyService { value: string = 'mocked out value'; } @Component({selector: 'my-service-comp', bindings: [FancyService]}) @View({template: `injected value: {{fancyService.value}}`}) class TestBindingsComp { constructor(private fancyService: FancyService) {} } @Component({selector: 'my-service-comp', viewProviders: [FancyService]}) @View({template: `injected value: {{fancyService.value}}`}) class TestViewBindingsComp { constructor(private fancyService: FancyService) {} } export function main() { describe('test component builder', function() { it('should instantiate a component with valid DOM', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.createAsync(ChildComp).then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement).toHaveText('Original Child'); async.done(); }); })); it('should allow changing members of the component', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.createAsync(MyIfComp).then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement).toHaveText('MyIf()'); componentFixture.debugElement.componentInstance.showMore = true; componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement).toHaveText('MyIf(More)'); async.done(); }); })); it('should override a template', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideTemplate(MockChildComp, 'Mock') .createAsync(MockChildComp) .then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement).toHaveText('Mock'); async.done(); }); })); it('should override a view', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideView(ChildComp, new ViewMetadata({template: 'Modified {{childBinding}}'})) .createAsync(ChildComp) .then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement).toHaveText('Modified Child'); async.done(); }); })); it('should override component dependencies', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideDirective(ParentComp, ChildComp, MockChildComp) .createAsync(ParentComp) .then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement).toHaveText('Parent(Mock)'); async.done(); }); })); it("should override child component's dependencies", inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideDirective(ParentComp, ChildComp, ChildWithChildComp) .overrideDirective(ChildWithChildComp, ChildChildComp, MockChildChildComp) .createAsync(ParentComp) .then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement) .toHaveText('Parent(Original Child(ChildChild Mock))'); async.done(); }); })); it('should override a provider', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideProviders(TestBindingsComp, [provide(FancyService, {useClass: MockFancyService})]) .createAsync(TestBindingsComp) .then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement) .toHaveText('injected value: mocked out value'); async.done(); }); })); it('should override a viewBinding', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideViewProviders(TestViewBindingsComp, [provide(FancyService, {useClass: MockFancyService})]) .createAsync(TestViewBindingsComp) .then((componentFixture) => { componentFixture.detectChanges(); expect(componentFixture.debugElement.nativeElement) .toHaveText('injected value: mocked out value'); async.done(); }); })); }); }