Unit Testing service with XHR and $httpBackend "Error: No pending request to flush !"

3,058 views
Skip to first unread message

Alexander Kohout

unread,
Jun 4, 2013, 12:37:32 PM6/4/13
to ang...@googlegroups.com
I'm trying to test my Authentication Service, which is (among others) responsible for registering a new user with my API.

For the sake of simplicity, my code to be tested looks simply like this:

register: function (user) {
    return $http.post('/api/register', user);
}

So it simply sends an HTTP POST and returns the according promise.


To unit test it, I have to mock the XHR call, so that it gets the answer I expect, so that I can test the behavior. Therefore, I access the $httpBackend like:

var $httpBackend;

 beforeEach(inject(function(_$httpBackend_) {
     $httpBackend = _$httpBackend_;
 }));

Pretty easy so far.
So in my test specification (Jasmine), I tell the $httpBackend what I expect. The API will simply return the registered user in case of success (which is the test scenario). Then I call the register function from above and flush the whole thing:

var mockUser = {
  username: 'johndoe'
}
$httpBackend.expectPOST('/api/register, mockUser).respond(200, mockUser);

var mockUser = {
  username: 'johndoe'
}
var authService = $injector.get('AuthenticationService'); // initiate here so that the service uses my $httpBackend? have read that somewhere
authService.register(mockUser ).then( // No testing so far
      function () {
          console.log("Success");
      },
      function () {
          console.log("Error");
      }
 );

 $httpBackend.flush(); // Flush after the http post should resolve the promise!


The Error Message Karma displays is:
Error: No pending request to flush !
        at Error (<anonymous>)
        at Function.$httpBackend.flush (%my_dir%/test/lib/angular/angular-mocks.js:1171:34)
        at null.<anonymous> (%my_dir%/test/unit/services/authenticationSpec.js:45:16)
        at Object.invoke (%my_dir%/app/js/vendor/angular/angular.js:2931:28)
        at workFn (%my_dir%/test/lib/angular/angular-mocks.js:1758:20)
    Error: Declaration Location
        at window.jasmine.window.inject.angular.mock.inject (%my_dir%/test/lib/angular/angular-mocks.js:1744:25)
        at null.<anonymous> (%my_dir%/test/unit/services/authenticationSpec.js:17:67)
        at /%my_dir%/test/unit/services/authenticationSpec.js:1:1
(I just replaced my complete path prefix with %my_dir% ;)


Anyone out there who can help me and tell me how to do that right?

Anirvan Mandal

unread,
Jun 4, 2013, 12:43:51 PM6/4/13
to ang...@googlegroups.com

Zd

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Andy Joslin

unread,
Jun 4, 2013, 1:51:33 PM6/4/13
to ang...@googlegroups.com
Check the table in the docs for .expect() versus .when() - try .when, it is less strict.

Alexander Kohout

unread,
Jun 5, 2013, 3:17:44 AM6/5/13
to ang...@googlegroups.com
It does not work using whenPOST and it does not work using expectPOST :/

Any further suggestions? I am not able to test my services and controllers since there is a lot of XHR functionality..

Joshwa Fugett

unread,
Jun 5, 2013, 6:28:07 AM6/5/13
to ang...@googlegroups.com
If you're using the 1.1.x dev branches add $rootScope.$digest() to your tests to fire off the digest cycle. The interceptors where changed recently to be asynchronous. I believe it was 1.1.4 that the change was made.

Alexander Kohout

unread,
Jun 7, 2013, 4:15:38 AM6/7/13
to ang...@googlegroups.com
Great! That helped me out! 

But I can not understand why they don't update the documentation? Angular always promotes that the Testing stuff is an important part - and now it becomes non-obvious how to perform tests for XHR functionality.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/BXtFWLtKrGM/unsubscribe?hl=en-US.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.

Joshwa Fugett

unread,
Jun 7, 2013, 12:55:52 PM6/7/13
to ang...@googlegroups.com
Theres been a large number of complaints about this one. All I can say is that its the dev branch and a lot of things like that happen. Though it would be great if breaking changes like this were in the docs when they were released.

lo...@onemightyroar.com

unread,
Jul 26, 2013, 8:03:22 AM7/26/13
to ang...@googlegroups.com
I know i'm a little late to the party, but i just stumbled upon this error recently and was glad to find this post.  So thank you!  

In an effort to not put $rootScope.$digest() in all of my unit tests (where applicable) only to be removed later when angular-mocks is updated - I decided to pull in angular-mocks-unstable via bower. 

Pierre-Alexandre Piarulli

unread,
Sep 26, 2013, 8:14:57 AM9/26/13
to ang...@googlegroups.com
Great ! your save my life ! i was lost until i found this topic !
finally use unstable for a cleaner code.
Reply all
Reply to author
Forward
0 new messages