javascriptangularjsunit-testingkarma-jasminehttpbackend

unable to mock $httpbackend whenPOST for Jasmine-karma


I am using angular js and I have a controller.js for which I want to write jasmine test case. I am able to call the function of controller in my testcase. There is a local function in my controller which is called by method in scope (for which I am writing test case) which have is calling a service method with ajax request.

I am not able to mock this http post request in my test case using $httpbackend

(function () {
    'use strict';
    angular
        .module('coApp')
        .controller('NewController', [
        '$http',
        '$q',
        '$log',
        '$modal',
        '$scope',
        'AgentDataLoader',
        '$timeout',
        NewController]);

    function NewController ($http, $q, $log, $modal, $scope,  $state, $rootScope, $filter, AgentDataLoader, $timeout) {

        //Some variables declarations

        //some methods 
        function myMethod($filter, a, b) {
            console.log("inside myMethod");
            if (angular.isDefined(a) && angular.isDefined(b)) {
                console.log("inside if ");
                console.log("a:: "+a);
                console.log("b:: "+b);

                dataLoader.callPOST(a, b)
                    .then(function (data) {
                    console.log("Data from service :: "+JSON.stringify(data));
                    /**calling some directive and methods 
                       I am unable to execute this since I am unable to mock http Post of above mentioned dataLoader
                    **/

                console.log("after http request");
            } else {
                //some other logic
            }
        }



        $scope.methodToBeTested= function (randomData) {
            console.log("selectedSystems called ****** ");
            //some logic
myMethod($filter, $scope.a, $scope.b);

        };
})();

My Jasmine test suite

describe('NewController',function(){
    var ctrl, scope, $httpBackend, $compile, parameters;
    beforeAll(function (done) {

    });    


    beforeEach(function () {
        module('MYmODULE');
        module('myServiceModule');
    });

    beforeEach(inject(function ($controller, _$httpBackend_, $rootScope, _$compile_) {
        scope=$rootScope.$new();
        $compile = _$compile_;
        $httpBackend = _$httpBackend_;
        ctrl=$controller('NewController',{$scope: scope});
        // Start listening to xhr requests

        //This data i want to send as a success of httpBackEnd Post
        success.data = JsonData;

        console.log('Setting request in $httpBackend');

        //Not working
        $httpBackend.whenPOST('/abc/efg').success(function(method, url, data) {
            console.log("Getting sample data from httpBackend :: "+url);
            return [200, success.data, {}];
        }); 

        //Not working
        $httpBackend.whenPOST('abc/efg').respond(function(method, url, data, headers){
            console.log('Received these data:', method, url, data, headers);
            phones.push(angular.fromJson(data));
            return [200, {}, {}];
        });

        $httpBackend.flush();    
    }));

    it("Testing myMethodToBeTested of the page", function(){ 
        scope.randomData=someRandomData;
        expect(scope.methodToBeTested(scope.randomData));

        //Tried this also not working
        $httpBackend.expectPOST('/abc/efg').respond(success.data);

        afterEach(function () {   
    });
});

Solution

  • For you Testcase Suit you have to mock the response data. i think in the above code i dont see the success variable is initalized anywhere. So if you want to get the expected response you have to assign the expected object in Success variable(based on the above posted code) like Ex:

    var Success = {data:{SomeKey:"value"}}
    

    Now you have to pass this variable in the POST/GET Request. Like

    $httpBackend.expectPOST('/abc/efg').respond(Success.data);
    

    Hope this helps :)