La pire des tâches pour tout développeur Web reste le test de ces créations sur les différents navigateurs. Jusqu’à présent, il n’y a pas de bon moyen de tester un site Web avec les différentes versions d’IE, Firefox, Chrome et Opera. Dès lors que vous installez la version mise à jour de chacun de ces navigateurs votre ancienne version disparaît.
Pour de nombreux développeurs, cela signifie que vous devez exécuter des logiciels additionnels, ou encore travailler depuis une machine virtuelle, qui vous permettent d’exécuter différentes versions de navigateur. Enfin, dans le cas des utilisateurs de Mac, comme moi, vous aurez besoin de garder un vieux PC ou exécuter une version de Windows sur votre Mac. Pas terrible… Pour amplifier les choses, l’ajout d’IE9 a accentué ce problème, car il ne peut plus fonctionner sur les anciennes versions de Windows souvent requis pour exécuter IE6…
BrowserStack la solution
Heureusement, après des années d’attente, nous avons enfin une solution viable à ce problème, entrez browserstack.com dans votre navigateur !
BrowserStack a été développé afin de vous aider, vous développeurs, dans votre développement. Ce dernier sera donc plus aisé, vous permettant de tester vos sites Web au sein même de votre navigateur, sans le quitter. En plus de cela, il vous permet également de mettre en place un tunnel, via SSH, pour tester votre site Web développé localement dans les anciens navigateurs. Par exemple, si vous sentez vraiment la nécessité de rendre compatible votre application Web avec IE6, alors vous pourrez le faire dans votre navigateur.
Contrairement à certains autres services qui étaient à la mode pendant un certain temps, en réalisant des captures d’écran de votre site et vous affichant l’image quelques minutes, voire quelques heures après, BrowserStack, lui, vous permet de réellement interagir avec votre site Web via votre navigateur offrant un total contrôle sur le test JavaScript. Autrement dit, vous pouvez tester vos pages Web en temps réel via le partage d’écran VNC et que chaque navigateur est configuré avec des outils de débogage (Firebug, Chrome Developer Tools, outils de test d’IE, etc…)
Autre point important, vous pouvez faire tout cela directement à partir de votre ordinateur de développement que ce soit un Mac ou un PC à travers une interface Web.
BrowserStack est une de ces solutions qui fait exactement ce qu’il annonce, et croyez moi c’est assez rare pour le souligner !
BrowserStack provides complete range of browsers for cross browser testing. It features local testing, pre-installed debugging tools and resolution testing.
Comment ça marche ?
Le service est simple et agréable, et il est très facile à utiliser. Vous tapez simplement l’URL de votre site à tester, et le navigateur pour lequel vous voulez l’essayer et c’est parti ! J’ai décidé de voir l’expérience utilisateur de nos utilisateurs dans Internet Explorer 6.
Pour cela, j’ai cliqué sur « Start » et l’écran de chargement apparaît (pendant 10 secondes !) ! Et voici le résultat dans le très glorieux IE6, le résultat étant lui très glorieux…
De là, vous pouvez utiliser l’ensemble des outils de débogage que vous aurez besoin, et vous pouvez mettre à jour aussi rapidement qu’un autre navigateur, simplement en le sélectionnant à gauche de l’écran. Vous pouvez également sélectionner la résolution de l’écran que vous émulez afin de faire de nombreux tests et couvrir l’ensemble des difficultés…
Les services proposés sont vraiment impressionnants. Voici les navigateurs qui sont supportés pour le moment :
- Firefox 3, 3.6, 4, 5, 6 et 7
- Internet Explorer 6, 7, 8, 9
- Safari 4, 5 et 5.1
- Opera 10, 11.5
- Chrome 12, 13, 14, 15.0 beta
En plus de l’ensemble des caractéristiques déjà impressionnantes, il est également possible de tester un site Web que vous développez localement. Après avoir cliqué sur « Setup Tunnel », vous pourrez créer un tunnel pour votre PC, afin d’accéder à votre site pour le tester.
En quoi BrowserStack est intéressant ?
Comme tous ceux qui ont déjà développé un site Web vous le diront, les tests sur les différents navigateurs du marché, sont sûrement la tâche la plus frustrante. Personnellement, je crois que j’ai passé quelques heures tardives afin de rendre les sites interopérables…
En tant qu’utilisateur Mac, le développement de ce blog a été difficile. J’ai certes utilisé WordPress, développé pour être compatible avec un bon nombre de navigateurs, mais comme tout le monde j’ai modifié mon thème et mes plugins rendant difficile l’intégration avec IE… Je me rappelle avoir légèrement embêté mes collègues afin de tester mes sites Web… Et c’est là que BrowserStack intervient afin de m’aider !
La mauvaise nouvelle pour BrowserStack ? La concurrence… Aujourd’hui, il existe mille et une solutions pour tester un site ou une application Web à travers un navigateur, comme Litmus ou Browsershots. Cependant BrowserStack offre pour les utilisateurs enregistrés un impressionnant niveau de fonctionnalités gratuites, qui sont souvent uniquement disponibles dans des offres de haut de gamme ou des versions premium.
Cependant le gros plus de BrowserStack par rapport à la concurrence, et comme annoncé ci-dessus, est qu’il permet à l’utilisateur de lancer un navigateur pleinement fonctionnel, sans avoir besoin de l’installer. Vous vous sentirez immédiatement à la maison.
Prix et plans
Si vous êtes un développeur Web, je vous conseille de découvrir ce service, et ce dès maintenant. C’est simple, facile à utiliser et … abordable. Évidement vous auriez préférer qu’il soit libre, mais pour les fonctionnalités proposées, les prix sont très compétitifs. À partir de 19$ (14€) par mois pour un usage illimité pour un utilisateur. Dès lors que vous vous inscrivez, vous bénéficiez également de 60 minutes de temps libre.
Le coût peut vous sembler élevé, mais le gain de temps d’avoir un navigateur installé au lieu de dix est fantastique.
Mise à jour
Après avoir reçu un mail de BrowserStack, je dispose de plusieurs invitations pour les lecteurs de ce blog ! Alors envoyez-moi rapidement un mail (contact (at) blognt.fr) afin que je vous en envoie une, où encore sur Twitter, Google+ et Facebook ! On peut remercier BrowserStack !
Mise à jour
Nouveau message de BrowserStack par un tweet : « @lryo17 : Hi Yohann, we are out of beta now, so you might like to update blog post and your readers. ».
Alors allez s’y le système n’est plus fermé !
Conclusion
J’ai toujours souhaité qu’un tel outil soit disponible, et ce depuis un certain temps. J’ai obtenu une invitation, je remercie Fabien au passage, et je dois dire que l’heure offerte par BrowserStack m’a permise de découvrir le service. Je peux vous assurer qu’il est très très satisfaisant !
Il est évident qu’un tel service va vous permettre de gagner un temps fou pour la suite de vos développements ! Je pense que le prix ne sera pas un frein pour de nombreuses personnes…
Le service est actuellement encore en version bêta, mais vous pouvez demander une invitation ici : http://www.browserstack.com.
Mise à jour
Un concours entre BrowserStack et le BlogNT est organisé afin de vous faire gagner 3 plans professionnels pendant une année.
Venez tenter votre chance, vous avez jusqu’au 12 octobre (14h) !
Avez-vous déjà utilisé un tel service ? et BrowserStack ? Quel en est votre ressenti ? Êtes-vous prêt à payer environ 15€ par mois pour y avoir accès ? Venez réagir ! De plus, si vous avez des questions sur ce service n’hésitez pas je vous répondrais.
