Remove TCB (#10900)

* refactor(webworker): change tests not to use TestComponentBuilder

* refactor(core): change tests not to use TestComponentBuilder
This commit is contained in:
Victor Savkin 2016-08-17 15:05:22 -07:00 committed by Kara
parent 3009be8d6e
commit 4be863c223
2 changed files with 135 additions and 184 deletions

View File

@ -7,76 +7,66 @@
*/ */
import {Component, Directive, ElementRef, Input, QueryList, ViewChild, ViewChildren} from '@angular/core'; import {Component, Directive, ElementRef, Input, QueryList, ViewChild, ViewChildren} from '@angular/core';
import {ViewMetadata} from '@angular/core/src/metadata/view'; import {TestBed} from '@angular/core/testing';
import {AsyncTestCompleter, TestComponentBuilder, beforeEach, ddescribe, describe, expect, iit, inject, it, xit} from '@angular/core/testing/testing_internal';
export function main() { export function main() {
describe('ViewChild', () => { describe('ViewChild', () => {
it('should support type selector', beforeEach(() => {
inject( TestBed.configureTestingModule({
[TestComponentBuilder, AsyncTestCompleter], declarations: [ViewChildTypeSelectorComponent, ViewChildStringSelectorComponent, Simple]
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { });
tcb.overrideView( });
ViewChildTypeSelectorComponent, new ViewMetadata({
template: `<simple [marker]="'1'"></simple><simple [marker]="'2'"></simple>`, it('should support type selector', () => {
directives: [Simple] TestBed.overrideComponent(
})) ViewChildTypeSelectorComponent,
.createAsync(ViewChildTypeSelectorComponent) {set: {template: `<simple [marker]="'1'"></simple><simple [marker]="'2'"></simple>`}});
.then((view) => { const view = TestBed.createComponent(ViewChildTypeSelectorComponent);
view.detectChanges();
expect(view.componentInstance.child).toBeDefined(); view.detectChanges();
expect(view.componentInstance.child.marker).toBe('1'); expect(view.componentInstance.child).toBeDefined();
async.done(); expect(view.componentInstance.child.marker).toBe('1');
}); });
}));
it('should support string selector', it('should support string selector', () => {
inject( TestBed.overrideComponent(
[TestComponentBuilder, AsyncTestCompleter], ViewChildStringSelectorComponent, {set: {template: `<simple #child></simple>`}});
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { const view = TestBed.createComponent(ViewChildStringSelectorComponent);
tcb.overrideView(
ViewChildStringSelectorComponent, view.detectChanges();
new ViewMetadata({template: `<simple #child></simple>`, directives: [Simple]})) expect(view.componentInstance.child).toBeDefined();
.createAsync(ViewChildStringSelectorComponent) });
.then((view) => {
view.detectChanges();
expect(view.componentInstance.child).toBeDefined();
async.done();
});
}));
}); });
describe('ViewChildren', () => { describe('ViewChildren', () => {
it('should support type selector', beforeEach(() => {
inject( TestBed.configureTestingModule({
[TestComponentBuilder, AsyncTestCompleter], declarations:
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { [ViewChildrenTypeSelectorComponent, ViewChildrenStringSelectorComponent, Simple]
tcb.overrideView( });
ViewChildrenTypeSelectorComponent, });
new ViewMetadata(
{template: `<simple></simple><simple></simple>`, directives: [Simple]})) it('should support type selector', () => {
.createAsync(ViewChildrenTypeSelectorComponent) TestBed.overrideComponent(
.then((view) => { ViewChildrenTypeSelectorComponent,
view.detectChanges(); {set: {template: `<simple></simple><simple></simple>`}});
expect(view.componentInstance.children).toBeDefined();
expect(view.componentInstance.children.length).toBe(2); const view = TestBed.createComponent(ViewChildrenTypeSelectorComponent);
async.done(); view.detectChanges();
}); expect(view.componentInstance.children).toBeDefined();
})); expect(view.componentInstance.children.length).toBe(2);
it('should support string selector', });
inject(
[TestComponentBuilder, AsyncTestCompleter], it('should support string selector', () => {
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { TestBed.overrideComponent(
tcb.overrideView(ViewChildrenStringSelectorComponent, new ViewMetadata({ ViewChildrenStringSelectorComponent,
template: `<simple #child1></simple><simple #child2></simple>`, {set: {template: `<simple #child1></simple><simple #child2></simple>`}});
directives: [Simple] const view = TestBed.createComponent(ViewChildrenStringSelectorComponent);
})) view.detectChanges();
.createAsync(ViewChildrenStringSelectorComponent) expect(view.componentInstance.children).toBeDefined();
.then((view) => { expect(view.componentInstance.children.length).toBe(2);
view.detectChanges();
expect(view.componentInstance.children).toBeDefined(); });
expect(view.componentInstance.children.length).toBe(2);
async.done();
});
}));
}); });
} }
@ -86,22 +76,22 @@ class Simple {
@Input() marker: string; @Input() marker: string;
} }
@Component({selector: 'view-child-type-selector'}) @Component({selector: 'view-child-type-selector', template: ''})
class ViewChildTypeSelectorComponent { class ViewChildTypeSelectorComponent {
@ViewChild(Simple) child: Simple; @ViewChild(Simple) child: Simple;
} }
@Component({selector: 'view-child-string-selector'}) @Component({selector: 'view-child-string-selector', template: ''})
class ViewChildStringSelectorComponent { class ViewChildStringSelectorComponent {
@ViewChild('child') child: ElementRef; @ViewChild('child') child: ElementRef;
} }
@Component({selector: 'view-children-type-selector'}) @Component({selector: 'view-children-type-selector', template: ''})
class ViewChildrenTypeSelectorComponent { class ViewChildrenTypeSelectorComponent {
@ViewChildren(Simple) children: QueryList<Simple>; @ViewChildren(Simple) children: QueryList<Simple>;
} }
@Component({selector: 'view-child-string-selector'}) @Component({selector: 'view-child-string-selector', template: ''})
class ViewChildrenStringSelectorComponent { class ViewChildrenStringSelectorComponent {
// Allow comma separated selector (with spaces). // Allow comma separated selector (with spaces).
@ViewChildren('child1 , child2') children: QueryList<ElementRef>; @ViewChildren('child1 , child2') children: QueryList<ElementRef>;

View File

@ -12,7 +12,6 @@ import {DebugDomRootRenderer} from '@angular/core/src/debug/debug_renderer';
import {ViewMetadata} from '@angular/core/src/metadata/view'; import {ViewMetadata} from '@angular/core/src/metadata/view';
import {RootRenderer} from '@angular/core/src/render/api'; import {RootRenderer} from '@angular/core/src/render/api';
import {TestBed} from '@angular/core/testing'; import {TestBed} from '@angular/core/testing';
import {AsyncTestCompleter, TestComponentBuilder, beforeEach, beforeEachProviders, ddescribe, describe, iit, inject, it} from '@angular/core/testing/testing_internal';
import {platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing'; import {platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing';
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter'; import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
import {DomRootRenderer, DomRootRenderer_} from '@angular/platform-browser/src/dom/dom_renderer'; import {DomRootRenderer, DomRootRenderer_} from '@angular/platform-browser/src/dom/dom_renderer';
@ -81,6 +80,7 @@ export function main() {
workerRenderStore = new RenderStore(); workerRenderStore = new RenderStore();
TestBed.configureTestingModule({ TestBed.configureTestingModule({
declarations: [MyComp2],
providers: [ providers: [
Serializer, {provide: RenderStore, useValue: workerRenderStore}, { Serializer, {provide: RenderStore, useValue: workerRenderStore}, {
provide: RootRenderer, provide: RootRenderer,
@ -104,142 +104,103 @@ export function main() {
return (<any>componentRef.hostView).internalView.renderer; return (<any>componentRef.hostView).internalView.renderer;
} }
it('should update text nodes', it('should update text nodes', () => {
inject( TestBed.overrideComponent(MyComp2, {set: {template: '<div>{{ctxProp}}</div>'}});
[TestComponentBuilder, AsyncTestCompleter], const fixture = TestBed.createComponent(MyComp2);
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => {
tcb.overrideView(MyComp2, new ViewMetadata({template: '<div>{{ctxProp}}</div>'}))
.createAsync(MyComp2)
.then((fixture) => {
var renderEl = getRenderElement(fixture.debugElement.nativeElement);
expect(renderEl).toHaveText('');
fixture.debugElement.componentInstance.ctxProp = 'Hello World!'; var renderEl = getRenderElement(fixture.debugElement.nativeElement);
fixture.detectChanges(); expect(renderEl).toHaveText('');
expect(renderEl).toHaveText('Hello World!');
async.done();
}); fixture.debugElement.componentInstance.ctxProp = 'Hello World!';
})); fixture.detectChanges();
expect(renderEl).toHaveText('Hello World!');
});
it('should update any element property/attributes/class/style(s) independent of the compilation on the root element and other elements', it('should update any element property/attributes/class/style(s) independent of the compilation on the root element and other elements',
inject( () => {
[TestComponentBuilder, AsyncTestCompleter], TestBed.overrideComponent(
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { MyComp2, {set: {template: '<input [title]="y" style="position:absolute">'}});
tcb.overrideView( const fixture = TestBed.createComponent(MyComp2);
MyComp2,
new ViewMetadata({template: '<input [title]="y" style="position:absolute">'}))
.createAsync(MyComp2)
.then((fixture) => {
var checkSetters =
(componentRef: any /** TODO #9100 */, workerEl: any /** TODO #9100 */) => {
var renderer = getRenderer(componentRef);
var el = getRenderElement(workerEl);
renderer.setElementProperty(workerEl, 'tabIndex', 1);
expect((<HTMLInputElement>el).tabIndex).toEqual(1);
renderer.setElementClass(workerEl, 'a', true); var checkSetters =
expect(getDOM().hasClass(el, 'a')).toBe(true); (componentRef: any /** TODO #9100 */, workerEl: any /** TODO #9100 */) => {
renderer.setElementClass(workerEl, 'a', false); var renderer = getRenderer(componentRef);
expect(getDOM().hasClass(el, 'a')).toBe(false); var el = getRenderElement(workerEl);
renderer.setElementProperty(workerEl, 'tabIndex', 1);
expect((<HTMLInputElement>el).tabIndex).toEqual(1);
renderer.setElementStyle(workerEl, 'width', '10px'); renderer.setElementClass(workerEl, 'a', true);
expect(getDOM().getStyle(el, 'width')).toEqual('10px'); expect(getDOM().hasClass(el, 'a')).toBe(true);
renderer.setElementStyle(workerEl, 'width', null); renderer.setElementClass(workerEl, 'a', false);
expect(getDOM().getStyle(el, 'width')).toEqual(''); expect(getDOM().hasClass(el, 'a')).toBe(false);
renderer.setElementAttribute(workerEl, 'someattr', 'someValue'); renderer.setElementStyle(workerEl, 'width', '10px');
expect(getDOM().getAttribute(el, 'someattr')).toEqual('someValue'); expect(getDOM().getStyle(el, 'width')).toEqual('10px');
}; renderer.setElementStyle(workerEl, 'width', null);
expect(getDOM().getStyle(el, 'width')).toEqual('');
// root element renderer.setElementAttribute(workerEl, 'someattr', 'someValue');
checkSetters(fixture.componentRef, fixture.debugElement.nativeElement); expect(getDOM().getAttribute(el, 'someattr')).toEqual('someValue');
// nested elements };
checkSetters(
fixture.componentRef, fixture.debugElement.children[0].nativeElement);
async.done(); // root element
}); checkSetters(fixture.componentRef, fixture.debugElement.nativeElement);
})); // nested elements
checkSetters(fixture.componentRef, fixture.debugElement.children[0].nativeElement);
});
it('should update any template comment property/attributes', it('should update any template comment property/attributes', () => {
inject(
[TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => {
var tpl = '<template [ngIf]="ctxBoolProp"></template>';
tcb.overrideView(MyComp2, new ViewMetadata({template: tpl, directives: [NgIf]}))
.createAsync(MyComp2) TestBed.overrideComponent(
.then((fixture) => { MyComp2, {set: {template: '<template [ngIf]="ctxBoolProp"></template>'}});
(<MyComp2>fixture.debugElement.componentInstance).ctxBoolProp = true; const fixture = TestBed.createComponent(MyComp2);
fixture.detectChanges();
var el = getRenderElement(fixture.debugElement.nativeElement);
expect(getDOM().getInnerHTML(el)).toContain('"ng-reflect-ng-if": "true"');
async.done();
});
}));
it('should add and remove fragments', (<MyComp2>fixture.debugElement.componentInstance).ctxBoolProp = true;
inject( fixture.detectChanges();
[TestComponentBuilder, AsyncTestCompleter], var el = getRenderElement(fixture.debugElement.nativeElement);
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { expect(getDOM().getInnerHTML(el)).toContain('"ng-reflect-ng-if": "true"');
tcb.overrideView(MyComp2, new ViewMetadata({ });
template: '<template [ngIf]="ctxBoolProp">hello</template>',
directives: [NgIf]
}))
.createAsync(MyComp2)
.then((fixture) => {
var rootEl = getRenderElement(fixture.debugElement.nativeElement); it('should add and remove fragments', () => {
expect(rootEl).toHaveText(''); TestBed.overrideComponent(
MyComp2, {set: {template: '<template [ngIf]="ctxBoolProp">hello</template>'}});
const fixture = TestBed.createComponent(MyComp2);
fixture.debugElement.componentInstance.ctxBoolProp = true; var rootEl = getRenderElement(fixture.debugElement.nativeElement);
fixture.detectChanges(); expect(rootEl).toHaveText('');
expect(rootEl).toHaveText('hello');
fixture.debugElement.componentInstance.ctxBoolProp = false; fixture.debugElement.componentInstance.ctxBoolProp = true;
fixture.detectChanges(); fixture.detectChanges();
expect(rootEl).toHaveText(''); expect(rootEl).toHaveText('hello');
async.done(); fixture.debugElement.componentInstance.ctxBoolProp = false;
}); fixture.detectChanges();
})); expect(rootEl).toHaveText('');
});
if (getDOM().supportsDOMEvents()) { if (getDOM().supportsDOMEvents()) {
it('should call actions on the element', it('should call actions on the element', () => {
inject( TestBed.overrideComponent(MyComp2, {set: {template: '<input [title]="y">'}});
[TestComponentBuilder, AsyncTestCompleter], const fixture = TestBed.createComponent(MyComp2);
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => { var el = fixture.debugElement.children[0];
tcb.overrideView(MyComp2, new ViewMetadata({template: '<input [title]="y">'})) getRenderer(fixture.componentRef).invokeElementMethod(el.nativeElement, 'setAttribute', [
.createAsync(MyComp2) 'a', 'b'
.then((fixture) => { ]);
var el = fixture.debugElement.children[0];
getRenderer(fixture.componentRef)
.invokeElementMethod(el.nativeElement, 'setAttribute', ['a', 'b']);
expect(getDOM().getAttribute(getRenderElement(el.nativeElement), 'a')) expect(getDOM().getAttribute(getRenderElement(el.nativeElement), 'a')).toEqual('b');
.toEqual('b');
async.done();
});
}));
it('should listen to events', });
inject(
[TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async: AsyncTestCompleter) => {
tcb.overrideView(
MyComp2, new ViewMetadata({template: '<input (change)="ctxNumProp = 1">'}))
.createAsync(MyComp2)
.then((fixture) => {
var el = fixture.debugElement.children[0];
dispatchEvent(getRenderElement(el.nativeElement), 'change');
expect(fixture.componentInstance.ctxNumProp).toBe(1);
fixture.destroy(); it('should listen to events', () => {
TestBed.overrideComponent(MyComp2, {set: {template: '<input (change)="ctxNumProp = 1">'}});
const fixture = TestBed.createComponent(MyComp2);
async.done(); var el = fixture.debugElement.children[0];
}); dispatchEvent(getRenderElement(el.nativeElement), 'change');
})); expect(fixture.componentInstance.ctxNumProp).toBe(1);
fixture.destroy();
});
} }
}); });
} }