7

我想开始为我的 angularjs 项目进行单元测试。这远非直截了当,我觉得这真的很难。我正在使用业力和茉莉花。对于测试我的路线和应用程序依赖项,我很好。但是您将如何测试这样的指令呢?

angular.module('person.directives', []).
directive("person", function() {
return {
    restrict: "E",
    templateUrl: "person/views/person.html",
    replace: true,
    scope: {
        myPerson: '='
    },
    link: function (scope, element, attrs) {

    }        
}

});

例如,我将如何测试是否找到了模板?

4

1 回答 1

15

这是要走的路https://github.com/vojtajina/ng-directive-testing

基本上,您使用beforeEach创建编译公开元素及其作用域,然后模拟作用域更改和事件处理程序,并查看代码是否做出反应并适当地更新元素和作用域。这是一个非常简单的例子。

假设:

scope: {
  myPerson: '='
},
link: function(scope, element, attr) {
  element.bind('click', function() {console.log('testes');
    scope.$apply('myPerson = "clicked"');
  });
}        

我们期望当用户点击带有指令的元素时,myPerson属性变为clicked. 这是我们需要测试的行为。所以我们将编译后的指令(绑定到一个元素)暴露给所有规范:

var elm, $scope;

beforeEach(module('myModule'));

beforeEach(inject(function($rootScope, $compile) {
  $scope = $rootScope.$new();
  elm = angular.element('<div t my-person="outsideModel"></div>');
  $compile(elm)($scope);
}));

然后你就断言:

it('should say hallo to the World', function() {
  expect($scope.outsideModel).toBeUndefined(); // scope starts undefined
  elm.click(); // but on click
  expect($scope.outsideModel).toBe('clicked'); // it become clicked
});

这里。你需要 jQuery 来进行这个测试,来模拟click().

于 2013-04-16T12:46:19.047 回答