CODEWITHSUNDEEP
angularjsunit-testingjasmine
clo5ure
clo5ure

Reputation: 90

AngularJS Service Test (Jasmine/Karma) - Error: Unexpected request: GET

I'm currently trying to test an AngularJS service I've written using Karma and Jasmine. However, I'm currently running into an issue with $httpBackend and I cannot get around it. Here's my service and test:

Service:

export default angular.module("api:events", [])
.factory("Events", ($http) => {
    let api = "http://localhost:5000/api/";
    let Events = {};

    Events.query = (params) => {
        return $http.get(`${api}/events`, {params: params}).then((res) => {
            return res.data;
        });
    };

    Events.get = (params) => {
        return $http.get(`${api}/events/` + params.id).then((res) => {
            return res.data;
        });
    };

    return Events;
});

Test:

describe("api:events", () => {
    let EventsFactory, $scope, http;

    beforeEach(module("app"));

    beforeEach(inject((_Events_, $rootScope, $httpBackend) => {
        EventsFactory = _Events_;
        $scope = $rootScope.$new();
        http = $httpBackend;
    }));


    it("should return an object", () => {
        let data = {};
        let url = "http://localhost:5000/api/events/:id";
        let response = { id: "12345" };

        http.whenGET(url).respond(200, response);

        data = EventsFactory.get({ id: "1"});

        expect(data).not.toEqual("12345");

        http.flush();

        expect(data).toEqual("12345");

        http.verifyNoOutstandingExpectation();
        http.verifyNoOutstandingRequest();
    });
});

And the error I'm receiving (due to http.flush()):

Chrome 46.0.2490 (Mac OS X 10.10.5) api:events test FAILED
    Error: Unexpected request: GET http://localhost:5000/api/events/1
    No more request expected

If I log data after data = EventsFactory.get({ id: "1"}); I get Object{$$state: Object{status: 0}}.

I've also tried calling my service like this with similar results:

EventsFactory.get({ id: "1"}).then((result) => {
    data = result;
});

Any thoughts?

Upvotes: 2

Views: 706

Answers (2)

Nikos Paraskevopoulos
Nikos Paraskevopoulos

Reputation: 40318

The problem here is that URLs given to the whenXXX() and expectXXX() methods of the $http mocks have to be literal. One could intuitevely expect that URLs with parameters (e.g. the :id in the code from the question) will work, but that is not the case. So to correct the error, just replace:

let url = "http://localhost:5000/api/events/:id";

with:

let url = "http://localhost:5000/api/events/1"; // `1` is the literal id

Upvotes: 2

Sunil D.
Sunil D.

Reputation: 18193

Check out the documentation for verifyNoOutstandingExpectation() and verifyNoOutstandingRequest().

It says:

Verifies that all of the requests defined via the expect api were made.

The key words there are "expect api". You are not using the "expect" API, you're using then "when" API. You shouldn't be calling either of these methods at the end of your test when using the "when" API.

The documentation describes the differences between the "expect" and "when" API.

Upvotes: 1

Related Questions