Angular mock $httpBackend give No pending request to flush

Question

Following the official guide at angularJS $httpBackend I'll do this test, but Karma give me this error: Error: No pending request to flush ! at Function.$httpBackend.flush

Test

'use strict';

describe('profileCtrl', function () {
var scope, $httpBackend;

beforeEach(angular.mock.module('maap'));
beforeEach(angular.mock.inject(function($rootScope, $controller, _$httpBackend_){

    $httpBackend = _$httpBackend_;
    $httpBackend.when('GET', 'profile').respond([{id: 1, name: 'Bob'}]);
    scope = $rootScope.$new();
    $controller('profileCtrl', {$scope: scope});
}))

it('should fetch list of users', function(){
    $httpBackend.flush();
    expectGET(scope.current_user.length).toBe(1);
    expect(scope.current_user[0].name).toBe('Bob');
});

});

for this simple controller:

'use strict';

 angular.module('maap').controller('profileCtrl', function($scope, UserService) {

$scope.current_user = UserService.details(0);

});

Timothée Jeannin · Accepted Answer · 2014-03-06T15:06:05.243

The _$httpBackend_ has nothing to flush because you don't make any http request in your test.

You need to invoke some code that make an http request.

Then, once something somewhere made an http request in your test, you can call the flush method so that a response is provided for the request that has been made.

Something like:

it('should fetch list of users', function(){

    // Do something that will make an http request
    MyService.getAllUser(function ...) // for example

    // Then provide a response for the http request that 
    // has been made when getAllUser was called
    $httpBackend.flush();

    // Check the expected result.
    expect(something).toBe('Bob');
});

score 12 · Answer 2 · answered Nov 25 '15 at 20:59

12

Same issue happened to me and the problem was not that I was not making a request but because the request I was making was different to the expected one:

For example I have defined this expectation:

mockBackend.expectGET("http://myapi.com/001").respond("RESULT");

And I was requesting this other URL:

http://myapi.com/002

Very confusing error message, no really easily related with the underneath problem.

answered Nov 25 '15 at 20:59

fguillen

36,125
23
149
210

same issue here but I can't guess the url I'm requesting. How do you know it? There are a way to show on logs or something? – Ruben Jan 19 '17 at 18:07
Thanks for this, I was trying to figure out why my code wasn't making an http request when it obviously should have been. Turns out I just had a typo in the `expectPOST` url. – Jack Ryan Feb 20 '18 at 22:00

Andrew Craswell · Answer 3 · 2017-07-02T07:25:48.533

1

I had the same issue, because I neglected to define a response for each expected request. With no response, there becomes nothing to flush. Also the http promise would never resolve or fail.

edited Jul 02 '17 at 07:25

answered Aug 23 '16 at 19:58

Andrew Craswell

674
1
6
17

score 0 · Answer 4 · answered Jan 17 '18 at 13:08

0

I've got the same exception because I used ngMockE2E module instead of ngMock module. Even calling $rootScope.$digest() didn't help.

answered Jan 17 '18 at 13:08

Daniil Iaitskov

5,525
8
39
49

score 0 · Answer 5 · edited Jul 04 '21 at 18:34

0

Maybe you are not using $http AngularJs service in your ajax call.

I happened to me where I expected $httpBackend to flush something, but I got an error:

Error: No pending request to flush !

so after a long investigation I found out that the ajax was written in jQuery instead of $http

So just make sure that you use $http service for your Ajax calls.

edited Jul 04 '21 at 18:34

marc_s

732,580
175
1,330
1,459

answered Jun 30 '21 at 14:38

Basheer AL-MOMANI

14,473
9
96
92

Angular mock $httpBackend give No pending request to flush

5 Answers5

Linked