Pass Mock DOM Event-Handler-Richtlinie ohne jQuery

Question

Ich habe eine sehr einfache Richtlinie, dessen Zweck es ist nur die dragstart Veranstaltung abzusagen:

link: function(scope, element) { 
    element.on('dragstart', function(e) { 
    e.preventDefault(); 
    }) 
} 

Wie kann ich dies in einem Test Jasmin testen? Ich habe den folgenden Test, der auf einem Ereignisobjekt auszuspionieren versucht, und übergeben es an den Handler:

var mockEvent; 

beforeEach(function() { 
    mockEvent = new Event('dragstart'); 
    spyOn(mockEvent,'preventDefault'); 
}); 

it('should call preventDefault', function() { 
    element.triggerHandler('dragstart', mockEvent); 
    expect(mockEvent.preventDefault).toHaveBeenCalled(); 
}); 

Aber der Test nicht bestanden. Sie können see this at this Plunker.. Wie kann ich das testen (/ refactor die Richtlinie, um es testbar zu machen)?

Bearbeiten: Idealerweise ohne jQuery. Bearbeiten: geänderte Tags

Answer 1

bei der aktuellen stabilen Version von Angular, 1.3.14, können Sie, indem man das Ereignis als erster und einzigen Parameter von triggerHandler, so statt dies ohne jQuery tun, was in der Frage

element.triggerHandler('dragstart', new Event('dragstart')); 

vorgeschlagen wurde können Sie schreibe

element.triggerHandler(new Event('dragstart')); 

Um einen Spion auf dem preventDefault Funktion, gemäß der ursprünglichen Frage hinzufügen, erhalten Sie folgende

var mockEvent; 

beforeEach(function() { 
    mockEvent = new Event('dragstart'); 
    spyOn(mockEvent, 'preventDefault'); 
}); 

it('should call preventDefault', function() { 
    element.triggerHandler(mockEvent); 
    expect(mockEvent.preventDefault).toHaveBeenCalled(); 
}); 

Sie können tun können see this working in this Plunker. Alternativ können Sie verwenden nur ein einfaches Objekt mit mindestens einem type Schlüssel, so dass in diesem Fall

mockEvent = { 
    type: 'dragstart', 
    preventDefault: jasmine.createSpy('preventdefault') 
}; 

die working in this Plunker gesehen werden kann

Ich glaube, das auf den 1.3 Zweig in this commit aufgenommen.

Answer 2

Sie können jquery einschließen und ein jquery-Ereignisobjekt erstellen. Diese Aufgabe kann easly geben werden:

beforeEach(function() { 
    mockEvent = $.Event('dragstart'); 
    spyOn(mockEvent,'preventDefault'); 
}); 

it('should call preventDefault', function() { 
    element.triggerHandler(mockEvent); 
    expect(mockEvent.preventDefault).toHaveBeenCalled(); 
}); 

ich diese jquery Version in Ihrem plunkr verwendet haben: //ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js