Testing a service method with an HTTP request in Angular 6

Question

I am having an issue with one of my unit tests whereas a function that contains an HTTP post request is not returning a string when it should be. Here is the service function in question:

public getAnonToken(prev?: string): string {
        if (this.tokens[prev]) {
            return this.tokens[prev]
        }

        if(prev) {
            this.tokens[prev] = prev;
        }        

        this.http.post<any>(HttpUrl.ANON_TOKEN, {})
            .subscribe((response) => {
                this.saveAuthToken(response.data);
                this.tokens[prev] = response.data;

                // analytics!!!
                // Global.internalAnalytics.getAnonToken();
                return response.data;
            });            
    }

As you can see, a request made to the token generation endpoint which returns an observable which I then subscribe to and return the token from the getAnonToken() function.

Here is my test:`

fit("should call the token endpoint and save then return a new token if old token has expired", () => {
    const mockTokenResponseData = {
        data: "i am a token"         
    }
    spyOn(httpClient, "post").and.returnValue(Observable.of(mockTokenResponseData));

    expect(authService.getAnonToken()).toEqual("i am a token");        

});`

As you can see, I am creating a mock response (an observable) and then setting it as the return value when the post request is made using a spy. Instead of 'i am a token' I get undefined. I have a feeling this is because the test is not waiting for the observable to return but I am unsure as to how this is resolved. Can anyone see what is happening here? thanks

Kstro21 · Accepted Answer · 2018-07-12 15:24:37Z

2

You are missing returning the this.http.post in your function, also, you need to put your expect into the subscription.

Return the call to http.post

return this.http.post<any>(HttpUrl.ANON_TOKEN, {})
    .subscribe((response) => {
        this.saveAuthToken(response.data);
        this.tokens[prev] = response.data;

        // analytics!!!
        // Global.internalAnalytics.getAnonToken();
        return response.data;
    });

Please, not the return in front of this.http.post

Put the expect inside the subscription

authService.getAnonToken().subscribe((data) => {
    expect(data).toEqual("i am a token");
});

Hope it helps

answered Jul 12, 2018 at 15:24

Kstro21

7,84114 gold badges65 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Testing a service method with an HTTP request in Angular 6

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related