Avis d'expert faisant l'état des lieux des tests logiciels aujourd'hui et expliquant comment mettre en place un processus de "continuous testing" en ligne avec son usine logicielle.
Vous avez dit Selenium ? L'outil qui permet d'automatiser les tests fonctionnels ? Multi-langage ? Multi-plateforme ? Et vraiment intéressant pour garantir la qualité de votre projet tout au long de sa réalisation ?
Oui, il s'agit bien de l'outil multi-tâches que l'on gagne à connaître dans un monde Agile où la qualité de votre application ne peut pas être négligée.
Mais jusqu'à quel niveau avez-vous utilisé l'outil ? Avez-vous industrialisé durablement et efficacement vos tests avec et ce, à moindre coût ? Par cette présentation, découvrez ou plutôt re-découvrez Selenium qui, avec toutes ses facettes, pourra vous amener beaucoup plus loin que vous ne le pensiez.
OBJECTIF QUALITÉ DIGITALE : Comment élaborer une bonne stratégie de test pou...StardustTesting
Webinar du 16/02/2016 animé par StarDust, spécialiste du Test et de l'Assurance Qualité (QA) pour les éditeurs de solutions digitales : "Comment élaborer une bonne stratégie de test ?"
PENSER TEST
> Connaître votre produit, connaître vos utilisateurs
> Tester tout au long du cycle de développement du produit
QUAND TESTER ?
> Cycle en V ?
> Cycle agile ?
QUOI TESTER ?
> Quels tests ?
> Quels terminaux ?
QUI TESTE ?
> Le développeur n'est pas testeur !
> Testeurs professionnels "in lab" / Freelance testeurs
COMMENT TESTER ?
> Tests manuels / Tests automatisés
> Quels outils ? Quels supports ? Quelles méthodologies ?
Avis d'expert faisant l'état des lieux des tests logiciels aujourd'hui et expliquant comment mettre en place un processus de "continuous testing" en ligne avec son usine logicielle.
Vous avez dit Selenium ? L'outil qui permet d'automatiser les tests fonctionnels ? Multi-langage ? Multi-plateforme ? Et vraiment intéressant pour garantir la qualité de votre projet tout au long de sa réalisation ?
Oui, il s'agit bien de l'outil multi-tâches que l'on gagne à connaître dans un monde Agile où la qualité de votre application ne peut pas être négligée.
Mais jusqu'à quel niveau avez-vous utilisé l'outil ? Avez-vous industrialisé durablement et efficacement vos tests avec et ce, à moindre coût ? Par cette présentation, découvrez ou plutôt re-découvrez Selenium qui, avec toutes ses facettes, pourra vous amener beaucoup plus loin que vous ne le pensiez.
OBJECTIF QUALITÉ DIGITALE : Comment élaborer une bonne stratégie de test pou...StardustTesting
Webinar du 16/02/2016 animé par StarDust, spécialiste du Test et de l'Assurance Qualité (QA) pour les éditeurs de solutions digitales : "Comment élaborer une bonne stratégie de test ?"
PENSER TEST
> Connaître votre produit, connaître vos utilisateurs
> Tester tout au long du cycle de développement du produit
QUAND TESTER ?
> Cycle en V ?
> Cycle agile ?
QUOI TESTER ?
> Quels tests ?
> Quels terminaux ?
QUI TESTE ?
> Le développeur n'est pas testeur !
> Testeurs professionnels "in lab" / Freelance testeurs
COMMENT TESTER ?
> Tests manuels / Tests automatisés
> Quels outils ? Quels supports ? Quelles méthodologies ?
Rédigé en Mars 2013
Comment automatiser les tests ?
Les différents types de tests automatisés : TU, BDD/TDD, GUI, TDC, Test de vie …
Méthodes d’automatisation
Capture/replay
Projet de développement
Techniques d’automatisation
Data driven
Keyword driven
DSTL
Composants technique pour l’automatisation
Oracle
Bouchon
Techniques de comparaison
Reporting
Cerberus, un outil pour l'automatisation des tests fonctionnelsAurélien Bourdon
Cerberus se veut être un outil fédérateur entre les équipes métier et technique pour se positionner comme un référentiel de la qualité fonctionnelle au sein du SI. Né et éprouvé au sein des équipes de La Redoute depuis 2011 Cerberus est maintenant devenu un outil libre pour le plus grand bonheur de la communauté !
Les outils d’automatisation de tests (scripting) : Adoption et enjeux (comple...AQT-presentations
Les essais logiciels sont de plus en plus longs et complexes, les délais de plus en plus courts et les impacts d’une anomalie critiques. Les technologies de l’information sont partout, la qualité doit y être aussi. Cette présentation traite des bonnes pratiques à implémenter afin de réduire et d'éliminer ces enjeux présents dans vos processus d'entreprise. Vous en saurez plus sur l'importance d'automatiser, les défis du passage du manuel à l’automatisation et pourquoi les outils actuels n’offrent pas le ROI escompté. Une nouvelle démarche pour simplifier l’adoption et assurer le ROI vous sera aussi présentée.
10 bonnes pratiques pour des apps et sites ecommerce sans bugStardustTesting
Êtes-vous sûr(e) que votre nouveau site ecommerce ou votre nouvelle application est "bug free" ?
Avez-vous effectué tous les tests nécessaires et indispensables pour garantir à vos utilisateurs une expérience optimale ?
Découvrez les 10 bonnes pratiques pour des apps et sites ecommerce sans bug.
La prochaine version du framework .NET (.NET 4.5) apporte plusieurs innovations. Les performances ont été améliorées, les appels asynchrones ont été introduits dans de nombreuses API et le support au niveau de C# 5 des instructions async/await facilite leur usage. Le traitement parallèle a aussi été étendu avec le support des cœurs multiples et l'introduction des dataflow. Parmi les nouveautés on notera également le support étendu de MEF, des améliorations au niveau de WCF, de Workflow Foundation et de ASP.NET pour ne citer que ceux-ci.
[Atelier en ligne Frenchweb - 05/11/2015]
> Quelques chiffres
> Rappel Responsive Web Design
> État des lieux du Test RWD
> Priorité : choix des terminaux
> Stratégie de test
> FOCUS Tests mobile
> FOCUS Blocs de contenus externes
> FOCUS E-Commerce
20091008 Tests Interaces Web Riches SeleniumGreenIvory
Cette session présente une solution pour tester de manière efficace et automatisée une interface web riche créée avec GWT / GXT à l'aide de l'outil Selenium.
La prochaine version de la gamme de produit Visual Studio ALM est en préparation. Nous en savons déjà beaucoup sur les futures fonctionnalités ! Venez découvrir ce que ce nouvel opus vous permettra de faire en termes d'agilité, de tests et de développement ! La session privilégiera les démonstrations d’un maximum de nouvelles fonctionnalités, telles que la notion de feedback, le code review, les tests exploratoires, les nouvelles expériences utilisateurs, les nouveautés du contrôle de code source, et bien d’autres !
10 tips pour améliorer les performances de vos applications Windows 8Microsoft
S’il est très simple de réaliser des applications Windows 8 de qualité, il est moins évident de créer des applications ultra performantes. Windows tourne désormais sur tout type d’appareils, des PC de gamers aux tablettes peu puissantes. Pour ces dernières, il est nécessaire de tirer parti au maximum des API fournies par WinRT. Cette session vous propose de découvrir 10 astuces afin d’améliorer visiblement les performances de vos applications.
JFTL2015 - Tester une application mobile de A à ZCedric GAUTIER
Test des applications mobiles
Cédric Gautier / Hien-Thuan Quach - PagesJaunes
La présentation "Test des applications mobiles" a pour but de présenter les différentes étapes pour qualifier une application mobile depuis la fin de sa phase de conception fonctionnelle (conception recette, et l’écriture des tests dans le code par l’équipe de développement) à sa mise en ligne en passant par sa validation.
Nous aborderons chacune des étapes en évoquant la stratégie (couverture des combinaisons terminaux/OS), les méthodes, les outils utilisés (dev, déploiement, supervision, sniffing) ainsi que les différents écueils déjà rencontrés et les solutions mises en place ( intégration Continue, Equipe Agile, Outillage) ou à venir ( vers un mode Continuous Delivery, Agilité, feature flipping, mise en place de train de releases)
Nous évoquerons donc le test au niveau de la phase de développement, les différentes typologies de tests (unitaires, Acceptance, fonctionnels (Manuels & Automatisés), performance, tests graphiques et ergonomie, tests 2à2, tests dos à dos, tests en extérieur), la non-régression et leur implémentation dans notre organisation.
La présentation ne se veut pas didactique mais au contraire sera réalisée sur des échanges interactifs qui permettront d'aborder les problématiques rencontrées par le public sur les applications mobiles comme le
cycle de vie d'une application (mise à jour, compatibilité, débranchement), la gestion des versions par store interne, la gestion d’un éco-système hétérogène avec de nombreux SDK externes embarqués dans le produit, le suivi de la qualité (crashlogs, audience)
La performance Back Office et applicative sera aussi évoquée ainsi que les impacts de l’application sur le terminal (Batterie, mémoire, géolocalisation) et les méthodes utilisées pour tester ces conditions aux limites. Pour finir comment gérer la mise en ligne selon les stores et les délais de validation (itération, déploiement progressif et suivi de crashes, beta-testing)
Symphonie pour PHP industrialisé en agilité majeureJonathan Bonzy
Présentation pour l'Agile Grenoble 2011
Avoir des millions d'amis, comparer des millions d'offres ou publier des millions de news sont autant d’exemples d’applications écrites en PHP. Ce langage de la “programmation pour les nuls”, qui permet tous les écarts, reste pourtant un choix privilégié pour les solutions web. Avec les bons outils et les bonnes pratiques, ce langage est modulable, testable et facilement livrable. Au travers d’une approche technique montrant par l’exemple quels instruments choisir, découvrez comment jouer la partition d’une symphonie pour PHP industrialisé en agilité majeure.
Au programme:
- Dégager un boilerplate d’un projet PHP ou comment ne pas tout jeter à l’arrivée
- Reprendre la main sur leur projet frontend et avoir une stratégie de refactoring par les tests
“Not only working software, but also well-crafted software” - Manifesto for Software Craftsmanship
Rédigé en Mars 2013
Comment automatiser les tests ?
Les différents types de tests automatisés : TU, BDD/TDD, GUI, TDC, Test de vie …
Méthodes d’automatisation
Capture/replay
Projet de développement
Techniques d’automatisation
Data driven
Keyword driven
DSTL
Composants technique pour l’automatisation
Oracle
Bouchon
Techniques de comparaison
Reporting
Cerberus, un outil pour l'automatisation des tests fonctionnelsAurélien Bourdon
Cerberus se veut être un outil fédérateur entre les équipes métier et technique pour se positionner comme un référentiel de la qualité fonctionnelle au sein du SI. Né et éprouvé au sein des équipes de La Redoute depuis 2011 Cerberus est maintenant devenu un outil libre pour le plus grand bonheur de la communauté !
Les outils d’automatisation de tests (scripting) : Adoption et enjeux (comple...AQT-presentations
Les essais logiciels sont de plus en plus longs et complexes, les délais de plus en plus courts et les impacts d’une anomalie critiques. Les technologies de l’information sont partout, la qualité doit y être aussi. Cette présentation traite des bonnes pratiques à implémenter afin de réduire et d'éliminer ces enjeux présents dans vos processus d'entreprise. Vous en saurez plus sur l'importance d'automatiser, les défis du passage du manuel à l’automatisation et pourquoi les outils actuels n’offrent pas le ROI escompté. Une nouvelle démarche pour simplifier l’adoption et assurer le ROI vous sera aussi présentée.
10 bonnes pratiques pour des apps et sites ecommerce sans bugStardustTesting
Êtes-vous sûr(e) que votre nouveau site ecommerce ou votre nouvelle application est "bug free" ?
Avez-vous effectué tous les tests nécessaires et indispensables pour garantir à vos utilisateurs une expérience optimale ?
Découvrez les 10 bonnes pratiques pour des apps et sites ecommerce sans bug.
La prochaine version du framework .NET (.NET 4.5) apporte plusieurs innovations. Les performances ont été améliorées, les appels asynchrones ont été introduits dans de nombreuses API et le support au niveau de C# 5 des instructions async/await facilite leur usage. Le traitement parallèle a aussi été étendu avec le support des cœurs multiples et l'introduction des dataflow. Parmi les nouveautés on notera également le support étendu de MEF, des améliorations au niveau de WCF, de Workflow Foundation et de ASP.NET pour ne citer que ceux-ci.
[Atelier en ligne Frenchweb - 05/11/2015]
> Quelques chiffres
> Rappel Responsive Web Design
> État des lieux du Test RWD
> Priorité : choix des terminaux
> Stratégie de test
> FOCUS Tests mobile
> FOCUS Blocs de contenus externes
> FOCUS E-Commerce
20091008 Tests Interaces Web Riches SeleniumGreenIvory
Cette session présente une solution pour tester de manière efficace et automatisée une interface web riche créée avec GWT / GXT à l'aide de l'outil Selenium.
La prochaine version de la gamme de produit Visual Studio ALM est en préparation. Nous en savons déjà beaucoup sur les futures fonctionnalités ! Venez découvrir ce que ce nouvel opus vous permettra de faire en termes d'agilité, de tests et de développement ! La session privilégiera les démonstrations d’un maximum de nouvelles fonctionnalités, telles que la notion de feedback, le code review, les tests exploratoires, les nouvelles expériences utilisateurs, les nouveautés du contrôle de code source, et bien d’autres !
10 tips pour améliorer les performances de vos applications Windows 8Microsoft
S’il est très simple de réaliser des applications Windows 8 de qualité, il est moins évident de créer des applications ultra performantes. Windows tourne désormais sur tout type d’appareils, des PC de gamers aux tablettes peu puissantes. Pour ces dernières, il est nécessaire de tirer parti au maximum des API fournies par WinRT. Cette session vous propose de découvrir 10 astuces afin d’améliorer visiblement les performances de vos applications.
JFTL2015 - Tester une application mobile de A à ZCedric GAUTIER
Test des applications mobiles
Cédric Gautier / Hien-Thuan Quach - PagesJaunes
La présentation "Test des applications mobiles" a pour but de présenter les différentes étapes pour qualifier une application mobile depuis la fin de sa phase de conception fonctionnelle (conception recette, et l’écriture des tests dans le code par l’équipe de développement) à sa mise en ligne en passant par sa validation.
Nous aborderons chacune des étapes en évoquant la stratégie (couverture des combinaisons terminaux/OS), les méthodes, les outils utilisés (dev, déploiement, supervision, sniffing) ainsi que les différents écueils déjà rencontrés et les solutions mises en place ( intégration Continue, Equipe Agile, Outillage) ou à venir ( vers un mode Continuous Delivery, Agilité, feature flipping, mise en place de train de releases)
Nous évoquerons donc le test au niveau de la phase de développement, les différentes typologies de tests (unitaires, Acceptance, fonctionnels (Manuels & Automatisés), performance, tests graphiques et ergonomie, tests 2à2, tests dos à dos, tests en extérieur), la non-régression et leur implémentation dans notre organisation.
La présentation ne se veut pas didactique mais au contraire sera réalisée sur des échanges interactifs qui permettront d'aborder les problématiques rencontrées par le public sur les applications mobiles comme le
cycle de vie d'une application (mise à jour, compatibilité, débranchement), la gestion des versions par store interne, la gestion d’un éco-système hétérogène avec de nombreux SDK externes embarqués dans le produit, le suivi de la qualité (crashlogs, audience)
La performance Back Office et applicative sera aussi évoquée ainsi que les impacts de l’application sur le terminal (Batterie, mémoire, géolocalisation) et les méthodes utilisées pour tester ces conditions aux limites. Pour finir comment gérer la mise en ligne selon les stores et les délais de validation (itération, déploiement progressif et suivi de crashes, beta-testing)
Symphonie pour PHP industrialisé en agilité majeureJonathan Bonzy
Présentation pour l'Agile Grenoble 2011
Avoir des millions d'amis, comparer des millions d'offres ou publier des millions de news sont autant d’exemples d’applications écrites en PHP. Ce langage de la “programmation pour les nuls”, qui permet tous les écarts, reste pourtant un choix privilégié pour les solutions web. Avec les bons outils et les bonnes pratiques, ce langage est modulable, testable et facilement livrable. Au travers d’une approche technique montrant par l’exemple quels instruments choisir, découvrez comment jouer la partition d’une symphonie pour PHP industrialisé en agilité majeure.
Au programme:
- Dégager un boilerplate d’un projet PHP ou comment ne pas tout jeter à l’arrivée
- Reprendre la main sur leur projet frontend et avoir une stratégie de refactoring par les tests
“Not only working software, but also well-crafted software” - Manifesto for Software Craftsmanship
Les cycles de développement des applications raccourcissent de plus en plus. La pression se fait plus forte sur les équipes de développement qui sont poussées à développer en mode mercenaire, où seul le résultat immédiat compte. Cette vision est généralement contre-productive sur le long-terme car on passe beaucoup plus de temps à maintenir une application qu'à la développer. Il est donc primordial de s'assurer de sa qualité au delà de l'adéquation avec le besoin fonctionnel.
Cela passe par de nombreux éléments dont bien entendu la qualité du code source mais pas seulement. La présence de documentations pertinentes et à jour, les types et l'étendue des tests mis en place, l'architecture de l'application ou encore sa portabilité sont autant de facteurs clés du succès d'un projet.
Depuis quelques temps j'ai mis en place une activité spéciale que je propose à mes clients : Le Marathon de l'Industrialisation.%%%
L'idée: focaliser toute l'équipe de développement au même moment sur un temps court, pour améliorer significativement les pratiques, et ce grâce à l'adoption de nouveaux (variable en fonction des clients) outils et techniques de développement. Je vous livre ici un de mes supports utilisé en Juin 2009 chez un de mes clients.
Auditer son code pour plus de sécurité. Damien Seguy
Un bon audit, c’est-à-dire un regard sans complaisance sur les petits travers du code, la configuration et de l’architecture d’une application.
Différentes techniques permettent d’évaluer PHP et les applications Web : les tests automatiques, le fuzzing, les scénarios, les tests boîte
noire, les analyses à code ouvert.
Intégration Continue PHP avec Jenkins CIHugo Hamon
Comment assurer le suivi qualite du code source d'une application web? Ce n'est pas une tache aisée ! C’est d’autant plus vrai que PHP est encore considéré aujourd'hui comme un langage peu professionnel. PHP est pourtant un langage dont l'outillage n'a rien a envier a l'ensemble de ses concurrents. L'objectif de cette conférence est de présenter les bonnes pratiques à adopter ainsi que les différents outils a mettre en oeuvre afin de contrôler la qualité d'un projet PHP au quotidien. Un focus particulier sera porté sur la plateforme d'intégration continue Jenkins, les tests unitaires ou bien encore la récupération et l'interprétation des métriques collectées.
L’état de l’art des tests front-end
Maîtriser et fiabiliser son code sont aujourd’hui devenus incontournables pour tout développeur devant faire face à des architectures Web de plus en plus riches et complexes.
Il existe des outils pour réaliser des tests front-end d’applications Web et répondre aux besoins d’un développement de qualité.
Nous vous invitons ici à parcourir l’écosystème de ces tests front-end d’applications Web. Que vous soyez déjà convaincus par les tests ou tout simplement curieux, ce document vous guidera pour les mettre en place sur vos projets.
Présentation de Maven et de son utilisation en entreprise dans le cadre du Ch'ti JUG, le 15 juin 2009.
Pourquoi Maven ? Pourquoi l'adopter ? Les bonnes et mauvaise pratiques. Son avenir ...
Les tests fonctionnels avec Visual Studio 2010Microsoft
L’objectif de cette session est de présenter les tests fonctionnels « codés » écrits avec Visual Studio 2010. Cette fonctionnalité est encore méconnue malgré son utilité dans les tests de non-régression et dans l’automatisation des tests. Nous passerons en revue les points suivants : comment se place cette fonctionnalité dans l’offre de test de Visual Studio ? A qui s’adresse-t-elle ? Quelles sont les intégrations avec les autres outils ? Quelles sont les technologies supportées et les limites de l’outil ? Comment mettre en œuvre ces tests sur son projet et quelles sont les bonnes pratiques pour maximiser le retour sur investissement ? La session sera illustrée par des démonstrations.
Jasmine : tests unitaires en JavaScript - Human Talks Grenoble 14.05.2013Xavier NOPRE
Slides et quelques captures d'écrans de ma présentation de Jasmine (pour les tests unitaires en JavaScript) lors de la soirée des Human Talks du 14/05/2013 à Grenoble
Une usine logicielle est un ensemble d’outils pré-configurés, de frameworks, de conventions, de processus, de documentations et de modèles de projets qui structurent les développeurs et leurs développements.
L’objectif est d’automatiser au maximum la production et la maintenance des applications afin d’améliorer leur qualité et le « time to market ».
Un support de cours complet sur l'architecture JEE et l'industrialisation du génie logiciel. Ce support contient les parties suivantes :
- Tendances du génie logiciel
- Architecture JEE
- Services de l'infrastructure JEE (jdbc, jndi, rmi,servlet, jsp, jstl, jsf,EJB, JaxWS, JaxRS, JMS, JMX, ....)
- Maven : Outil d'industrialisation du génie logiciel
- Junit : Test Unitaires
- Hibernate
- Spring IOC et Spring MVC
- Struts 2
Bon apprentissage à tous
Maven
Exemple Pratique With Selenium WebDriver | Selenium WebDriver Tutorial | Selenium
Selenium WebDriver AVEC JAVA
Selenium est un ensemble d'outils robustes qui prend en charge le développement rapide de l'automatisation des tests pour les applications Web.Selenium a été créé par Jason Huggins en 2004.
WebDriver est un outil pour automatiser les applications Web de test. Il est populairement connu sous le nom de sélénium 2.0.
Simon Stewart a créé WebDriver vers 2006, lorsque les navigateurs et les applications Web devenaient plus puissants et plus restrictifs avec des programmes JavaScript comme Selenium Core
youtube : https://www.youtube.com/channel/UCMhJ-OiC-drUqbBldbRMZvA
Le test, qu'il soit unitaire ou fonctionnel, est à la mode dans le monde du développement logiciel, suite entre autre à la mise en œuvre croissante des méthodes agiles et notamment de l'intégration continue ou des méthodes de développement telles que le TDD, le BDD ou la programmation par contrat. Récemment, ce phénomène a encore été amplifié au sein de la communauté PHP par l'apparition aux côtés de l'incontournable PHPUnit d'outils plus originaux tels que Behat, Praspel ou atoum qui permettent au développeur de rédiger des tests plus simplement. Pourtant, nous constatons tous les jours que le test conserve une grande part de mystère pour la plupart des développeurs, Bien souvent, ces derniers ne savent pas quoi tester, et encore moins comment écrire un test efficace ou mettre en place une politique de test pertinente. Certains s'interrogent par exemple sur la pertinence de leurs tests, se demandent s'il faut absolument tout tester, d'autres s'il est possible de tester la création d'un fichier, voir même s'il est intéressant de le faire, tandis que d'autres se demandent où se situe la frontière entre le test unitaire et le test fonctionnel ou s'il est nécessaire de tester toutes les méthodes d'une classe, alors que d'autres encore ne savent tout simplement pas par où commencer. Durant cette conférence, nous allons tenter, à l'aide de nos expériences respectives de créateur de framework de tests et de doctorat en informatique spécialisé dans le test, de répondre aux questions récurrentes que se pose une personne confrontée à la mise en place d'une politique de qualité logicielle en général et à l'écriture d'un test logiciel en particulier. À l'issue de cette foire aux questions didactique et interactive, vous devriez être capable d'aborder le test, indépendamment de sa nature, de manière plus sereine et efficace et produire ainsi un logiciel de la qualité que vous désirez.
1. tribu.webf@octo.com
WWW.OCTO.COM
Maîtriser et fiabiliser son code sont
aujourd’hui devenus incontournables
pour tout développeur devant faire
face à des architectures web de plus
en plus riches et complexes.
Il existe des outils pour réaliser des tests
front-end d’applications Web et répondre
aux besoins d’un développement de qualité.
Nous vous invitons ici à parcourir l’écosystème
de ces tests front-end d’applications Web.
Que vous soyez déjà convaincus par les
tests ou tout simplement curieux, ce
document vous guidera à les mettre en
place sur vos projets.
NOUS VOUS accompagnons
DANS LA MISE EN PLACE
de frameworks
et architectures
RÉPONDANT À VOS BESOINS
d’applications Web
toujours PLUS RICHES
ET MULTIPLA+EFORMES.
L’état de l’art
des tests
front-end
L’intégration
des tests en agile
Agile
développement
02
03
04
05 06
07
08
09
P
RO
CHAINE ITÉRATIO
N
10
01
USER STORY 1
USER STORY 2
Test unitaire - fonctionnel
USER STORY N
DEMO
Retour du client
Prise en compte
des retours
Exécution et mise à jour
des tests (applicatifs, IHM
et de charge)
BACKLOG
DE PRODUIT
ITÉRATION
BACKLOG
PRODUIT
Tests unitaires
KARMA + MOCHA
Tests
fonctionnels
SELENIUM + CAPYBARA
Qualité du code
ESLINT
Tests
de sécurité
OWASP ZED ATTACK PROXY
/ SKIPFISH
Tests
multinavigateurs
SAUCELABS /
BROWSERSTACK
SELENIUM /
WEBDRIVER
Tests
applicatifs
Tests
IHM
Tests de non
régression visuelle
PHANTOMCSS
Tests d’accessibilité
OPQUAST DESKTOP
Tests
de référencement
WOORANK
Tests
de charge
Tests
de performance
WEBPAGETEST
Stress tests
GREMLINSJS
Tests de mémoire
CHROME DEV TOOLS
Performance + RobustesseErgonomie + VisibilitéSécurité + Compatibilité
Couverture du code
ISTANBUL
Métrique qualité
Test unitaire - fonctionnel
Test unitaire - fonctionnel
WWW.OCTO.COM
L’étatdel’artdestestsfront-end
2. Tests
unitaires
Ils assurent la stabilité du code en testant chaque portion (fonction)
individuellement. Les régressions seront ainsi remontées très rapidement
ce qui permettra de manipuler la base de code avec confiance.
La mise en place de tests unitaires ne coûte
pas cher en termes de developpement
(écriture et outils à mettre en place) et temps
d’exécution (de l’ordre de la seconde).
COÛTS
Sur des projets existants, sans test, il est
plus complexe de mettre en place des tests
unitaires. Il y a une étape de rétro-ingénierie
et de séparation du code avant de pouvoir
tester.
RISQUES
OUTILS
Structurer son code : Mocha (notre préféré)
ou Jasmine (supporte IE)
Écrire des assertions lisibles : Chai.js
Construire des mocks, des stubs et des spy :
Sinon.js
Exécuter des tests Karma et PhantomJS
EXEMPLE
var should = require(‘chai’).should;
var sinon = require(‘sinon’);
suite(‘get_my_friends’, function() {
test(‘should return 2 friends of mine’,function() {
var user = {
facebook_id : ‘my_facebook-id’, name : ‘my_name’
};
var friends = [
{ name : ‘friend 1’},
{ name : ‘friend 2’} ];
var stub = sinon.stub(fb, ‘getFriends’).returns(friends);
var result = get_my_friends(user);
stub.should.be.calledWith(user.facebook_id); });
});
AVEC SINON.JS ET CHAI.JS
get_my_friends
✔ should return 2 friends of mine (50ms)
✔ 1 test complete (50ms)
Tester la récupération des amis Facebook
d’un utilisateur pour les rendre à la vue :
Résultat affiché :
Tests
fonctionnels
Ils assurent la stabilité de l’application en reproduisant le parcours
d’un utilisateur sur le navigateur. Ils testent le bon fonctionnement
de l’application et remontent les régressions fonctionnelles.
D’expérience les tests fonctionnels ne sont
pas toujours stables, cela génère des faux
négatifs. Il est donc important de lancer les
tests périodiquement pour être certain que
l’erreur se reproduise.
Framework de test pour Angular : Protractor
Framework de test pour application web :
Capybara
Outil d’automatisation de tests d’interface
web : Selenium
EXEMPLE
<form name=»inscription»>
<textarea name=»comment»></textarea>
<button type=»submit»>Valider</button>
<form>
<div class=»list-comments»></div>
AVEC CAPYBARA
describe ‘Comment’’ do
it ‘should add comment’ do
visit(inscription_page)
fill_in comment, :with => “j’ajoute un commentaire’”
click_on ‘Valider’
expect(find(:css, ‘.list-comments).text).to eql(‘j’ajoute un commen-
taire’)
end
end
Tester la fonctionnalité d’ajout d’un commentaire :
1. Implémenter le fonctionnement à tester
COÛTS
Leur mise en place peut coûter cher en
termes de développement (les différents
outils à mettre en place), de temps d’exécution
(plusieurs minutes) et surtout de maintenance
(sensible aux changements HTML/JS/CSS).
2. Écrire un test fonctionnel qui vérifie la création
d’un commentaire
3. Résultat des tests en sortie s’il n’y a aucune erreur
Running E2E tests using environment settig for environment dev
...............................................
OUTILS
RISQUES
FONCTIONNEMENT
Démarrage du serveur Selenium > exécution des
tests (Protractor ou Capybara) > communication
avec Selenium via un WebDriverJS > exécution
des tests sur le navigateur.
Rejouer les tests fonctionnels sur les différents navigateurs et plateformes,
permet de fiabiliser la compatibilité de votre application.
Tests
multinavigateurs
Les coûts peuvent être importants tant sur la mise
en place de l’infrastructure, pour exécuter les
tests (navigateurs/OS), que sur la maintenance
et plus particulièrement sur mobile. Il existe des
solutions en SaaS qui répondent à ce besoin.
COÛTS ET RISQUES OUTILS
Solution SAAS : SauceLabs, BrowserStack
Infrastructure : Selenium, WebDriverJS
Navigateurs : Chrome, Internet Explorer
Plateformes : Windows
Tests
de sécurité
Le navigateur est le principal vecteur des failles de sécurité sur le web,
il est important de connaître les risques et de s’en prémunir, à la fois
pour protéger vos utilisateurs et votre application.
Il faut connaître les failles les plus critiques et
comprendre leurs concepts. Vous pouvez retrouver les
10 principaux risques de sécurité sur le web sur le site
de l’OWASP.
COÛTS OUTILS
Outils automatisation de test :
OWASP Zed Attack Proxy / Skipfish
HTML5 Security Cheatsheet :
http://html5sec.org/
Tests de non
régression visuelle
Ces tests permettent de garder une interface stable et évitent les
régressions visuelles. Ils sont destinés aux sites avec une interface
complexe ou avec un grand nombre de visiteurs.
Ils sont plutôt simples à mettre en place
car peu d’outils sont nécessaires. L’écriture
des tests est simple si on teste uniquement
des pages entières ou partielles.
COÛTS
Le résultat des tests retourne parfois des
faux négatifs causés par une intolérance
aux changements de design. Pour minimiser
les risques, évitez les parcours utilisateurs
et favorisez l’accès aux pages directement
par l’URL.
RISQUES
Framework de tests visuels : PhantomCSS
Parcours des écrans : CasperJS
Rendu des écrans : PhantomJS
Capture d’écran : CasperJS
Comparaison des écrans : Resemble.js
EXEMPLE
AVEC PHANTOMCSS
OUTILS
ET PROCESSUS
Tester la robustesse de l’application web en exécutant une multitude
d’interactions sur l’interface, de façon aléatoire, afin de permettre la
détection des points critiques, de problème de mémoire ou de performance.
Stress
tests
Simples à mettre en place, ces tests répondent
essentiellement aux besoins d’applications web
de type SPA. En revanche il peut être complexe
de détecter la source du problème.
COÛTS ET RISQUES OUTILS
Il n’existe qu’un seul outil :
Gremlins.js
EXEMPLE
AVEC GREMLINS.JS
✔
✔
✔
u0vkzi
wash the dishesdl
Call Marnie
1 item left All Active Completed Clear completed (2)
Change calendarz32ra
Double-click to edit a todo
todos
Ces tests
ne doivent être
mis en place qu’une
fois tous les autres
développements
effectués.
What do you like ?What do you like ?
Capuccino Expresso
Capuccino Expresso
Tests
d’accessibilité
Les tests vérifient que les spécifications (RGAA, AccessiWeb, WCAG)
sont correctement appliquées ou que le parcours utilisateur n’est pas
bloqué par une navigation réduite.
Audit de code : Accessibility Developer Tools /
Opquast Desktop
Validation en ligne : http://validator.w3.org
Plugin de test automatisé : capybaraaccessible
(Capybara), accessibility plugin (Protractor)
Outil en SaaS de tests de scénarios automatisés: Tanaguru
OUTILS
AMÉLIORER
L’ACCESSIBILITÉ
D’UN NAVIGATEUR
Simulateur de lecteur navigateur :
Fangs Screen Reader Simulator
Contraster les couleurs :
high contraste
Lecteur audio pour vidéo :
HTML5 Audio Description
Tests
de référencement
Un bon référencement repose sur le contenu et la structure du site,
c’est la clé pour être plus visible sur internet.
Des outils assez perfomants existent
pour améliorer son référencement. Les
solutions suggérées peuvent être difficiles
à mettre en place.
COÛTS
ET RISQUES OUTILS
Audit de code : Google tools for webmasters
Évolution du classement : https://www.woorank.com/fr
Extension Chrome : SEOquake
Référenciel pour les données structurées : schema.org
Tests d’endurance/
mémoire
Les applications web (SPA, RIA), peuvent bloquer le navigateur à cause
de «fuites mémoires». Elles sont caractérisées par une augmentation
permanente de la mémoire et sont difficiles à détecter.
OUTILS
Profilage de l’usage de la mémoire :
Chrome Dev Tools
DÉTECTER LES FUITES
Le principe consiste à lancer le profileur de
mémoire, à faire fonctionner l’application,
et à vérifier qu’il n’y ait pas une hausse
anormale de la quantité de mémoire utilisée.
COMMENT
FONCTIONNE
UN TEST DE MÉMOIRE ?
5500 ms 6000 ms 6500 ms 7000 ms 7500 ms 8000 ms 8500 ms 9000 ms
5000 ms 5500 ms 6000 ms 6500 ms 7000 ms 7500 ms 8000 ms
1
2
INVESTIGUER
On commence par trouver un scénario
utilisateur qui permette de reproduire la
fuite de manière systématique. Une fois cela
fait, une technique consiste à prendre des
snapshots de la pile mémoire en début et
fin de scénario, et comparer leur contenu :
on doit normalement voir apparaître les
objets qui ne sont jamais supprimés.
Les performances d’une application web ne reposent plus uniquement
sur la partie serveur. Un travail d’optimisation doit aussi être réalisé
côté navigateur.
Tests
de performance
OUTILS
Solution SaaS :
Google Page Speed Insight,
WebPageTest, AgileLoad
EXEMPLE
AVEC WEBPAGETEST
Elements Network Sources Timeline Profiles Resources Audits Console
Comparison Snapshot 1Class filter
Alloc. Size#Deleted#New
(array)
(closure)
Object
(system)
Array
system / Context
(string)
ua
HTMLOptionElement
NodeList
(compiled code)
ga
NamedNodeMap
Comment
Text
HTMLDivElement
DocumentFragment
(concatenated string)
(sliced string)
Detached DOM tree / 3 entr...
HTMLParagraphElement
HTMLLabelElement
HTMLInputElement
f
b
g
Detached DOM tree / 1 entr...
h
14 886
7 732
4 643
7 604
3 224
2 810
2 135
1 921
1 194
730
3 318
483
403
278
250
181
140
209
112
98
113
80
65
55
85
53
32
0
10 399
7 510
4 408
3 195
3 027
2 631
1 860
1 859
1 194
699
689
483
403
247
219
181
140
139
111
98
82
80
65
55
54
50
32
29
Constructor #Delta
+4 487
+222
+235
+4 409
+197
+179
+275
+62
0
+31
+2629
0
0
+31
+31
0
0
+70
+1
0
+31
0
0
0
+31
+3
0
-29
1 878 616
556 704
249 528
258 024
103 168
263 552
85 120
61 472
47 760
29 200
1 391 472
27 048
16 120
11 120
10 000
7 240
5 600
8 360
4 480
0
4 520
3 200
2 600
2 200
12 872
2 496
0
0
https://google.fr
1. google.fr - /
2. www.google.fr - /
3. www.google.fr...color_272x92dp.png
4. www.google.fr...nav_logo231.png
5. ssl.gstatic.com - i1_1967ca6a.png
6. www.google.fr...vvDKunayNbav0cnV1w
7. www.gstatic.com...j_B28_if02IKAozw
8. www.google.fr...bf56be55ea651do.js
9. www.google.fr...-Kq-S4bYgd16V7K41g
10. www.google.com - gen_204
11. www.google.com - tia.png
12. apis.google.com - cb=gapi.loaded_0
13. www.google.fr - gen_204
14. www.google.fr - google_lodp.ico
CPU Utilization
BandwidthIn (0 - 5,000 Kbps)
0.2 0.4 0.6 0.8 1.0 1.2 1.4 1.6 1.8 2.0 2.2 2.4
456 ms
246 ms
163 ms
203ms
420 ms
278 ms (301)
330 ms
204 ms
236 ms
185 ms
355 ms
283 ms
48 ms
49 ms
0.2 0.4 0.6 0.8 1.0 1.2 1.4 1.6 1.8 2.0 2.2 2.4