diff --git a/modules/@angular/common/test/directives/ng_for_spec.ts b/modules/@angular/common/test/directives/ng_for_spec.ts
index 284bc27320..43cd3fd62f 100644
--- a/modules/@angular/common/test/directives/ng_for_spec.ts
+++ b/modules/@angular/common/test/directives/ng_for_spec.ts
@@ -7,7 +7,7 @@
*/
import {CommonModule} from '@angular/common';
-import {Component, ContentChild, TemplateRef} from '@angular/core';
+import {Component} from '@angular/core';
import {ComponentFixture, TestBed, async} from '@angular/core/testing';
import {By} from '@angular/platform-browser/src/dom/debug/by';
import {expect} from '@angular/platform-browser/testing/matchers';
@@ -29,10 +29,7 @@ export function main() {
beforeEach(() => {
TestBed.configureTestingModule({
- declarations: [
- TestComponent,
- ComponentUsingTestComponent,
- ],
+ declarations: [TestComponent],
imports: [CommonModule],
});
});
@@ -77,7 +74,7 @@ export function main() {
}));
it('should iterate over an array of objects', async(() => {
- const template = '
' +
- '
' +
- '
' +
- '{{subitem}}-{{item.length}};' +
- '
|' +
- '
' +
+ const template = '
' +
+ '
{{subitem}}-{{item.length}};
|' +
'
';
fixture = createTestComponent(template);
@@ -157,10 +150,9 @@ export function main() {
}));
it('should repeat over nested arrays with no intermediate element', async(() => {
- const template = '
' +
- '' +
- '{{subitem}}-{{item.length}};' +
- '
';
+ const template = '
' +
+ '
{{subitem}}-{{item.length}};
' +
+ '
';
fixture = createTestComponent(template);
getComponent().items = [['a', 'b'], ['c']];
@@ -170,10 +162,11 @@ export function main() {
detectChangesAndExpectText('e-1;f-2;g-2;');
}));
- it('should repeat over nested ngIf that are the last node in the ngFor temlate', async(() => {
- const template =
- `
`;
+ it('should repeat over nested ngIf that are the last node in the ngFor template', async(() => {
+ const template = `
` +
+ `
{{i}}|
` +
+ `
even|
` +
+ `
`;
fixture = createTestComponent(template);
@@ -189,8 +182,7 @@ export function main() {
}));
it('should display indices correctly', async(() => {
- const template =
- '
{{i.toString()}}
';
+ const template = '
{{i.toString()}}';
fixture = createTestComponent(template);
getComponent().items = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
@@ -202,7 +194,7 @@ export function main() {
it('should display first item correctly', async(() => {
const template =
- '
{{isFirst.toString()}}
';
+ '
{{isFirst.toString()}}';
fixture = createTestComponent(template);
getComponent().items = [0, 1, 2];
@@ -214,7 +206,7 @@ export function main() {
it('should display last item correctly', async(() => {
const template =
- '
{{isLast.toString()}}
';
+ '
{{isLast.toString()}}';
fixture = createTestComponent(template);
getComponent().items = [0, 1, 2];
@@ -226,7 +218,7 @@ export function main() {
it('should display even items correctly', async(() => {
const template =
- '
{{isEven.toString()}}
';
+ '
{{isEven.toString()}}';
fixture = createTestComponent(template);
getComponent().items = [0, 1, 2];
@@ -238,7 +230,7 @@ export function main() {
it('should display odd items correctly', async(() => {
const template =
- '
{{isOdd.toString()}}
';
+ '
{{isOdd.toString()}}';
fixture = createTestComponent(template);
getComponent().items = [0, 1, 2, 3];
@@ -249,55 +241,38 @@ export function main() {
}));
it('should allow to use a custom template', async(() => {
- const tcTemplate =
- '
';
- TestBed.overrideComponent(TestComponent, {set: {template: tcTemplate}});
- const cutTemplate =
- '
{{i}}: {{item}};';
- TestBed.overrideComponent(ComponentUsingTestComponent, {set: {template: cutTemplate}});
- fixture = TestBed.createComponent(ComponentUsingTestComponent);
-
- const testComponent = fixture.debugElement.children[0];
- testComponent.componentInstance.items = ['a', 'b', 'c'];
+ const template =
+ '
' +
+ '
{{i}}: {{item}};
';
+ fixture = createTestComponent(template);
+ getComponent().items = ['a', 'b', 'c'];
fixture.detectChanges();
- expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+ detectChangesAndExpectText('0: a;1: b;2: c;');
}));
it('should use a default template if a custom one is null', async(() => {
- const testTemplate = `
`;
- TestBed.overrideComponent(TestComponent, {set: {template: testTemplate}});
- const cutTemplate =
- '
{{i}}: {{item}};';
- TestBed.overrideComponent(ComponentUsingTestComponent, {set: {template: cutTemplate}});
- fixture = TestBed.createComponent(ComponentUsingTestComponent);
-
- const testComponent = fixture.debugElement.children[0];
- testComponent.componentInstance.items = ['a', 'b', 'c'];
+ const template =
+ `
`;
+ fixture = createTestComponent(template);
+ getComponent().items = ['a', 'b', 'c'];
fixture.detectChanges();
- expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+ detectChangesAndExpectText('0: a;1: b;2: c;');
}));
it('should use a custom template when both default and a custom one are present', async(() => {
- const testTemplate = `
`;
- TestBed.overrideComponent(TestComponent, {set: {template: testTemplate}});
- const cutTemplate =
- '
{{i}}: {{item}};';
- TestBed.overrideComponent(ComponentUsingTestComponent, {set: {template: cutTemplate}});
- fixture = TestBed.createComponent(ComponentUsingTestComponent);
-
- const testComponent = fixture.debugElement.children[0];
- testComponent.componentInstance.items = ['a', 'b', 'c'];
+ const template =
+ '
{{i}};' +
+ '
{{i}}: {{item}};';
+ fixture = createTestComponent(template);
+ getComponent().items = ['a', 'b', 'c'];
fixture.detectChanges();
- expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+ detectChangesAndExpectText('0: a;1: b;2: c;');
}));
describe('track by', () => {
it('should console.warn if trackBy is not a function', async(() => {
// TODO(vicb): expect a warning message when we have a proper log service
- const template =
- `
`;
+ const template = `
`;
fixture = createTestComponent(template);
fixture.componentInstance.value = 0;
fixture.detectChanges();
@@ -305,8 +280,7 @@ export function main() {
it('should track by identity when trackBy is to `null` or `undefined`', async(() => {
// TODO(vicb): expect no warning message when we have a proper log service
- const template =
- `
{{ item }}`;
+ const template = `
{{ item }}
`;
fixture = createTestComponent(template);
fixture.componentInstance.items = ['a', 'b', 'c'];
fixture.componentInstance.value = null;
@@ -317,7 +291,7 @@ export function main() {
it('should set the context to the component instance', async(() => {
const template =
- `
`;
+ `
`;
fixture = createTestComponent(template);
thisArg = null;
@@ -327,9 +301,7 @@ export function main() {
it('should not replace tracked items', async(() => {
const template =
- `
- {{items[i]}}
- `;
+ `
{{items[i]}}
`;
fixture = createTestComponent(template);
const buildItemList = () => {
@@ -345,7 +317,7 @@ export function main() {
it('should update implicit local variable on view', async(() => {
const template =
- `
{{item['color']}}
`;
+ `
{{item['color']}}
`;
fixture = createTestComponent(template);
getComponent().items = [{'id': 'a', 'color': 'blue'}];
@@ -357,7 +329,7 @@ export function main() {
it('should move items around and keep them updated ', async(() => {
const template =
- `
{{item['color']}}
`;
+ `
{{item['color']}}
`;
fixture = createTestComponent(template);
getComponent().items = [{'id': 'a', 'color': 'blue'}, {'id': 'b', 'color': 'yellow'}];
@@ -368,8 +340,7 @@ export function main() {
}));
it('should handle added and removed items properly when tracking by index', async(() => {
- const template =
- `
{{item}}
`;
+ const template = `
{{item}}
`;
fixture = createTestComponent(template);
getComponent().items = ['a', 'b', 'c', 'd'];
@@ -389,7 +360,6 @@ class Foo {
@Component({selector: 'test-cmp', template: ''})
class TestComponent {
- @ContentChild(TemplateRef) contentTpl: TemplateRef