Passer un événement DOM mock à un gestionnaire de directives sans jQuery

J'ai une question très simple directive dont le but est simplement d'annuler la dragstart événement:

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

Comment puis-je tester cela dans un Jasmin d'essai? J'ai le test suivant qui tente d'espionner un objet d'Événement, et de le transmettre au gestionnaire:

var mockEvent; 

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

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

Mais le test échoue. Vous pouvez voir à ce Plunker.. Comment puis-je tester ce (/refactoriser la directive, afin de rendre testable)?

Edit: Idéalement sans jQuery.
Edit: changé tags

source d'informationauteur Michal Charemza

  1. 10

    vous pouvez inclure jquery et créer un jquery objet d'événement. cet objet peut facilement être transmis:

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

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

    j'ai utilisé cette version jquery dans votre plunkr: //ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js

  2. 8

    À la version stable actuelle de Anguleuses, 1.3.14, vous pouvez le faire sans jQuery en passant l'événement comme le premier et le seul paramètre de triggerHandlerdonc au lieu de ce qui est suggéré dans la question

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

    vous pouvez écrire

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

    Pour ajouter un espion sur le preventDefault fonction, comme pour la question d'origine, vous pouvez effectuer les opérations suivantes

    var mockEvent; 

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

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

    Vous pouvez voir ce travail dans ce Plunker. Alternativement, vous pouvez simplement utiliser un objet ordinaire avec au moins un type clé, dans ce cas,

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

    qui peut être vu de travail dans ce Plunker

    Je crois que cela a été ajouté à la branche 1.3 dans ce commit.