diff --git a/modules/@angular/core/test/debug/debug_node_spec.ts b/modules/@angular/core/test/debug/debug_node_spec.ts index 73da5efb04..8f9d6ca05d 100644 --- a/modules/@angular/core/test/debug/debug_node_spec.ts +++ b/modules/@angular/core/test/debug/debug_node_spec.ts @@ -9,7 +9,7 @@ import {NgFor, NgIf} from '@angular/common'; import {Injectable} from '@angular/core'; import {Component, Directive, Input} from '@angular/core/src/metadata'; -import {AsyncTestCompleter, TestComponentBuilder, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal'; +import {ComponentFixture, TestBed, async} from '@angular/core/testing'; import {By} from '@angular/platform-browser/src/dom/debug/by'; import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter'; import {expect} from '@angular/platform-browser/testing/matchers'; @@ -40,7 +40,6 @@ class MessageDir { Child `, - directives: [MessageDir], }) class ChildComp { childBinding: string; @@ -56,7 +55,6 @@ class ChildComp { `, - directives: [ChildComp, MessageDir], }) class ParentComp { parentBinding: string; @@ -74,7 +72,6 @@ class CustomEmitter { selector: 'events-comp', template: ` `, - directives: [CustomEmitter], }) class EventsComp { clicked: boolean; @@ -94,7 +91,6 @@ class EventsComp { selector: 'cond-content-comp', viewProviders: [Logger], template: `
`, - directives: [NgIf, MessageDir], }) class ConditionalContentComp { myBool: boolean = false; @@ -107,7 +103,6 @@ class ConditionalContentComp { `, - directives: [ConditionalContentComp], }) class ConditionalParentComp { parentBinding: string; @@ -121,7 +116,6 @@ class ConditionalParentComp { `, - directives: [NgFor, MessageDir], }) class UsingFor { stuff: string[]; @@ -137,12 +131,10 @@ class MyDir { template: `
`, - directives: [MyDir] }) class LocalsComp { } - @Component({ selector: 'bank-account', template: ` @@ -167,7 +159,6 @@ class BankAccount { [class.closed]="isClosed" [class.open]="!isClosed"> `, - directives: [BankAccount] }) class TestApp { width = 200; @@ -176,255 +167,195 @@ class TestApp { } export function main() { - describe('debug element', function() { - it('should list all child nodes', - inject( - [TestComponentBuilder, AsyncTestCompleter], - (tcb: TestComponentBuilder, async: AsyncTestCompleter) => { - tcb.createAsync(ParentComp).then((fixture) => { - fixture.detectChanges(); + describe('debug element', () => { + let fixture: ComponentFixture; - // The root component has 3 elements and 2 text node children. - expect(fixture.debugElement.childNodes.length).toEqual(5); - async.done(); - }); - })); + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ + ChildComp, + ConditionalContentComp, + ConditionalParentComp, + CustomEmitter, + EventsComp, + LocalsComp, + MessageDir, + MyDir, + ParentComp, + TestApp, + UsingFor, + ], + providers: [ + Logger, + ] + }); + TestBed.compileComponents(); + })); - it('should list all component child elements', - inject( - [TestComponentBuilder, AsyncTestCompleter], - (tcb: TestComponentBuilder, async: AsyncTestCompleter) => { + it('should list all child nodes', () => { + fixture = TestBed.createComponent(ParentComp); + fixture.detectChanges(); - tcb.createAsync(ParentComp).then((fixture) => { - fixture.detectChanges(); + // The root component has 3 elements and 2 text node children. + expect(fixture.debugElement.childNodes.length).toEqual(5); + }); - var childEls = fixture.debugElement.children; + it('should list all component child elements', () => { + fixture = TestBed.createComponent(ParentComp); + fixture.detectChanges(); + var childEls = fixture.debugElement.children; - // The root component has 3 elements in its view. - expect(childEls.length).toEqual(3); - expect(getDOM().hasClass(childEls[0].nativeElement, 'parent')).toBe(true); - expect(getDOM().hasClass(childEls[1].nativeElement, 'parent')).toBe(true); - expect(getDOM().hasClass(childEls[2].nativeElement, 'child-comp-class')).toBe(true); + // The root component has 3 elements in its view. + expect(childEls.length).toEqual(3); + expect(getDOM().hasClass(childEls[0].nativeElement, 'parent')).toBe(true); + expect(getDOM().hasClass(childEls[1].nativeElement, 'parent')).toBe(true); + expect(getDOM().hasClass(childEls[2].nativeElement, 'child-comp-class')).toBe(true); - var nested = childEls[0].children; - expect(nested.length).toEqual(1); - expect(getDOM().hasClass(nested[0].nativeElement, 'parentnested')).toBe(true); + var nested = childEls[0].children; + expect(nested.length).toEqual(1); + expect(getDOM().hasClass(nested[0].nativeElement, 'parentnested')).toBe(true); - var childComponent = childEls[2]; + var childComponent = childEls[2]; - var childCompChildren = childComponent.children; - expect(childCompChildren.length).toEqual(2); - expect(getDOM().hasClass(childCompChildren[0].nativeElement, 'child')).toBe(true); - expect(getDOM().hasClass(childCompChildren[1].nativeElement, 'child')).toBe(true); + var childCompChildren = childComponent.children; + expect(childCompChildren.length).toEqual(2); + expect(getDOM().hasClass(childCompChildren[0].nativeElement, 'child')).toBe(true); + expect(getDOM().hasClass(childCompChildren[1].nativeElement, 'child')).toBe(true); - var childNested = childCompChildren[0].children; - expect(childNested.length).toEqual(1); - expect(getDOM().hasClass(childNested[0].nativeElement, 'childnested')).toBe(true); + var childNested = childCompChildren[0].children; + expect(childNested.length).toEqual(1); + expect(getDOM().hasClass(childNested[0].nativeElement, 'childnested')).toBe(true); + }); - async.done(); - }); - })); + it('should list conditional component child elements', () => { + fixture = TestBed.createComponent(ConditionalParentComp); + fixture.detectChanges(); - it('should list conditional component child elements', - inject( - [TestComponentBuilder, AsyncTestCompleter], - (tcb: TestComponentBuilder, async: AsyncTestCompleter) => { - tcb.createAsync(ConditionalParentComp).then((fixture) => { - fixture.detectChanges(); + var childEls = fixture.debugElement.children; - var childEls = fixture.debugElement.children; + // The root component has 2 elements in its view. + expect(childEls.length).toEqual(2); + expect(getDOM().hasClass(childEls[0].nativeElement, 'parent')).toBe(true); + expect(getDOM().hasClass(childEls[1].nativeElement, 'cond-content-comp-class')).toBe(true); - // The root component has 2 elements in its view. - expect(childEls.length).toEqual(2); - expect(getDOM().hasClass(childEls[0].nativeElement, 'parent')).toBe(true); - expect(getDOM().hasClass(childEls[1].nativeElement, 'cond-content-comp-class')) - .toBe(true); + var conditionalContentComp = childEls[1]; - var conditionalContentComp = childEls[1]; + expect(conditionalContentComp.children.length).toEqual(0); - expect(conditionalContentComp.children.length).toEqual(0); + conditionalContentComp.componentInstance.myBool = true; + fixture.detectChanges(); - conditionalContentComp.componentInstance.myBool = true; - fixture.detectChanges(); + expect(conditionalContentComp.children.length).toEqual(1); + }); - expect(conditionalContentComp.children.length).toEqual(1); - async.done(); - }); - })); + it('should list child elements within viewports', () => { + fixture = TestBed.createComponent(UsingFor); + fixture.detectChanges(); - it('should list child elements within viewports', - inject( - [TestComponentBuilder, AsyncTestCompleter], - (tcb: TestComponentBuilder, async: AsyncTestCompleter) => { - tcb.createAsync(UsingFor).then((fixture) => { - fixture.detectChanges(); + var childEls = fixture.debugElement.children; + expect(childEls.length).toEqual(4); - var childEls = fixture.debugElement.children; - expect(childEls.length).toEqual(4); + // The 4th child is the