AFUP Day 2019
[:fr]La parole est aux speakers : Kévin Dunglas (AFUP Day 2019 Lille)[:]
[:fr]Jusqu’à l’AFUP Day 2019 Lyon, retrouvez nos interviews de speakers pour mieux comprendre leur parcours et le sujet qu’ils ou elles aborderont lors de leur conférence !
La conférence
Symfony Panther : tester vos applis web avec de vrais navigateurs n’a jamais été aussi simpleQue ce soit quelques lignes de jQuery ou des Progressive Web Apps React/Vue.js/Angular complètes, toutes les applications web modernes contiennent du JavaScript. L’écosystème PHP et les frameworks tels que Symfony ou Zend proposent des outils pour réaliser des tests fonctionnels et de bout en bout (E2E), malheureusement ils se contentent d’effectuer des requêtes HTTP (Guzzle, Symfony WebTestCase, Zend Test PHPUnit) et des assertions sur le HTML généré côté serveur (BrowserKit). Ils ne sont pas capables d’exécuter le code JavaScript, de générer du HTML côté client, de tester si un élément est visible ou non, si une boîte de dialogue (alert, prompt) est bien affichée au clic… De plus, ces outils de test ne permettent pas de détecter les éventuels bugs touchant des navigateurs spécifiques. Panther est une toute nouvelle bibliothèque qui permet - grâce au standard WebDriver du W3C - de piloter tous les navigateurs modernes (Chrome, Firefox, Safari, Edge…) directement en PHP pour réaliser des tests fonctionnels et E2E, ou du web scraping. Panther implémente la très pratique API publique du composant BrowserKit de Symfony, ce qui lui permet d’exécuter les tests écrits avec le composant de test fonctionnel de Symfony et les scripts utilisant la bibliothèque de web scraping Goutte sans avoir à les modifier ! De plus, il implémente l’API de PHP WebDriver, et donne accès à toutes les fonctionnalités avancées du protocole du même nom, parmi lesquelles la possibilité d’effectuer des captures d’écran ou exécuter des scripts JavaScript personnalisés dans le contexte d’exécution de la page. Panther s’installe à l’aide d’un simple « composer require » et tout ce dont il a besoin pour fonctionner c’est un navigateur (pas de Selenium ou autre). Il détecte la structure de l’application, lance un serveur web pour la servir, trouve l’installation locale de Chrome ou de Firefox et les démarre en mode « headless » sans qu’aucune configuration ne soit nécessaire ! Il s’intègre également avec les solutions d’intégration continues populaires tel que Travis et fonctionne avec Docker. Encore mieux, il est compatible avec les services SauceLabs et BrowserStack pour tester votre application sur toutes les plateformes mobiles et bureaux possibles et imaginables. Lors de cette présentation, vous découvrirez l’ensemble des capacités du félin et son fonctionnement interne ! |
Auberge Stéphane Hessel 17/05/2019 15:30-16:10 |
Tu as créé Symfony Panther pour tester les applications web et tu nous en parleras lors de l’AFUP Day 2019 Lille : quelle est la spécificité de ce composant vis-à-vis d’autres outils de testing ?
Panther est un outil de test de bout en bout (end-2-end) dont les deux objectifs principaux le différencient fortement des autres outils dédiés à l’écriture de ce type de tests :
– il s’intègre parfaitement avec les outils de tests unitaires et fonctionnels déjà fournis avec Symfony
– il est très facile à mettre en oeuvre : pas besoin d’installer Selenium, de configurer un serveur web, de préparer une base de données de test… tout est automatique.
Concrètement, Panther implémente l’API publique de BrowserKit. C’est aussi celle que respectent l’outil de test fonctionnel de Symfony (WebTestCase) et Goutte, la bibliothèque de web scraping. Il est donc très facile de porter des tests existants utilisant l’un de ces outils : il n’y a qu’une seule API à apprendre pour les maîtriser tous, là où d’autres outils de tests E2E vous demandent d’apprendre une nouvelle API (CodeCeption, Dusk) voire un autre langage de programmation (Nightwatch, Cypress, …).
La différence avec WebTestCase et Goutte, c’est que Panther va lancer un vrai navigateur web pour exécuter les scénarios de navigation. Panther va exécuter le code JavaScript et effectuer le rendu CSS. Il devient donc possible de tester le code front, et donc de s’assurer que la page sera totalement fonctionnelle lorsque l’utilisateur s’y rendra (pas d’erreur JS bloquante, pas d’éléments HTML importants masqués en CSS…).
Si vous utilisez React, Vue.js ou même jQuery pour réaliser la couche de présentation de votre projet, Panther vous permet désormais de la tester aussi naturellement que si vous aviez utilisé Twig. Si vous utilisez les fonctionnalités temps réel apportées par Mercure (qui dépendent de JavaScript côté client), Panther vous permet également de les tester.
De plus, Panther fournit des fonctionnalités supplémentaires telles que la possibilité de simuler des clics de souris sur des éléments précis (pratique pour tester des applications utilisant canvas ou WebGL), de prendre des captures d’écran, ou d’exécuter du code JS dans le contexte d’exécution du navigateur.
Panther s’appuie sur le protocole WebDriver, standardisé par le W3C, et sur la bibliothèque PHP WebDriver de Facebook (à laquelle j’ai beaucoup contribué au cours du développement de ce nouvel outil). Il peut donc manipuler n’importe quel navigateur moderne (Chrome par défaut, mais aussi Firefox, Edge…), est compatible avec Selenium et avec les services de “browser testing” en SaaS (SauceLabs, BrowserStack…).
Durant ma présentation, je vous présenterai en détail comment ça marche ! Notez d’ailleurs que – bien qu’il fasse partie de ce projet – Panther n’a aucune dépendance à Symfony, il peut fonctionner avec n’importe quel projet PHP (et même non-PHP).
(suite…)