Hoe kan ik gebeurtenissen in een hoek testen?

Ik moet testen of gebeurtenissen correct worden uitgezonden of uitgezonden, en gebeurtenissen handmatig activeren.

Wat is de beste manier om dit te doen?


Antwoord 1, autoriteit 100%

Als je gewoon wat tests nodig hebt voor het afvuren en vangen van evenementen, dan is dit hoe ik het doe. Om ervoor te zorgen dat een bepaalde gebeurtenis wordt afgevuurd ($emit-ed of $broadcast-ed), is een spion de juiste keuze. Je hebt een verwijzing nodig naar het bereik dat de $emitof $broadcastzal aanroepen, en dan gewoon zoiets als dit te doen:

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

Als u zich geen zorgen hoeft of wilt maken over de argumenten die worden doorgegeven met de $emit, kunt u een $onop de $rootScopeen stel een vlag in om te weten dat de gebeurtenis is uitgezonden. Zoiets als dit:

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

Voor het testen van functionaliteit die wordt uitgevoerd wanneer een gebeurtenis wordt gedetecteerd ($on), is het iets eenvoudiger. Haal gewoon een $rootScopevan de functie injecten verzend vervolgens de gewenste gebeurtenis.

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

Ik stel me nu voor dat deze gebeurtenisafhandeling zou plaatsvinden in een richtlijn of een controller (of beide) Voor het opzetten van richtlijntests, zie https://github.com/vojtajina/ng-directive-testing. Voor het instellen van controllertests, zie https://github.com/angular /angular-phonecat/blob/master/test/unit/controllersSpec.js#L27

Hopelijk helpt dit.


Antwoord 2

Hier zijn de stappen die u moet volgen om een ​​$broadcast-gebeurtenis in hoekige JS te krijgen

Initialiseer tijdens het injecteren de rootScope en scope stub zoals hieronder aangegeven:

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

Nadat de controller is gemaakt, verhoogt u de gebeurtenis met rootScope zoals hieronder:

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

Antwoord 3

We hebben deze sintax voor A1 gebruikt

=========== 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

Other episodes