UnitTest Mock Http response in Angular2 (2.1.0) Service - unit-testing

Question

I am very confused by the different sources online about testing Angular2, mainly due to differences in versions. I am using Angular 2.1.0 final and I don't understand how to mock a simple http response for my service test class below:
import { TestBed, async, inject } from '#angular/core/testing';
import { PersonService } from '../services/person.service';
import { Person} from '../models/Person';
import { MOCK_DATA_PERSON } from '../test/mocks/mock-data-person';
// HTTP mocking imports
import { Http, BaseRequestOptions, Response, HttpModule, ResponseOptions } from '#angular/http';
import { MockBackend, MockConnection } from '#angular/http/testing';
describe('PersonService', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
providers: [
PersonService,
MockBackend,
BaseRequestOptions,
{
provide: Http,
useFactory: (backend: MockBackend, options: BaseRequestOptions) => {
return new Http(backend, options);
},
deps: [MockBackend, BaseRequestOptions],
}
],
imports: [
HttpModule
]
});
TestBed.compileComponents();
}));
it('returns a list of persons', async(inject([MockBackend, PersonService], (backend: MockBackend, service) => {
backend.connections.subscribe(
(connection: MockConnection) => {
connection.mockRespond(new Response(
new ResponseOptions({
body: JSON.stringify({name: "Bob", surname : "Jones"})
})));
});
service.getPersons()
.subscribe(persons=> {
expect(persons.length).toBeDefined();
expect(persons.length).toBe(1);
}).catch(error => console.log(error));
})));
});
given the getPersons method looks like:
getPersons (): Observable<Person[]> {
return this.http.get(this.getAllUrl)
.map(res.json().data)
.catch(this.handleError);
}
i am getting the error "Failed: this.http.get(...).map is not a function"

Answer 1

Test is good, but the Observable.map operator isn't found. Try to just import it
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';