title: Angular - Unit Testing Modal Factory Call
body: <p>I'm trying to verify that a factory function is called from within a modal function, if passed a valid file object. The factory is injected into the modal controller and when the test is run the factory is undefined. What is the proper way to test that a factory function is called from within a modal?</p>
  
  <p><strong><em>modal controller</em></strong></p>
  
  <pre><code>  angular.module('vicModule')
    .controller('vicModalController', vicModalController);
  
    vicModalController.$inject = [
      '$uibModalInstance',
      '$uibModal',
      'utilFunctionsFactory'
    ]
  
    function vicModalController($uibModalInstance, $uibModal, utilFunctionsFactory) {
      mvm.uploadVICs = uploadVICs;
  
      function uploadVICs(file, error) {
        if (file == null) {
          data.errorMessage = 'file is not found or not supported';
          return;
        }
        if(error.length &gt; 0) {
          $uibModalInstance.close();
          data.errorMessage = 'reading file error';
          return;
        } else {
          var fileData = utilFunctionsFactory.validateCSV(file, error);
        }
      }
    }
  </code></pre>
  
  <p><strong><em>modal controller test</em></strong></p>
  
  <pre><code>describe('vicModalController', function() {
    var $controller, vicModalController, vicFactory, utilFunctionsFactory, $q, $scope, $httpBackend, deferred, $uibModalInstance;
    beforeEach(module('fotaAdminPortal'));
    beforeEach(module('vicModule'));
    beforeEach(inject(function(_$controller_, _vicFactory_, _utilFunctionsFactory_, _$q_, _$rootScope_, _$httpBackend_) {
      $controller = _$controller_;
      vicFactory = _vicFactory_;
      utilFunctionsFactory: _utilFunctionsFactory_;
      $q = _$q_;
      $rootScope = _$rootScope_;
      $scope = $rootScope.$new();
      $httpBackend = _$httpBackend_;
      $uibModalInstance = { // Create a mock object using spies
        close: jasmine.createSpy('modalInstance.close'),
        dismiss: jasmine.createSpy('modalInstance.dismiss'),
        result: {
          then: jasmine.createSpy('modalInstance.result.then')
        }
      };
      vicModalController = $controller('vicModalController', {
        vicFactory: vicFactory,
        utilFunctionsFactory: utilFunctionsFactory,
        $uibModalInstance: $uibModalInstance
      });
    }));
    it('should be defined', function() {
      expect(vicModalController).toBeDefined();
    });
    describe('uploadVICS()', function() {
      beforeEach(inject(function(_utilFunctionsFactory_) {
        utilFunctionsFactory = _utilFunctionsFactory_;
        spyOn(utilFunctionsFactory, 'validateCSV').and.callFake(function() {
          return {};
        });
      }));
      it('should call validateCSV() with valid file', function() {
        vicModalController.uploadVICs({}, []);
        expect(utilFunctionsFactory.validateCSV()).toHaveBeenCalledWith({}, []);
      });
    });
  });
  </code></pre>
  
  <p><strong><em>edit</em></strong></p>
  
  <p>I had the assignment wrong in the beforeEach:</p>
  
  <p>utilFunctionsFactory: <em>utilFunctionsFactory</em>; //incorrect colon
  utilFunctionsFactory = <em>utilFunctionsFactory</em>; // should be assigned</p>