Angular에서 이벤트를 어떻게 테스트 할 수 있습니까?

Angular에서 이벤트를 어떻게 테스트 할 수 있습니까?

---

이벤트가 올바르게 생성되거나 브로드 캐스팅되는지 테스트하고 이벤트를 수동으로 트리거해야합니다.

이를 수행하는 가장 좋은 방법은 무엇입니까?

---

이벤트 발생 및 잡기에 대한 테스트가 필요한 경우 이것이 제가하는 방법입니다. 특정 이벤트가 발생 ( $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) 조금 더 쉽습니다. 그냥 얻을 $rootScope으로부터 inject기능과 다음 원하는 이벤트를 보냅니다.

$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을 참조 하십시오.

도움이 되었기를 바랍니다.

---

다음은 angular JS에서 $ broadcast 이벤트에 따라야 할 단계입니다.

주입하는 동안 아래와 같이 rootScope 및 범위 스텁을 초기화합니다.

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

컨트롤러가 생성되면 아래와 같이 rootScope를 사용하여 이벤트를 발생시킵니다.

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

---

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

참고URL : https://stackoverflow.com/questions/15272414/how-can-i-test-events-in-angular