C’est l’histoire d’un bug

J’aime bien les histoires de bugs. TheDailyWTF est une mine d’or pour ça, mais j’aime beaucoup entendre de vive voix des développeurs raconter leurs propres expériences. Voici l’histoire d’un bug que j’ai rencontré il y a quelques mois. C’est le genre de bug qui une fois résolu, donne l’impression d’être David Caruso dans Les Experts : Miami, et donne envie d’enfiler une paire de lunettes de soleils en criant YEEAAAAHH à travers tout le bureau.

Quelques jours après le lancement d’un nouveau site e-commerce, le client me transfère le mail d’un de ses collègues qui rencontre un problème sur Internet Explorer. Sur la fiche produit, lorsqu’on ajoute un produit à son panier, la « div » qui s’affiche via une lightbox est coupée sur la droite.

Bizarre. Tout a bien été testé avant le lancement du site. Et même sur IE6, qui n’est pas censé être supporté, tout s’affiche correctement. Au risque de faire un peu cliché, je rassure le client en lui disant que « chez moi ça marche ». Je lui demande un peu plus de précisions sur la version d’Internet Explorer et le système d’exploitation utilisés, car sa capture d’écran envoyée ne laissait entrevoir que le contenu de la page qui posait problème.

D’après le client, le problème se produit bien sur IE8. Ça ne le fait pas sur son poste, mais il l’a bien vu sur le poste de son collègue. Et pire, sur le poste d’un autre collègue, sous IE7, l’overlay de la div s’affiche au-dessus de tout le contenu du site et de la div elle-même. Et le service de la relation client téléphonique confirme également avoir reçu des appels de clientes perdues devant leur ordinateur à cause de ce problème.

Mince alors ! On a pourtant bien testé le site dans tous les sens, sur les différents postes de la boîte sous différentes configurations. De mon côté, j’utilisais une machine Virtuelle sous Windows 7 avec IE9 d’installé. J’utilisais le « Mode de compatibilité » d’IE pour tester le rendu du site sous les différentes versions d’IE. Je sais que ce mode n’est pas 100% fidèle aux vraies versions du navigateur, mais pour ce genre de problème qui touche surtout à des styles, ça fonctionne d’habitude très bien.

Les jours ont passé et je ne vois pas trop comment trouver une solution. Je propose au client d’y jeter un oeil la prochaine fois que je leur rendrais visite dans leurs locaux. Mais c’est embêtant… Plusieurs personnes rencontrent ce bug, de manière systématique, et pas moi.

Tracassé, je décide le week-end qui suit de ressortir un vieux PC chez moi sur lequel je sais que j’ai un IE7 d’origine installé sous Windows XP. Je commence par tester sur le serveur de test du site. Rien. Je teste en ligne. Et là, miracle ! J’arrive à reproduire le problème ! C’est drôle comme la reproduction d’un bug peut être une grande satisfaction pour un développeur.

C’est l’heure de sortir ma loupe de détective et enfin de pouvoir commencer mon enquête. Sur le site en ligne, je remarque que j’ai des règles de styles supplémentaires qui apparaissent. Ces règles proviennent… de la page d’erreur 404 du site.

Après inspection des ressources appelées par la page sur IE, je me rends compte que le site fait appel à un fichier « ie.css ». C’est surement une petite délicatesse mise à ma disposition par le développeur du site. Sauf que, ne m’ayant rien dit, et n’ayant pas l’utilité d’un tel fichier, je n’avais pas créé le dit fichier sur le serveur. Du coup, la page du site faisait appel à une CSS qui renvoyait en fait la page 404 du site. Or, sur les anciennes versions d’IE, les styles présents dans une page 404 étaient interprétés dans la page courante. Les styles de la page 404 rentraient donc en conflit avec ceux de la fiche produit. Ce bug, présent sur IE7 sous Windows XP SP1, avait été corrigé dans les versions suivantes sous Windows XP SP2. Il n’apparaissait pas dans le mode de compatibilité d’IE7 sous IE9 car il s’agit d’un problème lié au chargement des ressources d’IE, et non à son moteur de rendu. Et le bug n’était pas présent sur le serveur de test, car sur ce serveur la page 404 appelée était celle par défaut du serveur et ne contenait aucun style.

Il ne me restais alors plus qu’à créer ce fichier, et passer le tout en ligne. L’affaire était résolue, et je pouvais désormais crier de joie à travers tout le bureau.