如何测试在角事件?(How can I test events in angular?)

2019-07-21 03:25发布

我需要测试的事件得到正确发出或广播,手动触发事件。

什么是做到这一点的最好方法是什么?

Answer 1:

如果你只是需要对事件触发和捕捉一些测试,这是我要做的事。 为了确保某个事件被解雇( $emit -ed或$broadcast -ed),间谍是要走的路。 你需要将被调用范围参考$emit$broadcast ,然后只是做这样的事情:

spyOn(scope, "$emit")
//run code to test
expect(scope.$emit).toHaveBeenCalledWith("MY_EVENT_ID", other, possible, args);

如果你不需要或不想要担心与传递的参数$emit ,你可以把一个$on$rootScope并设置一个标志,知道事件被发出。 事情是这样的:

var eventEmitted = false;
$rootScope.$on("MY_EVENT_ID", function() {
   eventEmitted = true;
});
//run code to test
expect(eventEmitted).toBe(true);

为了测试功能,运行时的事件被捕获( $on ),这是一个更容易一些。 刚刚得到一个$rootScopeinject功能,然后发送所需的事件。

$rootScope.$broadcast("EVENT_TO_TEST", other, possible, args);
//expects for event here

现在,我想这个事件处理将在指令或控制器(或两者)来发生的有关设置指令测试,看https://github.com/vojtajina/ng-directive-testing 。 有关设置控制器测试,看https://github.com/angular/angular-phonecat/blob/master/test/unit/controllersSpec.js#L27

希望这可以帮助。



Answer 2:

下面是步骤,您应该遵循$的角度JS广播事件

虽然inijecting初始化rootScope和范围存根,如下所示:

var rootScope;
var scopeStub = beforeEach(function() {
    inject(function($rootScope, _$controller_) {
        rootScope = $rootScope;
        scopeStub = $rootScope.$new();
        $controller = _$controller_;
    });
});

之后控制器创建使用rootScope像下面加薪事件:

rootScope.$broadcast('eventName', parameter1);


Answer 3:

我们利用这个sintax为A1

=========== Controller ========
    var vm = this;
    $scope.$on('myEvent', function(event, data){
        console.log('event number', data.id);
    });
============ Test =============
 it('should throw myEvent', function() {
    var data = {};
    $scope.$broadcast('myEvent', {id:1});
    $scope.$broadcast('myEvent', {id:2});
    $scope.$broadcast('myEvent', {id:3});
});

============ Output ============
Chrome LOG: '--------------------------------------------'
Chrome LOG: 'event number', 1
Chrome LOG: 'event number', 2
Chrome LOG: 'event number', 3


文章来源: How can I test events in angular?