$ event.stopPropagation不是Angularjs单元测试中的函数错误

时间:2014-10-22 16:23:13

标签: javascript angularjs unit-testing jasmine

我正在尝试对绑定到ngClick指令的函数进行单元测试。它现在看起来像这样,因为我们刚刚开始这个项目,在我到达远方之前我想要一些测试覆盖:

vm.open = function($event) {
            $event.preventDefault();
            $event.stopPropagation();
            vm.opened = true;   
        };

我是这样的单元测试:

describe('Unit: simpleSearchController', function(){
//include main module
beforeEach(module('myApp'));
var ctrl, scope, event ;
// inject the $controller and $rootScope services
// in the beforeEach block
beforeEach(inject(function($controller, $rootScope){
    // Create a new scope that's a child of the $rootScope
    scope = $rootScope.$new();
    // Create the controller and alias access using controllerAs
    ctrl = $controller('simpleSearchController as vm', {
        $scope: scope
    });
}));
// unit tests
it('should set vm.opened to true', function(){
    event = scope.$broadcast("click");
    expect(event).toBeDefined();
    scope.vm.open(event);
    expect(event.defaultPrevented).toBeTruthy();
    expect(scope.vm.opened).toBeTruthy();
});
});

当Karma运行测试时,我收到此错误:

TypeError: $event.stopPropagation is not a function. 

有什么想法吗?

2 个答案:

答案 0 :(得分:9)

您的问题是 $broadcasted 事件没有stopPropagation方法。广播向下传播和停止传播(在 $emit 中可用)用于防止进一步向上传播。所以你有2个选择。

使用$emit

  it('should set vm.opened to true', function(){
        event = scope.$emit("click");
        expect(event).toBeDefined();
        scope.vm.open(event);
        expect(event.defaultPrevented).toBeTruthy();
        expect(scope.vm.opened).toBeTruthy();
  });

或者只是为事件创建一个模拟对象。

  it('should set vm.opened to true', function(){
            event = jasmine.createSpyObj('event', ['preventDefault', 'stopPropagation']);
            scope.vm.open(event);
            expect(event.preventDefault).toHaveBeenCalled();
            expect(scope.vm.opened).toBeTruthy();
      });

另请注意,您确实不需要测试expect(event.defaultPrevented).toBeTruthy();expect(event).toBeDefined();,因为这是在调用preventDefault且已经过测试时的核心角度功能。

答案 1 :(得分:0)

代替使用stopPropagation(),您可以使用return false。 stopPropagation是一个jQuery方法,因此它应该用在jQuery对象上。

这应该会产生相同的效果:

vm.open = function($event) {            
        vm.opened = true;   
        return false
    };