Projet Afflux

Si vous oubliez votre mot de passe jabber, vous faites comment vous ?

1. Vous envoyez un email a l'administrateur de votre serveur. Vous devez lui prouvez votre identité. Si vous avez rempli un email dans votre vcard il vous envoie votre mot de passe sur cette adresse.
2. Vous vous créer un nouveau compte ...

Une nouvelle fonctionnalité a venir dans le client web Afflux et donc la possibilité de retrouver son mot de passe. La partie serveur est déjà disponible dans le projet Additional services client écrite en Python.

Plus d'informations bientôt ..

Désormais fervent utilisateur de JSUnit et de JSCoverage, il est désormais temps d'apprendre à utiliser JSMock.

JSMock crée automatiquement des mocks a partir d'un objet. Il est ainsi possible de tester l'ordre dans lesquelles les fonctions sont appellé, les arguments passé, renvoyé des valeurs ou encore exécuter des actions.

Regardons ce code:

xmpp.Client = function() {
};
xmpp.Client.prototype = {
    connect: function(jid, pass) {
    }
};
afflux.Connexion = function(client) {
    client.connect(new xmpp.protocol.Jid(), "");
}

Pour tester que la fonction afflux.Connexion passe bien les bon arguments a la méthode connect, on peut utiliser JSMock.

var mockControl = new MockControl();
var mockClient = mockControl.createMock(xmpp.Client);
mockClient.expects().connect(TypeOf.isA(xmpp.protocol.Jid), "");
afflux.Connexion(mockClient);
mockControl.verify();

Si la méthode client.connect est appelé avec de mauvais arguments, JSMock renverra une exception.

Le code précédent encapsulé dans un test JSUnit permetra de bien tester votre code.

JSMock avec JQuery

Si vous désirez tester la manipulation du DOM dans vos tests, vous devriez probablement utiliser JQuery. JQuery est très agréable a utiliser grace à une API élégante.

Pour cacher l'élément avec l'ID afflux

function cache() {
    $("#afflux").hide();
}

Pour tester le code précédent, il est nécessaire de faire un peu de tuyauterie.

Transformons d'abord le code précédent pour le rendre plus testable.

function cache(manipulator) {
    manipulator("#afflux").hide();
}

Ensuite dans votre cas de test:

var mockControl = null;
var mockJquery = null;
function setUp() {
    mockControl = new MockControl();
    mockJquery = mockControl.createMock(jQuery.fn);
}
function testCache() {
    var manipulator = function(selector) {
        assertEquals("#afflux", selector);
        return mockJquery;
    }
    mockJquery.expects().hide();
    cache(manipulator);
    mockControl.verify();
}

En simulant le selecteur de Jquery et en le passant à la classe que l'on désirer tester, on peut vérifier la simulation du DOM.

Si vous vous demandez comment tester JQuery, c'est un autre problème.

La sympathique page d'accueil du projet Afflux voit ses derniers internautes, de même que d.a-p.o. Tout ceci va migrer vers Redmine.

Le choix a été vite fait. Sa prise en charge des sous-projet, sa page d'accueil personnalisable, son support de nombreux SCM et toutes les joyeuseté de Trac on tué toute concurrence.

La migration est prévue pour cette semaine, restez a l'écoute !

Lors du développement d'une application Web, le Javascript prend beaucoup de place, et le contexte global se retrouve rapidement saturé.

La solution pour cela est de créer des namespaces. Des faux évidemment, ce concept n'existe pas dans Javascript 1.x.

Les namespaces peuvent êtres simulé avec des fonctions.

/**
 * @namespace Namespace xmpp
 */
function xmpp(){}
/**
 * @constructor
 */
xmpp.Client = function() {
};
xmpp.Client.prototype = function() {
    connect: function() {
    }
}

Pour instancier un objet de type Client

var client = new xmpp.Client();
client.connect();

Il devient plus facile de structurer votre code par namespaces. Il devient également plus lisible.

Cependant si vous créer souvant des instances de xmpp.Client vous trouverez rébarbatif de le répéter à chaque fois. La solution peut-être d'utiliser une référence.

var Client = xmpp.Client;
var c = new Client();
c.connect();

Le fait de créer des namespaces permet de créer plus facilement des librairies. Vous aurez tendance à bien vouloir séparer votre code lorsque vous devrez appeler une fonction ou un objet.

Le système a toutefois ses limites. Vous devez obligatoirement préfixer les fonctions et les class par l'espace de nom.

xmpp.Client = function() {
};
xmpp.ClientParams = function() {
}
new xmpp.Client();

Le résultat peut être très verbeux.

Javascript 2 qui introduit un véritable système d'espace de nom résout en partie le problème.

namespace xmpp
 
xmpp class Client {
}
xmpp class ClientParams{
}
 
use namespace xmpp;
new Client();

Lors de l'instanciation de la class Client vous n'avez plus besoin de préfixre l'appel par xmpp si vous utilisez use namespace. Le mécanisme avec le mot clef import paraît relativement similaire.

Mais en attendant Javascript 2, et à moins d'utiliser ce traducteur javascript 2 -> Javascript 1.2, le système de namespace à base de fonctions et de bouts de ficelles est utile !