具有注入依赖项的单元测试控制器答案

【问题标题】：Unit testing controller with injected dependencies具有注入依赖项的单元测试控制器
【发布时间】：2015-06-30 17:30:24
【问题描述】：

将依赖项注入我的最佳实践是什么？控制器测试？
什么时候可以使用module(function($provide){})？
如何正确检查 $state.go() 是否使用正确的参数调用？

example-controller.js

angular.module('myModule')
    .controller('ExampleCtrl', ['$state', 'ExampleService', 'exampleResolve',
      function($state, ExampleService, exampleResolve){
        var self = this;

        self.property = false;
        self.resolvedProperty = exampleResolve;

        self.submit = function() {
          ExampleService
            .exampleGet()
            .$promise
            .then(function(res) {
              $state.go('anotherView', { prop1: 'yay', prop2: 'again' });
            })
        };
      }]);

example-controller.test.js

   describe('Controller: ExampleCtrl', function() {
      beforeEach(module('myModule'));

      var ctrl,
          mockBackend,
          mockState;

      var mockExampleResolve = { test: 'Test' };

      // Provide any mocks needed
      // when do I provide mocks?
      beforeEach(function() {
        module(function($provide) {

        });
      });

      beforeEach(inject(function($controller, $httpBackend, exampleResolve, $state) {
        mockBackend = $httpBackend;
        mockState = $state;
        exampleResolve = mockExampleResolve;

        ctrl = $controller('ExampleCtrl');
      }));

      describe('initialization', function() {
        beforeEach(function() {});

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

        it('should initialize any view-model variables', function() {
          expect(ctrl.property).toBe('false');
          expect(ctrl.resolvedProperty).toEqual({test: 'Test'});
        });
      });

      describe('submit called', function() {
        beforeEach(function() {

        });

        it('should call state.go with the correct arguments', function() {
           // how do i check this?
        });

      });

    });

【问题讨论】：

用正确的参数调用是什么意思？

标签： angularjs unit-testing jasmine angular-ui-router karma-jasmine

【解决方案1】：

您可以使用 jasmine 中的 spyOn 方法来检查您的参数是否正确。

describe('Controller: ExampleCtrl', function() {
      beforeEach(module('myModule'));

      var ctrl,
          mockBackend,
          mockState;

      var mockExampleResolve = { test: 'Test' };

      // Provide any mocks needed
      // when do I provide mocks?
      beforeEach(function() {
        module(function($provide) {

        });
      });

      beforeEach(inject(function($controller, $httpBackend, exampleResolve, $state) {
        mockBackend = $httpBackend;
        mockState = $state;
        spyOn($state,'go');
        exampleResolve = mockExampleResolve;

        ctrl = $controller('ExampleCtrl');
      }));

      describe('initialization', function() {
        beforeEach(function() {});

        it('should exist', function() {
          expect(!!ctrl).toBe(true);
//Here you can pass your param and state
          expect($state.go).toHaveBeenCalledWith('anotherView', { prop1: 'yay', prop2: 'again' }); 
        });

        it('should initialize any view-model variables', function() {
          expect(ctrl.property).toBe('false');
          expect(ctrl.resolvedProperty).toEqual({test: 'Test'});
        });
      });

      describe('submit called', function() {
        beforeEach(function() {

        });

        it('should call state.go with the correct arguments', function() {
           // how do i check this?
        });

      });

    });

【讨论】：