How to properly unit test an Angular2 http service with the MockBackend? - unit-testing

Question

When running npm test I get this error:
src/client/app/shared/services/scientist.service.spec.ts(20,7): error TS2345: Argument of type 'Function' is not assignable to parameter of type '(done: () => void) => void'.
Type 'Function' provides no match for the signature '(done: () => void): void'
I'am using this angular2 seed: https://github.com/mgechev/angular2-seed and I changed the scientist name-list service to get the data from http, based on this blog: http://chariotsolutions.com/blog/post/testing-http-services-angular-2-jasmine/.
So I created my Scientist class with asScientist and asScientists methods that create instances from json.
scientist.service.ts:
import {Injectable} from 'angular2/core';
import {Http, Response} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import {Scientist} from './scientist';
#Injectable()
export class ScientistService {
private url = 'http://path/to/scientists/';
constructor(private http:Http) {
}
get():Observable<Scientist[]> {
return this.http.get(this.url)
.map((res:Response) => {
return Scientist.asScientists(res.json());
});
}
}
scientist.service.spec.ts:
import {provide} from 'angular2/core';
import {beforeEachProviders, inject} from 'angular2/testing';
import {XHRBackend, ResponseOptions, Response} from 'angular2/http';
import {MockBackend, MockConnection} from 'angular2/src/http/backends/mock_backend';
import {Scientist} from './scientist';
import {ScientistService} from './scientist.service.ts';
export function main() {
describe('Scientist Service', () => {
beforeEachProviders(() => {
return [HTTP_PROVIDERS, provide(XHRBackend, {useClass: MockBackend}), ScientistService];
});
it('should get the list of scientists',
// ##### Line below causes the error #####
inject([XHRBackend, ScientistService], (mockBackend:MockBackend, scientistService:ScientistService) => {
mockBackend.connections.subscribe(
(connection:MockConnection) => {
// Haven't changed these yet since I want to make the test pass first
connection.mockRespond(new Response(
new ResponseOptions({
body: [
{
id: 26,
contentRendered: '<p><b>Hi there</b></p>',
contentMarkdown: '*Hi there*'
}]
}
)));
});
scientistService.get().subscribe((scientists:Scientist[]) => {
expect(scientists.length).toBe(1);
//expect(scientists[0].id).toBe(26);
//expect(data[0].contentMarkdown).toBe('*Hi there*');
},
(error:any) => {
// we can call a failure case here...
fail(error);
});
}));
});
}
It seems to be a syntax error but not a very obvious one, so any kind of help will be appreciated!

Answer 1

Maybe you need import all test methods from the angular2/testing module.
Like this:
import {it, beforeEachProviders, describe, expect, beforeEach, inject, injectAsync} from 'angular2/testing';
Because in your code I saw you just import "beforeEachProviders" and "inject".