ngMock $httpBackend should keep a list of the received calls to debug tests

[fabiosussetto]

Hi, I'm not sure if this is already possible, but I haven't found a way yet. In my unit tests I'm using $httpBacked to expect calls to an API. When the expectations fail, it would be useful to see a list of the actual calls, to see you .expectGET('..') failed because your code is calling the wrong url, or is sending the wrong data.

[pkozlowski-opensource]

@fabiosussetto did you try, in your test:

afterEach(function() {
     $httpBackend.verifyNoOutstandingExpectation();
     $httpBackend.verifyNoOutstandingRequest();
});

AFAIK it should show failed expectations / additional requests. Docs here: https://docs.angularjs.org/api/ngMock/service/$httpBackend

[fabiosussetto]

@pkozlowski-opensource yes indeed, and my test fails with this stacktrace:

Error: No pending request to flush !
        at Function.$httpBackend.flush (/Users/fabio/Code/waypoints/web_client/bower_components/angular-mocks/angular-mocks.js:1526:34)
        at Object.<anonymous> (/Users/fabio/Code/waypoints/web_client/src/tests/eventModelSpec.js:100:22)
    Error: Unsatisfied requests: PUT http://localhost:8000/be/rest/timelines/1/events/2
        at Function.$httpBackend.verifyNoOutstandingExpectation (/Users/fabio/Code/waypoints/web_client/bower_components/angular-mocks/angular-mocks.js:1559:13)
        at Object.<anonymous> (/Users/fabio/Code/waypoints/web_client/src/tests/eventModelSpec.js:24:22)

And my test was failing because I was calling the wrong url (specifically I was using the wrong id in the url) from my code under testing. I'd love to have a way to immediately see that the expected url was not hit, and instead the wrong url was.

[pkozlowski-opensource]

I'd love to have a way to immediately see that the expected url was not hit, and instead the wrong url was.

Not sure what you are proposing, exactly, I'm afraid. Which API call you would expect to fail "immediately"?

[fabiosussetto]

Sorry probably I haven't been very clear. Given my $httpBacked.expectGET() failed because I was calling the wrong url, I'd like to be able to do something along these lines:

console.log($httpBacked.calls)

and see a list of API calls received by the mocked http backend. That way I could see that I was calling the wrong URL.
At the moment I don't see a way to inspect the API calls I'm actually making during my unit tests.

From the failure message, I only know that for sure I didn't call the URL I was expecting to call, but then I'm in the dark, I don't know if I haven't call the API at all, or if I called it with the wrong URL (or wrong data, or headers).

[pkozlowski-opensource]

@fabiosussetto are you sure that you've got this line in your test: $httpBackend.verifyNoOutstandingRequest();? This is the one that should give you a list of unexpected requests...

[fabiosussetto]

http://plnkr.co/edit/zOSCORd25oAtccT6MZ6w?p=catalogue This is my actual test code. Here I'm expecting to call the wrong url, the failure I get is:

Error: No pending request to flush !
        at Function.$httpBackend.flush (/Users/fabio/Code/waypoints/web_client/bower_components/angular-mocks/angular-mocks.js:1526:34)
        at Object.<anonymous> (/Users/fabio/Code/waypoints/web_client/src/tests/eventModelSpec.js:48:22)
    Error: Unsatisfied requests: GET http://localhost:8000/be/rest/timelines/2/timeline
        at Function.$httpBackend.verifyNoOutstandingExpectation (/Users/fabio/Code/waypoints/web_client/bower_components/angular-mocks/angular-mocks.js:1559:13)
        at Object.<anonymous> (/Users/fabio/Code/waypoints/web_client/src/tests/eventModelSpec.js:24:22)

Which is fine, I know that I'm not doing a GET to http://localhost:8000/be/rest/timelines/2/timeline. The problem is that I am actually doing a GET to http://localhost:8000/be/rest/timelines/1/timeline instead (notice the wrong id the the url), but I don't see that in the error message. Am I doing something wrong in my test perhaps? If I change line 46 of my plunker to expect the right url (so http://localhost:8000/be/rest/timelines/1/timeline), then my test passes.

Btw I'm on angular 1.3.8.

Thanks a lot!

[fabiosussetto]

I just tried to swap the two calls to be:

$httpBackend.verifyNoOutstandingRequest();
$httpBackend.verifyNoOutstandingExpectation();

so that it first checks for outstanding requests, but I get the same error message.

[fabiosussetto]

Another update: I tried to remove my $httpBackend.flush(); and now I get the correct error message:
Error: Unsatisfied requests: PUT http://localhost:8000/be/rest/timelines/1/events/2
Then am I using flush() in the wrong way?

Sorry ignore the previous lines in this comment, it's not true, I get the same error message without the error "No pending request to flush !"