AngularJS module NgMockE2E's passThrough() method doesn't work

285 views Asked by At

I have a sails, node-js application in angular-js and I decided to make some tests for it, especifycally in the backend part, for which I am using Jasmine and ngMockE2E tools, because I want to test it with some real server side data.

Here is a part of the code I want to test:

app.controller('IdentificationCtrl', function($scope, $rootScope, ... , ajax) {

    _initController = function() {
        $scope.loginData = {};
    };

    $scope.doLogin = function(form) {
        if (form.$valid) {
            ajax.sendApiRequest($scope.loginData, "POST", "session/login").then(
                function(response) {
                    //$state.go('app.dashboard');
                    window.localStorage.setItem("sesion", JSON.stringify(response.data));
                    $rootScope.userTest = response.data;
                },
                (function(error) {
                    console.log("error")
                })
            );
        }
    };

    _initController();

});

Here is my service.js file, in which I provide the ajax service:

angular.module('common.services', [])
.service('ajax', function($http, $rootScope) {

    if (window.location.hostname == "localhost") {
        var URL = "http://localhost:1349/";
    } else {
        var URL = "http://TheRealURL/";
    }

    this.sendApiRequest = function(data, type, method) {
        $rootScope.$broadcast('loading:show')
        if (method == "session/login" || method == "session/signup") {
            var authorization = "";
        } else {
            var authorization = JSON.parse(window.localStorage["sesion"]).id;
        }

        data_ajax = {
            url: URL + method,
            method: type,
            headers: {
                'Content-Type': 'text/plain',
                'authorization': authorization
            }
        }

        if (type === "GET" || type != "delete") {
            data_ajax.params = data;
        } else {
            data_ajax.data = data;
        }

        if (window.localStorage['admin-language']) {
            data_ajax.headers['accept-language'] = window.localStorage['admin-language'];
        } else {
            data_ajax.headers['accept-language'] = window.navigator.language.toUpperCase();
        }

        //The test arrives here perfectly
        return $http(data_ajax).success(function(data, status, headers, config) {
            //But does not enter here 
            return data;
            $rootScope.$broadcast('loading:hide')
        }).error(function(data, status, headers, config) {
            //Nor here
            return data;
            $rootScope.$broadcast('loading:hide')
        });
        //And finally achieves this point, but without making the http call
    }
})

Here is the html where I load Jasmine, ngMocks and the test file:

...
<!-- Testing files -->
<link rel="stylesheet" type="text/css" href="lib/jasmine-core/jasmine.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine-html.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/boot.min.js"></script>
<script type="text/javascript" src="lib/angular-mocks/angular-mocks.js"></script>
<script src="js/TestBackend.js"></script>
...

And here is the above referenced testBackend.js file, in which I intend to make the tests:

describe('FirstCycleController', function() {

beforeEach(module('myApp'));
beforeEach(module('ngMockE2E'));

var $controller;
var $rootScope;
var $httpBackend;

beforeEach(inject(function(_$controller_, _$rootScope_, _$httpBackend_) {

    $controller = _$controller_;
    $rootScope = _$rootScope_;
    $httpBackend = _$httpBackend_;
}));
    describe('User login', function() {
        it('verifys that a user is correctly logged.', inject(function() {
            var $identificationScope = {};
            var identificationController = $controller('IdentificationCtrl', { $scope: $identificationScope });

            var form = {
                $valid: true
            }

            $identificationScope.loginData = {
                email: '[email protected]',
                password: 'usertest'
            };

             $rootScope.userTest = null;

            //pass through everything
            $httpBackend.whenGET(/^\w+.*/).passThrough();
            $httpBackend.whenPOST(/^\w+.*/).passThrough();

            //call the login function simulating a login
            $identificationScope.doLogin({ $valid: true });

            setTimeout(function() {

                expect($rootScope.userTest).not.toBe(null);

            }, 150);
        }));
    });
});

The problem is that when running the testBackend.js test file, it doesn't make any http call. It seems that passThrough() function isn't doing his job correctly.

I faced and corrected the issue of not having defined the passThrough() function, which was because I didn't load the ngMockE2E module(instead of ngMock). But this time Jasmine is working fine and the error is simply that the spec is false:

Error: Expected null not to be null.

Apologies if this issue is already resolved, I couldn't find the solution anywhere.

1

There are 1 answers

0
sandyJoshi On

There is detailed discussion around this on angular github issue