programing

각도로 이벤트를 테스트하려면 어떻게 해야 합니까?

madecode 2023. 3. 14. 22:02
반응형

각도로 이벤트를 테스트하려면 어떻게 해야 합니까?

이벤트가 올바르게 송신되거나 방송되는 것을 테스트하고 수동으로 이벤트를 트리거해야 합니다.

어떻게 하면 좋을까요?

이벤트 사격과 포획에 대한 테스트가 필요하다면 이렇게 하죠특정 이벤트가 발생하는지 확인합니다($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 를 참조해 주세요.

다음은 각도 JS에서 $broadcast 이벤트를 수행하기 위해 따라야 할 단계입니다.

주입 중에 다음과 같이 rootScope와 스코프 stub을 초기화합니다.

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

반응형