Resource factory and unit test

unit testing a service with dependence to $resource. AngulaJS, $resource, factory, Jasmine, httpBackend mock.

by klode

HTML

<script src="http://pivotal.github.io/jasmine/lib/jasmine-1.3.1/jasmine.js"></script>
<script src="http://pivotal.github.io/jasmine/lib/jasmine-1.3.1/jasmine-html.js"></script>
<link rel="stylesheet" href="http://pivotal.github.io/jasmine/lib/jasmine-1.3.1/jasmine.css">
<script src="http://code.angularjs.org/1.0.5/angular.js"></script>
<script src="http://code.angularjs.org/1.0.5/angular-mocks.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.min.js"></script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    
    <head>
        <title>Jasmine Spec Runner</title>
        <script type="text/javascript">
            (function() {
                var jasmineEnv = jasmine.getEnv();
                jasmineEnv.updateInterval = 1000;

                var htmlReporter = new jasmine.HtmlReporter();

                jasmineEnv.addReporter(htmlReporter);

                jasmineEnv.specFilter = function(spec) {
                    return htmlReporter.specFilter(spec);
                };

                var currentWindowOnload = window.onload;

                window.onload = function() {
                    if (currentWindowOnload) {
                        currentWindowOnload();
                    }
                    execJasmine();
                };

                function execJasmine() {
                    jasmineEnv.execute();
                }

            })();
        </script>
    </head>
    
    <body></body>

</html>

JavaScript

var app = angular.module('example', ['ngResource']);

app.factory('User', function ($resource) {
    return $resource('/user/:id', 
                     {'id': '@id'}, 
                     {'action1': {'method': 'POST','params': {'berlet': true}}}
    );
});


describe('User Service: ', function () {
    var user, $httpBackend;

    beforeEach(module('example'));

    beforeEach(function () {
        // inject the mock for the http backend
        inject(function (_$httpBackend_) {
            $httpBackend = _$httpBackend_;
        });

        // inject the service to be tested
        inject(function (_User_) {
            user = _User_;
        });
    });

    it('should exist', function () {
        expect( !! user ).toBe(true);
    });

    it('query() should return all users', function () {
        // a list of users
        var refUsers = [{
            id: 1,
            name: 'John'
        }, {
            id: 2,
            name: 'Oliver'
        }]

        // mock the response to a particular get request
        $httpBackend.whenGET('/user').respond(refUsers);

        // send request to get all the users
        var listOfUsers = user.query();

        // flush the pending resuest
        $httpBackend.flush();
        // test response result
        expect(JSON.stringify(listOfUsers)).toBe(JSON.stringify(refUsers));
    });

    it('get({id: 1}) should return the user with id=1', function () {
        // a list of users
        var refUsers = [{
            id: 1,
            name: 'John'
        }, {
            id: 2,
            name: 'Oliver'
        }]

        // mock the response to a particular get request
        $httpBackend.whenGET('/user/1').respond(refUsers[0]);
        
        //request the user with id = 1
        var theUser = user.get({ 
                id: 1
            });
        // flush httpBackend 
        $httpBackend.flush();
        // test response result
       ...