Search code examples
angularangular2-servicesangular2-testing

Angular2 Testing: Service returning function instead of object array


I want to write some tests for my service written in Angular 2.1.0:

@Injectable()
export class MyService {
    api_base_url = 'http://' + environment.apiHost + ':5000/api/';

    constructor(private http: Http) {
    }

    getMyObjs(query): Observable<MyObj[]> {
        let params = new URLSearchParams();

        if (query != null && query.length > 0)
            params.set('q', query);

        return this.http.get(this.api_base_url + 'entries/' + pipelineId, {search: params})
            .map(this.extractData)
            .catch(this.handleError);
    }

    private extractData(res: Response) {
        let body = res.json();
        return body.entries || {};
    }

    private handleError(error: any) {
        // In a real world app, we might use a remote logging infrastructure
        // We'd also dig deeper into the error to get a better message
        let errMsg = (error.message) ? error.message :
            error.status ? `${error.status} - ${error.statusText}` : 'Server error';
        console.error(errMsg); // log to console instead
        return Observable.throw(errMsg);
    }

}

And here is the test so far:

describe('Service: Entry', () => {

beforeEach(async(() => {
    TestBed.configureTestingModule({
        providers: [
            BaseRequestOptions,
            MockBackend,
            MyService,
            {
                provide: Http,
                useFactory: (backend: MockBackend, options: BaseRequestOptions) => {
                    return new Http(backend, options);
                },
                deps: [MockBackend, BaseRequestOptions]
            }
        ]
    });

}));

it('should return myobjs', inject([MockBackend, MyService], (backend: MockBackend, service: MyService) => {
    const my_body = JSON.stringify([
        {
            "timestamp": "2016.01.01T12:55:00Z",
            "level": 0,
        }
    ]);
    const baseResponse = new Response(new ResponseOptions({body: my_body, status: 200}))
    backend.connections.subscribe((connection: MockConnection) => {
        return connection.mockRespond(baseResponse);
    });

    service.getMyObjs(null).subscribe((obs: MyObj[]) => {
        console.log(obs);
        expect(obs.length).toBe(1);
    });

}));
});

This test fails saying Expected 0 to be 1.. The console.log shows LOG: function obs() { ... }. I do not undestand why this is a function and not an array of objects. I'm runnign the tests with ng test command.


Solution

  • In the mocked HTTP response you return object structure that is different from what extractData() is expecting. I suppose it should look like this:

        // ... stuff ...
    it('should return myobjs', ...) => {
        const my_body = JSON.stringify({
            entries: [{
                "timestamp": "2016.01.01T12:55:00Z",
                "level": 0,
            }]
        });