1

I'm using jasmine framework on karma test running platform. I'm completely new to testing API's. So, according to my initial plan, I need to test $response with $httpBackend. Whenever I run test, it fails. And Webstorm highlights for some reason $httpBackend native methods, like:

$httpBackend.verifyNoOutstandingRequest (); or $httpBackend.expectGET();

But it doesn't have problems with $httpBackend.flush() function. Does anybody know what can be the problem? I've bolded spots that webstorm highlights as "Unresolved functions".

Here is the snippet of my $response:

angular.module('myApp')
.factory('UserMetric', function ($resource, DateUtils,HOST) {
    return $resource(HOST+'api/v1/plans/:id', {}, {
        'query': { method: 'GET', isArray: true},
        'get': {
            method: 'GET',
            transformResponse: function (data) {
                data = angular.fromJson(data);
                return data;
            }
        },
        'update': { method:'PUT' }
    });
});

Here is the snippet from my controller:

angular.module('myApp').controller('PlanController', function ($rootScope, $scope, UserMetric, $state) { 
$scope.pls = [];
$scope.plsNames = [];

$scope.load = function () {
    $scope.pls = [];
    $scope.plsNames = [];
    UserMetric.query(function (result, headers) {
        for (var i = 0; i < result.length; i++) {
            $scope.pls.push(result[i]);
            $scope.plsNames.push(result[i].label)
        }

    });

};
$scope.load();

$scope.delete = function (item) {
    UserMetric.delete({id: item.id}, function () {
        $scope.load();
    });
};
}

And here is my test itself:

describe('Controller: PlanController', function() {
 beforeEach(module('myApp'));
beforeEach(module('ui.router'));

var ctrl, scope, mockUserMetric, $httpBackend;

beforeEach(inject(function(_$controller_, _$rootScope_, $injector, _UserMetric_, _$httpBackend_) {
    scope = _$rootScope_.$new();
    $httpBackend = _$httpBackend_;
    mockUserMetric = _UserMetric_;

    ctrl = _$controller_('PlanController', {
       $scope: scope
    });
}));

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

it('Unit test remove plans function in home page', inject(function(UserMetric) {

    $httpBackend.expectGET('http://localhost:8083/api/v1/plans')
        .respond(200, [
            {label: 'first', id: 1},
            {label: 'second', id: 2}
        ]);
    var pls = UserMetric.query();
    expect(pls.length).toBe(0);

    $httpBackend.flush();

    expect(pls.length).toBe(2);



}));
});

Thank you for help in advance.

  • And nobody answered... Pity, I've held a hope on stackoverflow community. Disappointment can be compared with disappointment when you learn that Santa doesn't exist... – George Stain Feb 02 '17 at 16:10
  • I experience the same issue in WebStorm 2016.3.4. – Wilgert Mar 14 '17 at 08:49

1 Answers1

1

you need to add angular-mocks from TypeScript Community stubs.

$httpBackend.expectGET/DELETE/... are not part of standard angular. Its in ngMockE2E

See this thread - how to add TypeScript Community stubs

Community
  • 1
  • 1
Sava Jcript
  • 384
  • 2
  • 5