Simulation de l'entrée utilisateur pour TDD JavaScript

Je trouve de plus en plus difficile de simuler des événements utilisateurs réels en utilisant jQuery ou des fonctions de déclenchement d'élément natif. Par exemple, si vous avez une entrée de texte et que vous ne souhaitez pas que l'utilisateur puisse ajouter un caractère, vous pouvez appeler e.preventDefault() avec l'objet d'événement normalisé jQuery sur l'événement de keydown . Cependant, il n'existe aucun moyen de vérifier par programmation ce scénario de test.

Le test suivant passe même sans l'appel à preventDefault car le déclencheur de déconnexion jQuery n'est pas un événement "réel".

 input.val('test').trigger(jQuery.Event({ which: 68 }); expect(input).toHaveValue('test'); 

Sans le code correct, ce test devrait échouer parce que l'entrée devrait avoir une valeur de 'testd' (68 est le code de caractère pour 'd').

Quelqu'un connait-il des méthodes ou des bibliothèques pour simuler des événements d'interface utilisateur réels ?

Simuler l'événement réel est assez compliqué. Vous devez d'abord déterminer le type d'événement dont vous avez besoin et le créer avec document.createEvent . Ensuite, appelez différents init*Event pour initialiser l'objet événement. Enfin, utilisez element.dispatchEvent pour envoyer l'événement à l'objet cible.

Vous voulez probablement essayer d'utiliser Selenium: http://seleniumhq.org/

Voici un aperçu décent: http://blog.frontendforce.com/2010/05/unit-testing-in-javascript-selenium/

Je crois que YUI avait un code pour le faire. Téléchargez leur code et regardez. Je pense qu'il s'appelle simulate.js ou quelque chose de similaire. Alternativement, vous pouvez voir comment le sélénium le fait.

Voici un repo qui semble être bien tenu à jour: https://github.com/mmonteleone/jquery.autotype