BrowserSync est un outil basé sur Node.js qui permet de débuguer ses sites en même temps sur plusieurs navigateurs, simultanément sur des machines, plate-formes différentes. Il joue le rôle de proxy hyper-vitaminé entre le site et vos browsers. La version 2 est sortie il y a un peu moins d'un mois.
Fonctionnalités
- Naviguer simultanément avec plusieurs navigateurs desktops ou mobiles sur un même site
- Si un fichier CSS change, la page est rechargée sur tous les navigateurs
- Synchronisation des clics et scrolls, remplissage des champs et validation de formulaires
- Recharger la page sur tous les navigateurs
- Avec Weinre, débuguer une page avec un seul et même outil proposant les fonctionnalités standards (navigation et éditions des éléments HTML/CSS/JS, accéder à la console, voir la timeline des chargements, les activités réseau...)
- Avec Pesticide.io, afficher des informations en overlay sur les boites CSS en live sur la page
- Simuler de la latence sur le chargement des pages
Installation
Démarrage
sudo browser-sync start --proxy "www.monsite.loc" --files "css/*.css"
BrowserSync en action sur un Firefox, un Chromium et un Firefox pour Android
La seule chose que je regrette, c'est que les changements effectués dans le DOM via Weinre ne soient pas répercutés sur toutes les fenêtres ouvertes et connectées à BrowserSync. J'ai ouvert une issue sur GitHub pour savoir s'il serait possible d'implémenter cette fonctionnalité.
Encore un bel outil à ajouter à sa trousse au plus vite, si ce n'est pas déjà fait.
Liens utiles