单元测试指令Click事件基于范围值

Question

我有一个指令属性，传递价值，并基于价值的行动：

define(function() { 
'use strict'; 

var myDirective = function ($rootScope, myFactory) { 
    return { 
     restrict: 'A', 
     scope: { 
      _myValue : '=value' 
     }, 
     link: function(scope, element, attrs) { 
      element.bind('click', function() { 
       if (scope._myValue === 'red') { 
        myFactory.red(); 
       } 
       if (scope._myValue === 'green') { 
        myFactory.green(); 
       } 
       if (scope._myValue === 'black') { 
        myFactory.black(); 
       } 
      }); 
     } 
    }; 
}; 

return ['$rootScope', 'myFactory', myDirective]; 
}); 

HTML：

<a my-directive value="\'red\'"></a> 

单元测试：

define(['angular-mocks'], function() { 
'use strict'; 

var angular = require('angular'); 

describe('<-- Directive Spec ------>', function() { 

    var scope, $compile, element; 

    beforeEach(angular.mock.module('myApp')); 

    beforeEach(inject(['$rootScope', '$compile', function (_$rootScope_, _$compile_) { 
     scope = _$rootScope_.$new(); 
     $compile = _$compile_; 

     var html = '<a my-directive value="\'red\'"></a>'; 
     element = $compile(angular.element(html))(scope); 
     scope.$digest(); 

    }])); 

    it('should be red and call myFactory.red', function() { 
     element.click(); 
    }); 

---

UPDATE：

define(['angular-mocks'], function() { 
'use strict'; 

var angular = require('angular'); 

describe('<-- Directive Spec ------>', function() { 

    var scope, $compile, element, myFactory; 

    beforeEach(angular.mock.module('myApp')); 

    beforeEach(inject(['$rootScope', '$compile', function (_$rootScope_, _$compile_, _myFactory_) { 
     scope = _$rootScope_.$new(); 
     $compile = _$compile_; 

     var html = '<a my-directive value="\'red\'"></a>'; 
     myFactory = _myFactory_; 
     spyOn(myFactory , 'red'); 
     element = $compile(angular.element(html))(scope); 
     scope.$digest(); 

    }])); 

    it('should be red and call myFactory.red', function() { 
     expect(myFactory.red).toHaveBeenCalled(); 
    }); 

试过以上，并得到错误：

Error: spyOn could not find an object to spy upon for red() 

厂例子：

define(['require', 'angular'], function (require, angular) { 
    'use strict'; 

    var myFactory = function() {  

     return { 
      red: function() { 
       console.log('red'); 
      }, 
      green: function() { 
       console.log('green'); 
      }, 
      black: function() { 
       console.log('black'); 
      } 
     }; 
    }; 

    return myFactory; 
}); 

Answer 1

我将在beforeEach增加了一个间谍就像这样：

spyOn(myFactory, 'red'); 

然后检查我f它被称为：

expect(myFactory.red).toHaveBeenCalled(); 

当然，你必须注入myFactory。