Tester un site avec CodeceptJS

WordCamp MTL 2019

Présentation par Sariha

Sariha Chabert

@_sariha

Pourquoi tester un site ?

  • Eviter d'introduire de nouveaux bugs
  • Eviter les bugs de regression
  • Avoir une connaissance approfondie d'un site
  • Tranquilité d'esprit

La chasse aux bugs...

Les bugs du chef

le programmeur teste son code.

Le chef des bugs

Le contrôle qualité

Le client trouve un bug

Le bug en production

Les tests automatisés

  • Test unitaires
  • Tests fonctionnels / Acceptance / End-to-end

Quand coder les tests ?

  • Dès le début du projet
  • Au cours du développement
  • A chaque nouvelle fonctionnalité
  • Quand un bug est découvert

C'est difficile d'écrire tous les tests d'un coup.

Quand exécuter les tests ?

  • Au cours du développement
  • Lors des déploiements en beta
  • Aux retours du contrôle qualité
  • Avant et après la mise en production
  • Périodiquement

Multiplier les exécutions de tests grâce au déploiement continu

Choisir un outil de testing

Comment ça s'est passé chez nous ?

À tâton ..

Maître controleur qualité

Les tests sont faits manuellement à la fin d'un projet.

Mais..
Il est possible d'automatiser certaines tâches répétitives avec une extension pour les navigateurs !

Cool cool cool

Nos besoins

  • Écriture des test faciles
  • Tester des fonctionnalités interactives
  • Exécution des tests en local
  • Exécution automatisée lors d'un push avec git

Automatisation

Katalon recorder
Extension pour chrome, permet de génerer des suites de tests.

+ Robot Framework

								*** Test Cases ***
								  Login
									open  /fr/
									setViewportSize  1024    840
									click  xpath=//a[contains(text(),'Login')]
									type  id=login_user    sariha
									type  id=login_pass    CatCat
									click  id=button_connect
									Wait Until Page Contains  Vous êtes maintenant connecté!
							

CodeceptJS

+ puppeteer

Les autres

  • Cypress
  • CasperJS
  • Protractor
  • Nightwatch.js
  • TestCafe

CodeceptJS

codecept.io

Installation

Prérequis

  • Quelques notion de ligne de commande
  • NodeJS 8.9 ou plus

Installer codecpetJS & puppeteer


								npm install codeceptjs puppeteer --save-dev
							

Initialiser le projet codeceptJS


								npx codeceptjs init
							

Mon premier test..

npx codeceptjs gt

(Démo)

Rapports de tests

  • Retour de la ligne de commande
  • JSON / XML
  • Allure
  • Html : Mochawesome

Mochawesome

Conclusion

  • Faire des tests automatisés c'est pas si compliqué
  • C'est rassurant
  • On gagne du temps à moyen et long terme

Questions ?

la documentation se trouve sur codecept.io

slides ici : sariha.com/wordcamp

Merci !

@_sariha