chore: update testing example to RC4

closes #1839
This commit is contained in:
Foxandxss 2016-07-06 18:19:10 +02:00 committed by Ward Bell
parent 8ddc93d211
commit abd860c3ca
6 changed files with 49 additions and 106 deletions

View File

@ -5,13 +5,10 @@ import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core'; import { DebugElement } from '@angular/core';
import { import {
beforeEach, beforeEachProviders,
describe, ddescribe, xdescribe,
expect, it, iit, xit,
async, inject async, inject
} from '@angular/core/testing'; } from '@angular/core/testing';
import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing'; import { ComponentFixture, TestComponentBuilder } from '@angular/core/testing';
import { Hero, HeroService, MockHeroService } from './mock-hero.service'; import { Hero, HeroService, MockHeroService } from './mock-hero.service';
@ -45,7 +42,7 @@ describe('AppComponent', () => {
it('can get title from template', () => { it('can get title from template', () => {
fixture.detectChanges(); fixture.detectChanges();
let titleEl = fixture.debugElement.query(By.css('h1')).nativeElement; let titleEl = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(titleEl).toHaveText(comp.title); expect(titleEl.textContent).toContain(comp.title);
}); });
it('can get RouterLinks from template', () => { it('can get RouterLinks from template', () => {

View File

@ -19,13 +19,11 @@ import { DebugElement } from '@angular/core';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { import {
beforeEach, beforeEachProviders, addProviders,
describe, ddescribe, xdescribe,
expect, it, iit, xit,
async, inject async, inject
} from '@angular/core/testing'; } from '@angular/core/testing';
import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing'; import { ComponentFixture, TestComponentBuilder } from '@angular/core/testing';
import { ViewMetadata } from '@angular/core'; import { ViewMetadata } from '@angular/core';
import { Observable } from 'rxjs/Rx'; import { Observable } from 'rxjs/Rx';
@ -143,20 +141,20 @@ xdescribe('async & inject testing errors', () => {
restoreJasmineIt(); restoreJasmineIt();
}, 10000); }, 10000);
describe('using beforeEachProviders', () => { describe('using addProviders', () => {
beforeEachProviders(() => [{ provide: FancyService, useValue: new FancyService() }]); addProviders([{ provide: FancyService, useValue: new FancyService() }]);
beforeEach( beforeEach(
inject([FancyService], (service: FancyService) => { expect(service.value).toEqual('real value'); })); inject([FancyService], (service: FancyService) => { expect(service.value).toEqual('real value'); }));
describe('nested beforeEachProviders', () => { describe('nested addProviders', () => {
it('should fail when the injector has already been used', () => { it('should fail when the injector has already been used', () => {
patchJasmineBeforeEach(); patchJasmineBeforeEach();
expect(() => { expect(() => {
beforeEachProviders(() => [{ provide: FancyService, useValue: new FancyService() }]); addProviders([{ provide: FancyService, useValue: new FancyService() }]);
}) })
.toThrowError('beforeEachProviders was called after the injector had been used ' + .toThrowError('addProviders was called after the injector had been used ' +
'in a beforeEach or it block. This invalidates the test injector'); 'in a beforeEach or it block. This invalidates the test injector');
restoreJasmineBeforeEach(); restoreJasmineBeforeEach();
}); });

View File

@ -1,7 +1,7 @@
// Based on https://github.com/angular/angular/blob/master/modules/angular2/test/testing/testing_public_spec.ts // Based on https://github.com/angular/angular/blob/master/modules/angular2/test/testing/testing_public_spec.ts
/* tslint:disable */ /* tslint:disable */
import { import {
BadTemplateUrl, ButtonComp, ButtonComp,
ChildChildComp, ChildComp, ChildWithChildComp, ChildChildComp, ChildComp, ChildWithChildComp,
ExternalTemplateComp, ExternalTemplateComp,
FancyService, MockFancyService, FancyService, MockFancyService,
@ -16,14 +16,12 @@ import { DebugElement } from '@angular/core';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { import {
beforeEach, beforeEachProviders, addProviders,
describe, ddescribe, xdescribe, inject, async,
expect, it, iit, xit,
async, inject,
fakeAsync, tick, withProviders fakeAsync, tick, withProviders
} from '@angular/core/testing'; } from '@angular/core/testing';
import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing'; import { ComponentFixture, TestComponentBuilder } from '@angular/core/testing';
import { ViewMetadata } from '@angular/core'; import { ViewMetadata } from '@angular/core';
@ -31,47 +29,6 @@ import { Observable } from 'rxjs/Rx';
//////// SPECS ///////////// //////// SPECS /////////////
/// Verify can use Angular testing's DOM abstraction to access DOM
describe('angular2 jasmine matchers', () => {
describe('toHaveCssClass', () => {
it('should assert that the CSS class is present', () => {
let el = document.createElement('div');
el.classList.add('bombasto');
expect(el).toHaveCssClass('bombasto');
});
it('should assert that the CSS class is not present', () => {
let el = document.createElement('div');
el.classList.add('bombasto');
expect(el).not.toHaveCssClass('fatias');
});
});
describe('toHaveCssStyle', () => {
it('should assert that the CSS style is present', () => {
let el = document.createElement('div');
expect(el).not.toHaveCssStyle('width');
el.style.setProperty('width', '100px');
expect(el).toHaveCssStyle('width');
});
it('should assert that the styles are matched against the element', () => {
let el = document.createElement('div');
expect(el).not.toHaveCssStyle({width: '100px', height: '555px'});
el.style.setProperty('width', '100px');
expect(el).toHaveCssStyle({width: '100px'});
expect(el).not.toHaveCssStyle({width: '100px', height: '555px'});
el.style.setProperty('height', '555px');
expect(el).toHaveCssStyle({height: '555px'});
expect(el).toHaveCssStyle({width: '100px', height: '555px'});
});
});
});
describe('using the async helper', () => { describe('using the async helper', () => {
let actuallyDone = false; let actuallyDone = false;
@ -101,7 +58,7 @@ describe('using the async helper', () => {
p.catch(() => { actuallyDone = true; }); p.catch(() => { actuallyDone = true; });
})); }));
it('should run async test with successful Observable', async(() => { xit('should run async test with successful Observable', async(() => {
let source = Observable.of(true).delay(10); let source = Observable.of(true).delay(10);
source.subscribe( source.subscribe(
val => {}, val => {},
@ -114,9 +71,11 @@ describe('using the async helper', () => {
describe('using the test injector with the inject helper', () => { describe('using the test injector with the inject helper', () => {
describe('setting up Providers with FancyService', () => { describe('setting up Providers with FancyService', () => {
beforeEachProviders(() => [ beforeEach(() => {
{ provide: FancyService, useValue: new FancyService() } addProviders([
]); { provide: FancyService, useValue: new FancyService() }
]);
});
it('should use FancyService', it('should use FancyService',
inject([FancyService], (service: FancyService) => { inject([FancyService], (service: FancyService) => {
@ -142,7 +101,7 @@ describe('using the test injector with the inject helper', () => {
); );
}))); })));
it('test should wait for FancyService.getObservableDelayValue', xit('test should wait for FancyService.getObservableDelayValue',
async(inject([FancyService], (service: FancyService) => { async(inject([FancyService], (service: FancyService) => {
service.getObservableDelayValue().subscribe( service.getObservableDelayValue().subscribe(
value => { expect(value).toEqual('observable delay value'); } value => { expect(value).toEqual('observable delay value'); }
@ -197,7 +156,7 @@ describe('test component builder', function() {
tcb.createAsync(ChildComp).then(fixture => { tcb.createAsync(ChildComp).then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('Original Child'); expect(fixture.nativeElement.textContent).toContain('Original Child');
}); });
}))); })));
@ -206,11 +165,11 @@ describe('test component builder', function() {
tcb.createAsync(MyIfComp).then(fixture => { tcb.createAsync(MyIfComp).then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('MyIf()'); expect(fixture.nativeElement.textContent).toContain('MyIf()');
fixture.debugElement.componentInstance.showMore = true; fixture.debugElement.componentInstance.showMore = true;
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('MyIf(More)'); expect(fixture.nativeElement.textContent).toContain('MyIf(More)');
}); });
}))); })));
@ -262,7 +221,7 @@ describe('test component builder', function() {
.createAsync(MockChildComp) .createAsync(MockChildComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('Mock'); expect(fixture.nativeElement.textContent).toContain('Mock');
}); });
}))); })));
@ -276,7 +235,7 @@ describe('test component builder', function() {
.createAsync(ChildComp) .createAsync(ChildComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('Modified Child'); expect(fixture.nativeElement.textContent).toContain('Modified Child');
}); });
}))); })));
@ -288,7 +247,7 @@ describe('test component builder', function() {
.createAsync(ParentComp) .createAsync(ParentComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('Parent(Mock)'); expect(fixture.nativeElement.textContent).toContain('Parent(Mock)');
}); });
}))); })));
@ -302,8 +261,8 @@ describe('test component builder', function() {
.createAsync(ParentComp) .createAsync(ParentComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement) expect(fixture.nativeElement.textContent)
.toHaveText('Parent(Original Child(ChildChild Mock))'); .toContain('Parent(Original Child(ChildChild Mock))');
}); });
}))); })));
@ -318,8 +277,8 @@ describe('test component builder', function() {
.createAsync(TestProvidersComp) .createAsync(TestProvidersComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement) expect(fixture.nativeElement.textContent)
.toHaveText('injected value: mocked out value'); .toContain('injected value: mocked out value');
}); });
}))); })));
@ -333,8 +292,8 @@ describe('test component builder', function() {
.createAsync(TestViewProvidersComp) .createAsync(TestViewProvidersComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement) expect(fixture.nativeElement.textContent)
.toHaveText('injected value: mocked out value'); .toContain('injected value: mocked out value');
}); });
}))); })));
@ -344,8 +303,8 @@ describe('test component builder', function() {
tcb.createAsync(ExternalTemplateComp) tcb.createAsync(ExternalTemplateComp)
.then(fixture => { .then(fixture => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.nativeElement) expect(fixture.nativeElement.textContent)
.toHaveText('from external template\n'); .toContain('from external template\n');
}); });
})), 10000); // Long timeout because this test makes an actual XHR. })), 10000); // Long timeout because this test makes an actual XHR.

View File

@ -4,13 +4,11 @@ import { DashboardComponent } from './dashboard.component';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { import {
beforeEach, beforeEachProviders, addProviders,
describe, ddescribe, xdescribe,
expect, it, iit, xit,
async, inject async, inject
} from '@angular/core/testing'; } from '@angular/core/testing';
import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing'; import { ComponentFixture, TestComponentBuilder } from '@angular/core/testing';
import { Hero, HeroService, MockHeroService } from './mock-hero.service'; import { Hero, HeroService, MockHeroService } from './mock-hero.service';
import { Router, MockRouter } from './mock-router'; import { Router, MockRouter } from './mock-router';
@ -70,13 +68,13 @@ describe('DashboardComponent', () => {
let comp: DashboardComponent; let comp: DashboardComponent;
let mockHeroService: MockHeroService; let mockHeroService: MockHeroService;
beforeEachProviders(() => { beforeEach(() => {
mockHeroService = new MockHeroService(); mockHeroService = new MockHeroService();
return [ addProviders([
{ provide: Router, useClass: MockRouter}, { provide: Router, useClass: MockRouter},
{ provide: MockRouter, useExisting: Router}, { provide: MockRouter, useExisting: Router},
{ provide: HeroService, useValue: mockHeroService } { provide: HeroService, useValue: mockHeroService }
]; ]);
}); });
it('can instantiate it', it('can instantiate it',
@ -138,8 +136,8 @@ describe('DashboardComponent', () => {
expect(heroNames.length).toEqual(4, 'should display 4 heroes'); expect(heroNames.length).toEqual(4, 'should display 4 heroes');
// the 4th displayed hero should be the 5th mock hero // the 4th displayed hero should be the 5th mock hero
expect(heroNames[3].nativeElement) expect(heroNames[3].nativeElement.textContent)
.toHaveText(mockHeroService.mockHeroes[4].name); .toContain(mockHeroService.mockHeroes[4].name);
}); });
}); });

View File

@ -1,9 +0,0 @@
// See https://github.com/angular/angular/issues/9017
import { expect as expectCore } from '@angular/core/testing';
import { NgMatchers } from '@angular/platform-browser/testing';
export function expect(spy: Function): NgMatchers;
export function expect(actual: any): NgMatchers;
export function expect(actual: any): NgMatchers {
return expectCore(actual) as NgMatchers;
}

View File

@ -1,12 +1,10 @@
/* tslint:disable:no-unused-variable */ /* tslint:disable:no-unused-variable */
import { import {
beforeEach, beforeEachProviders, addProviders,
describe, ddescribe, xdescribe,
expect, it, iit, xit,
async, inject, withProviders async, inject, withProviders
} from '@angular/core/testing'; } from '@angular/core/testing';
import { TestComponentBuilder } from '@angular/compiler/testing'; import { TestComponentBuilder } from '@angular/core/testing';
import { import {
MockBackend, MockBackend,
@ -42,10 +40,12 @@ const makeResponseData = (data: {}) => {return { data }; };
//////// SPECS ///////////// //////// SPECS /////////////
describe('Http-HeroService (mockBackend)', () => { describe('Http-HeroService (mockBackend)', () => {
beforeEachProviders(() => [ beforeEach(() => {
HTTP_PROVIDERS, addProviders([
{ provide: XHRBackend, useClass: MockBackend } HTTP_PROVIDERS,
]); { provide: XHRBackend, useClass: MockBackend }
]);
});
it('can instantiate service when inject service', it('can instantiate service when inject service',
withProviders(() => [HeroService]) withProviders(() => [HeroService])