La fonction qui enregistre le gestionnaire sur prêts devrait enregistrer une autre fonction, pas un codeblock anonyme. Ensuite, vous pouvez tester le code qui appelle $ .ready() distinct du code qui s'exécute sur prêt. Vous avez donc:
- Un test pour vérifier la bonne fonction est définie comme le gestionnaire prêt
- Un autre test pour vérifier le gestionnaire prêt fait l'étoffe
Pour tester le scénario 1, vous Je vais devoir injecter un double de test pour jQuery. C'est difficile comme si vous redéfinissez $ ou jQuery, les chances sont que vous allez bousiller un autre code qui repose sur lui pour d'autres traitements (comme le coureur de test). En même temps, votre code peut toujours vouloir appeler directement jQuery lorsqu'il utilise des méthodes utilitaires comme la concaténation de tableau. Tout modèle d'inversion de contrôle devrait cependant répondre à cette question (http://martinfowler.com/articles/injection.html).
Quoi qu'il en soit, voici un code en utilisant l'injection de constructeur (en utilisant JSMock pour la bibliothèque moqueur, et QUnit (de jQuery) pour le coureur de test):
// the code
var createComponent = function(_$) {
var that = {};
that.OnStart = function() {
_$.ready(this.OnReady);
};
that.OnReady = function() {
};
return that;
};
// the test
test("OnStart associates the ready handler", function() {
var sut;
var mock$ = mc.createMock($);
mock$.expects().ready(isA.TypeOf(Function)).andStub(function(callback) {
equals(callback, sut.OnReady);
});
sut = createComponent(mock$);
sut.OnStart();
mc.verify();
});
test("OnReady does the right stuff", function() {
//etc
});
J'utilise ce schéma général pour tous les gestionnaires d'événements JS ...Vous préférerez peut-être utiliser des classes de type prototype. Lorsque vous passez des fonctions en tant que paramètres à jQuery, vous devez être conscient que la valeur "this" ne sera pas définie par jQuery lorsque ces rappels sont appelés. Dans le test, cela se brise parce que les égales (callback, sut.OnReady) ne passent plus. Pour résoudre ce problème, vous devez faire en sorte que les gestionnaires d'événements dirigent les membres de chaque instance. Vous pouvez imaginer quand il y en a plusieurs, alors c'est bien d'avoir un utilitaire qui en prend une liste, mais cela démontre que 'OnReady' est un membre qui ne compte pas sur 'ceci'.
var Component = function(_$) {
this._$ = _$;
// repeat for each event handler thats tested
this.OnReady = function() {
Component.prototype.OnReady.apply(this);
}
}
Component.prototype.Start = function() {
this._$.ready(this.OnReady);
}
Component.prototype.OnReady = function() {
}
Que voulez-vous tester exactement? Juste tester le code pourquoi ne devriez-vous pas tester ce que fait votre code? – powtac
J'essaie de tester la logique dans $ (document) .ready (function() {// tester ces codes}) ;. J'utilise JsTestDriver pour tester mon javascript. En ce moment j'ai des difficultés à atteindre le bloc document.ready. – BeraCim