iSharkFly-Docs/angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore(test): migrate remaining core tests to testcomponentbuilder

Browse Source 
Also add a small utility function to debug element to get an
array of native elements, which works smoothly with the
toHaveText matcher.
This commit is contained in:
Julie Ralph 2015-06-23 17:02:00 -07:00
parent 1c8a58963c
commit d3dda614dd
5 changed files with 103 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
modules/angular2/src/debug/debug_element.ts
View File

@ -145,6 +145,10 @@ export function inspectElement(elementRef: ElementRef): DebugElement {
return DebugElement.create(elementRef);
}
export function asNativeElements(arr: List<DebugElement>): List<any> {
return arr.map((debugEl) => debugEl.nativeElement);
}
/**
* @exportedAs angular2/test
*/

51
modules/angular2/test/core/compiler/integration_dart_spec.dart
View File

@ -3,7 +3,6 @@ library angular2.test.di.integration_dart_spec;
import 'package:angular2/angular2.dart';
import 'package:angular2/di.dart';
import 'package:angular2/src/test_lib/test_bed.dart';
import 'package:angular2/test_lib.dart';
class MockException implements Error {
@ -40,16 +39,16 @@ void functionThatThrowsNonError() {
main() {
describe('TypeLiteral', () {
it('should publish via appInjector', inject([
TestBed,
TestComponentBuilder,
AsyncTestCompleter
], (tb, async) {
tb.overrideView(Dummy, new View(
template: '<type-literal-component></type-literal-component>',
directives: [TypeLiteralComponent]));
directives: [TypeLiteralComponent]))
tb.createView(Dummy).then((view) {
view.detectChanges();
expect(view.rootNodes).toHaveText('[Hello, World]');
.createAsync(Dummy).then((tc) {
tc.detectChanges();
expect(asNativeElements(tc.componentViewChildren)).toHaveText('[Hello, World]');
async.done();
});
}));
@ -57,28 +56,28 @@ main() {
describe('Error handling', () {
it('should preserve Error stack traces thrown from components', inject([
TestBed,
TestComponentBuilder,
AsyncTestCompleter
], (tb, async) {
tb.overrideView(Dummy, new View(
template: '<throwing-component></throwing-component>',
directives: [ThrowingComponent]));
directives: [ThrowingComponent]))
tb.createView(Dummy).catchError((e, stack) {
.createAsync(Dummy).catchError((e, stack) {
expect(stack.toString().split('\n')[0]).toEqual(e.message);
async.done();
});
}));
it('should preserve non-Error stack traces thrown from components', inject([
TestBed,
TestComponentBuilder,
AsyncTestCompleter
], (tb, async) {
tb.overrideView(Dummy, new View(
template: '<throwing-component2></throwing-component2>',
directives: [ThrowingComponent2]));
directives: [ThrowingComponent2]))
tb.createView(Dummy).catchError((e, stack) {
.createAsync(Dummy).catchError((e, stack) {
expect(stack.toString().split('\n')[0]).toEqual(e.message);
async.done();
});
@ -87,30 +86,30 @@ main() {
describe('Property access', () {
it('should distinguish between map and property access', inject([
TestBed,
TestComponentBuilder,
AsyncTestCompleter
], (tb, async) {
tb.overrideView(Dummy, new View(
template: '<property-access></property-access>',
directives: [PropertyAccess]));
directives: [PropertyAccess]))
tb.createView(Dummy).then((view) {
view.detectChanges();
expect(view.rootNodes).toHaveText('prop:foo-prop;map:foo-map');
.createAsync(Dummy).then((tc) {
tc.detectChanges();
expect(asNativeElements(tc.componentViewChildren)).toHaveText('prop:foo-prop;map:foo-map');
async.done();
});
}));
it('should not fallback on map access if property missing', inject([
TestBed,
TestComponentBuilder,
AsyncTestCompleter
], (tb, async) {
tb.overrideView(Dummy, new View(
template: '<no-property-access></no-property-access>',
directives: [NoPropertyAccess]));
directives: [NoPropertyAccess]))
tb.createView(Dummy).then((view) {
expect(() => view.detectChanges())
.createAsync(Dummy).then((tc) {
expect(() => tc.detectChanges())
.toThrowError(new RegExp('property not found'));
async.done();
});
@ -119,16 +118,16 @@ main() {
describe('OnChange', () {
it('should be notified of changes', inject([
TestBed,
TestComponentBuilder,
AsyncTestCompleter
], (tb, async) {
tb.overrideView(Dummy, new View(
template: '''<on-change [prop]="'hello'"></on-change>''',
directives: [OnChangeComponent]));
directives: [OnChangeComponent]))
tb.createView(Dummy).then((view) {
view.detectChanges();
var cmp = view.rawView.elementInjectors[0].get(OnChangeComponent);
.createAsync(Dummy).then((tc) {
tc.detectChanges();
var cmp = tc.componentViewChildren[0].inject(OnChangeComponent);
expect(cmp.prop).toEqual('hello');
expect(cmp.changes.containsKey('prop')).toEqual(true);
async.done();

101
modules/angular2/test/core/compiler/query_integration_spec.ts
View File

@ -9,9 +9,10 @@ import {
inject,
it,
xit,
TestComponentBuilder,
asNativeElements
} from 'angular2/test_lib';
import {TestBed} from 'angular2/src/test_lib/test_bed';
import {Injectable, Optional} from 'angular2/di';
import {QueryList} from 'angular2/core';
@ -28,92 +29,98 @@ export function main() {
describe("querying by directive type", () => {
it('should contain all direct child directives in the light dom',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div text="1"></div>' +
'<needs-query text="2"><div text="3">' +
'<div text="too-deep"></div>' +
'</div></needs-query>' +
'<div text="4"></div>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
expect(view.rootNodes).toHaveText('2|3|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|3|');
async.done();
});
}));
it('should contain all directives in the light dom when descendants flag is used',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div text="1"></div>' +
'<needs-query-desc text="2"><div text="3">' +
'<div text="4"></div>' +
'</div></needs-query-desc>' +
'<div text="5"></div>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
expect(view.rootNodes).toHaveText('2|3|4|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|3|4|');
async.done();
});
}));
it('should contain all directives in the light dom',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div text="1"></div>' +
'<needs-query text="2"><div text="3"></div></needs-query>' +
'<div text="4"></div>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
expect(view.rootNodes).toHaveText('2|3|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|3|');
async.done();
});
}));
it('should reflect dynamically inserted directives',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div text="1"></div>' +
'<needs-query text="2"><div *ng-if="shouldShow" [text]="\'3\'"></div></needs-query>' +
'<div text="4"></div>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
expect(view.rootNodes).toHaveText('2|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|');
view.context.shouldShow = true;
view.componentInstance.shouldShow = true;
view.detectChanges();
expect(view.rootNodes).toHaveText('2|3|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|3|');
async.done();
});
}));
it('should reflect moved directives',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div text="1"></div>' +
'<needs-query text="2"><div *ng-for="var i of list" [text]="i"></div></needs-query>' +
'<div text="4"></div>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
expect(view.rootNodes).toHaveText('2|1d|2d|3d|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|1d|2d|3d|');
view.context.list = ['3d', '2d'];
view.componentInstance.list = ['3d', '2d'];
view.detectChanges();
view.detectChanges();
expect(view.rootNodes).toHaveText('2|3d|2d|');
expect(asNativeElements(view.componentViewChildren)).toHaveText('2|3d|2d|');
async.done();
});
@ -122,15 +129,16 @@ export function main() {
describe("onChange", () => {
it('should notify query on change',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query #q>' +
'<div text="1"></div>' +
'<div *ng-if="shouldShow" text="2"></div>' +
'</needs-query>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
var q = view.rawView.locals.get("q");
var q = view.componentViewChildren[0].getLocal("q");
view.detectChanges();
q.query.onChange(() => {
@ -139,23 +147,24 @@ export function main() {
async.done();
});
view.context.shouldShow = true;
view.componentInstance.shouldShow = true;
view.detectChanges();
});
}));
it("should notify child's query before notifying parent's query",
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-desc #q1>' +
'<needs-query-desc #q2>' +
'<div text="1"></div>' +
'</needs-query-desc>' +
'</needs-query-desc>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
var q1 = view.rawView.locals.get("q1");
var q2 = view.rawView.locals.get("q2");
var q1 = view.componentViewChildren[0].getLocal("q1");
var q2 = view.componentViewChildren[0].getLocal("q2");
var firedQ2 = false;
@ -172,17 +181,18 @@ export function main() {
describe("querying by var binding", () => {
it('should contain all the child directives in the light dom with the given var binding',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<needs-query-by-var-binding #q>' +
'<div *ng-for="#item of list" [text]="item" #text-label="textDir"></div>' +
'</needs-query-by-var-binding>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
var q = view.rawView.locals.get("q");
var q = view.componentViewChildren[0].getLocal("q");
view.context.list = ['1d', '2d'];
view.componentInstance.list = ['1d', '2d'];
view.detectChanges();
@ -194,15 +204,16 @@ export function main() {
}));
it('should support querying by multiple var bindings',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-by-var-bindings #q>' +
'<div text="one" #text-label1="textDir"></div>' +
'<div text="two" #text-label2="textDir"></div>' +
'</needs-query-by-var-bindings>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
var q = view.rawView.locals.get("q");
var q = view.componentViewChildren[0].getLocal("q");
view.detectChanges();
expect(q.query.first.text).toEqual("one");
@ -213,21 +224,22 @@ export function main() {
}));
it('should reflect dynamically inserted directives',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<needs-query-by-var-binding #q>' +
'<div *ng-for="#item of list" [text]="item" #text-label="textDir"></div>' +
'</needs-query-by-var-binding>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
var q = view.rawView.locals.get("q");
var q = view.componentViewChildren[0].getLocal("q");
view.context.list = ['1d', '2d'];
view.componentInstance.list = ['1d', '2d'];
view.detectChanges();
view.context.list = ['2d', '1d'];
view.componentInstance.list = ['2d', '1d'];
view.detectChanges();
@ -238,18 +250,19 @@ export function main() {
}));
it('should contain all the elements in the light dom with the given var binding',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-by-var-binding #q>' +
'<div template="ng-for: #item of list">' +
'<div #text-label>{{item}}</div>' +
'</div>' +
'</needs-query-by-var-binding>';
tb.createView(MyComp, {html: template})
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
var q = view.rawView.locals.get("q");
var q = view.componentViewChildren[0].getLocal("q");
view.context.list = ['1d', '2d'];
view.componentInstance.list = ['1d', '2d'];
view.detectChanges();

26
modules/angular2/test/core/directive_lifecycle_integration_spec.ts
View File

@ -9,11 +9,11 @@ import {
it,
xdescribe,
xit,
TestComponentBuilder,
IS_DARTIUM
} from 'angular2/test_lib';
import {ListWrapper} from 'angular2/src/facade/collection';
import {TestBed} from 'angular2/src/test_lib/test_bed';
import {
Directive,
Component,
@ -27,25 +27,21 @@ import * as viewAnn from 'angular2/src/core/annotations_impl/view';
export function main() {
describe('directive lifecycle integration spec', () => {
var ctx;
beforeEach(() => { ctx = new MyComp(); });
it('should invoke lifecycle methods onChange > onInit > onCheck > onAllChangesDone',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
tb.overrideView(
MyComp,
new viewAnn.View(
{template: '<div [field]="123" lifecycle></div>', directives: [LifecycleDir]}));
tb.createView(MyComp, {context: ctx})
.then((view) => {
var dir = view.rawView.elementInjectors[0].get(LifecycleDir);
view.detectChanges();
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
tcb.overrideView(
MyComp,
new viewAnn.View(
{template: '<div [field]="123" lifecycle></div>', directives: [LifecycleDir]}))
.createAsync(MyComp)
.then((tc) => {
var dir = tc.componentViewChildren[0].inject(LifecycleDir);
tc.detectChanges();
expect(dir.log).toEqual(["onChange", "onInit", "onCheck", "onAllChangesDone"]);
view.detectChanges();
tc.detectChanges();
expect(dir.log).toEqual([
"onChange",

11
modules/angular2/test/core/forward_ref_integration_spec.ts
View File

@ -1,5 +1,7 @@
import {
AsyncTestCompleter,
TestComponentBuilder,
asNativeElements,
beforeEach,
ddescribe,
describe,
@ -9,7 +11,6 @@ import {
it,
xit
} from 'angular2/test_lib';
import {TestBed} from 'angular2/src/test_lib/test_bed';
import {Directive, Component, Query, View} from 'angular2/annotations';
import {QueryList, NgFor} from 'angular2/angular2';
import {forwardRef, resolveForwardRef, bind, Inject} from 'angular2/di';
@ -18,10 +19,10 @@ import {Type} from 'angular2/src/facade/lang';
export function main() {
describe("forwardRef integration", function() {
it('should instantiate components which are declared using forwardRef',
inject([TestBed, AsyncTestCompleter], (tb: TestBed, async) => {
tb.createView(App).then((view) => {
view.detectChanges();
expect(view.rootNodes).toHaveText('frame(lock)');
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
tcb.createAsync(App).then((tc) => {
tc.detectChanges();
expect(asNativeElements(tc.componentViewChildren)).toHaveText('frame(lock)');
async.done();
});
}));