I am trying to test my components in Angular 2 but having problem with it when the component's service is not within its providers.
import {Component} from 'angular2/core';
import {ServiceName} from '../../services/ServiceName';
@Component({
selector: 'component-name',
template: `
<div></div>
`
})
export class ComponentName {
constructor(private ServiceName: ServiceName) {
}
}
and this is my test:
import {ComponentName} from '<path>';
import {ServiceName} from '<path>';
import {
iit,
it,
ddescribe,
describe,
expect,
inject,
injectAsync,
TestComponentBuilder,
beforeEachProviders,
fakeAsync,
tick,
setBaseTestProviders
} from 'angular2/testing';
beforeEachProviders(() => [
ServiceName
]);
import {
TEST_BROWSER_PLATFORM_PROVIDERS,
TEST_BROWSER_APPLICATION_PROVIDERS
} from 'angular2/platform/testing/browser';
setBaseTestProviders(TEST_BROWSER_PLATFORM_PROVIDERS, TEST_BROWSER_APPLICATION_PROVIDERS);
describe('ServiceName', () => {
it('should have name property set', injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb.createAsync(ComponentName).then((fixture) => {
fixture.debugElement.componentInstance.isPanelActive = true;
fixture.detectChanges();
var compiled = fixture.debugElement.nativeElement;
expect(compiled.querySelector('a.yes')).toContainText('Something');
});
}));
});
The error I am getting is:
Failed: No provider for ServiceName! (ComponentName -> ServiceName)
Error: DI Exception
I tried overrideProvide method, it didn't work and also tried creating a TestComponent inside the test and passing the provider there along with the ComponentName directive.
Anyone has any idea? Is it not possible to have services bootstrap'ed by bootstrap file and not use providers in @Component? I thought that was the whole point of beforeEachProviders.
beforeEachProviders() {}
intodescribe('xxx', () { ...})
?ServiceName
doesn't have any constructor parameters?