Jasmine testing an Angular Controller

angularAppController.js

(function() {

    'use strict';

    angular
            .module("app.component.eventLog")
            .controller('EventsCtrl', EventsCtrl);

    /**
     * @ngdoc controller
     * @name app.component.controllers:EventsCtrl
     *
     *
     * @requires $state
     * @requires app.component.services:eventService
     *
     * @description
     * #Controller for Events Viewing.
     * This controller handles the list and the details of the events.
     **/
    AcmfEventsCtrl.$inject = ['$state', '$q', 'eventService'];
    function AcmfEventsCtrl($state, $q, eventService) {
        var vm = this;

        vm.listDetail = "list";
        vm.events = [];
        vm.parameters = [];
        vm.reason = "";
        vm.eventOrder = "time.utc_timestamp";
        vm.viewDetails = viewEventDetails;
        vm.backToList = backToList;
        vm.activate = activate;

        vm.pagination = {
            pageSize: 10,
            events: {
                currentPage: 0,
                totalPages: function() {
                    return Math.ceil(vm.events.length / vm.pagination.pageSize);
                }
            },
            parameters: {
                currentPage: 0,
                totalPages: function() {
                    return Math.ceil(vm.parameters.length / vm.pagination.pageSize);
                }
            }
        };


        vm.activate();

////////////////////////////


        /**
         * @ngdoc function
         * @name app.component.controllers:EventsCtrl#activate
         * @methodOf app.component.controllers:EventsCtrl
         *
         * @description
         * initialization of controller
         * loads the event list into vm.events
         *
         **/
        function activate() {
            // evert time the controller is reloaded (via a route change) the cache is cleared
            eventService.clearCachedParams();

            eventService.getFullEventList()
                    .then(
                            function(events) {
                                vm.events = events;
                            },
                            function(failure) {
                                vm.message = "There was a problem retrieving event data.";
                            });
        }

        /**
         * @ngdoc function
         * @name app.component.controllers:EventsCtrl#viewDetails
         * @methodOf app.component.controllers:EventsCtrl
         *
         * @description
         * Gets Event Details
         *
         * @param {object} event The event object that we want more details of.
         **/
        function viewEventDetails(event) {
            vm.listDetail = "details";
            $state.go('acmf.event-log.detail', {eventId: event.id});
            vm.eventName = event.name;
            eventService.getFullParamInfo(event)
                    .then(function(data) {
                        vm.parameters = data;
                        vm.reason = "";
                    }, function(error) {
                        vm.reason = error.reason;
                    });
        }

        /**
         * @ngdoc function
         * @name app.component.controllers:EventsCtrl#backToList
         * @methodOf app.component.controllers:EventsCtrl
         *
         * @description
         * Resets values to the list state
         **/
        function backToList() {
            vm.listDetail = "list";
            $state.go('acmf.event-log');
            vm.parameters = [];
        }
    }
})();

angularAppController.spec.js

(function() {
    'use strict';
    describe('Events Controller', function() {

        var ctrl;
        var $controller;
        var $state;
        var $timeout;
        var $q;
        var $httpBackend;
        var eventService;

        // Mock Event
        var event = {
            id: 100,
            name: "Event 100",
            time: {
                actual_timestamp: 1404241200000,
                onboard_timestamp: 1404226800000
            }
        };
        var returnedEventsList = [{id: 1, name: "event1"}, {id: 2, name: "event2"}];
        var returnedEventData = {};
        var returnedEventInfo = [{"id": 1, "name": "e_a429octlbl"}, {"id": 2, "name": "e_a429parity"}];

        var eventServiceMock = {
            getFullEventList: getFullEventList,
            getFullEventListFailure: getFullEventListFailure,
            getEventData: getEventData,
            getEventDataFailure: getEventDataFailure,
            getEventInfo: getEventInfo,
            getEventInfoFailure: getEventInfoFailure,
            getFullParamInfo: getFullParamInfo,
            getFullParamInfoFailure: getFullParamInfoFailure
        };


        beforeEach(function() {
            // load the app module
            module('app');


            inject(function(_$controller_, _$state_, _$q_, _$timeout_, _$httpBackend_, _eventService_) {
                $controller = _$controller_;
                $state = _$state_;
                $q = _$q_;
                $timeout = _$timeout_;
                $httpBackend = _$httpBackend_;
                eventService = _eventService_;
            });
        });

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

        describe("Events Log", function() {
            describe("with successful returns", function() {
                beforeEach(function() {
                    spyOn($state, "go");
                    spyOn(eventService, "getFullEventList")
                            .andCallFake(eventServiceMock.getFullEventList);
                    spyOn(eventService, "getEventData")
                            .andCallFake(eventServiceMock.getEventData);
                    spyOn(eventService, "getFullParamInfo")
                            .andCallFake(eventServiceMock.getFullParamInfo);

                    // set up the controller
                    ctrl = $controller('EventsCtrl', {});
                    // resolve the promises in the controller activate method
                    $timeout.flush();
                });

                it('should call activate', function() {
                    /*
                     * I don't know how to spyOn the activate method, this just tests to see if the getFullEventList
                     * was called during init.
                     */
                    expect(eventService.getFullEventList).toHaveBeenCalled();
                });

                it('should populate the vm.events with the returned events', function() {
                    expect(ctrl.events).toBe(returnedEventsList);
                });

                it('should default to the events list', function() {
                    expect(ctrl.listDetail).toBe("list");
                });
                it('should switch to the details view when viewDetails is called', function() {
                    ctrl.viewDetails(event);
                    expect(ctrl.listDetail).toBe("details");
                });
                it('should update the title/event name from the Event passed to viewDetails', function() {
                    ctrl.viewDetails(event);
                    expect(ctrl.eventName).toBe("Event 100");
                });
                it('should change the URL/$state when an event is clicked', function() {
                    ctrl.viewDetails(event);
                    expect($state.go).toHaveBeenCalled();
                });
            });
            describe("with failed returns", function() {
                beforeEach(function() {
                    spyOn($state, "go");
                    spyOn(eventService, "getFullEventList")
                            .andCallFake(eventServiceMock.getFullEventListFailure);

                    // set up the controller
                    ctrl = $controller('EventsCtrl', {});
                    // resolve the promises in the controller activate method
                    $timeout.flush();
                });
                it('should put an error message into the vm message', function() {
                    expect(ctrl.message).toBe("There was a problem retrieving event data.");
                });

            });
        });

        describe("Event Parameters", function() {
            describe("with successful returns", function() {

                beforeEach(function() {
                    spyOn($state, "go");
                    spyOn(eventService, "getFullEventList")
                            .andCallFake(eventServiceMock.getFullEventList);
                    spyOn(eventService, "getEventData")
                            .andCallFake(eventServiceMock.getEventData);
                    spyOn(eventService, "getEventInfo")
                            .andCallFake(eventServiceMock.getEventInfo);
                    spyOn(eventService, "getFullParamInfo")
                            .andCallFake(eventServiceMock.getFullParamInfo);

                    // set up the controller
                    ctrl = $controller('EventsCtrl', {});
                    // resolve the promises in the controller activate method
                    $timeout.flush();
                });

                it('should switch back to the events list when backToList is called', function() {
                    ctrl.viewDetails(event);
                    $timeout.flush();
                    ctrl.backToList();
                    expect(ctrl.listDetail).toBe('list');
                });
                it('should change the URL/$state when backToList is called', function() {
                    ctrl.viewDetails(event);
                    $timeout.flush();
                    ctrl.backToList();
                    expect($state.go).toHaveBeenCalled();
                });

                it('should clear out the parameters array when returning to list', function() {
                    ctrl.viewDetails(event);
                    $timeout.flush();
                    ctrl.backToList();
                    expect(ctrl.parameters).toEqual([]);
                });

            });
            describe("with unsuccessful returns", function() {

                beforeEach(function() {
                    spyOn($state, "go");
                    spyOn(eventService, "getFullEventList")
                            .andCallFake(eventServiceMock.getFullEventListFailure);
                    spyOn(eventService, "getEventData")
                            .andCallFake(eventServiceMock.getEventDataFailure);
                    spyOn(eventService, "getEventInfo")
                            .andCallFake(eventServiceMock.getEventInfoFailure);
                    spyOn(eventService, "getFullParamInfo")
                            .andCallFake(eventServiceMock.getFullParamInfoFailure);

                    // set up the controller
                    ctrl = $controller('EventsCtrl', {});
                    // resolve the promises in the controller activate method
                    $timeout.flush();
                });
                it('should return a message if the event has no parameters to display', function() {
                    ctrl.viewDetails(event);
                    $timeout.flush();
                    expect(ctrl.reason).toBe("massive failure");
                });
            });

        });

        function getFullEventList() {
            var dfd = $q.defer();
            dfd.resolve(returnedEventsList);
            return dfd.promise;
        }
        function getFullEventListFailure() {
            var dfd = $q.defer();
            dfd.reject(false);
            return dfd.promise;
        }

        function getEventData() {
            var dfd = $q.defer();
            dfd.resolve(returnedEventData);
            return dfd.promise;
        }
        function getEventDataFailure() {
            var dfd = $q.defer();
            dfd.reject({reason: "massive failure"});
            return dfd.promise;
        }
        function getEventInfo() {
            var dfd = $q.defer();
            dfd.resolve(returnedEventInfo);
            return dfd.promise;
        }
        function getEventInfoFailure() {
            var dfd = $q.defer();
            dfd.reject({reason: "massive failure"});
            return dfd.promise;
        }
        function getFullParamInfo() {
            var dfd = $q.defer();
            dfd.resolve();
            return dfd.promise;
        }
        function getFullParamInfoFailure() {
            var dfd = $q.defer();
            dfd.reject({reason: "massive failure"});
            return dfd.promise;
        }
    });
})();