![](https://www.mobiapps.fr/wp-content/uploads/2022/05/Logo_Playwright-768x131.png) <br/><br/> ## Importance des tests <br/><br/> ![Pyramide](https://learn.cypress.io/images/testing-foundations/automated-tools-pyramid.png) <!-- ![](https://res.cloudinary.com/dg3gyk0gu/image/upload/v1539186394/theTestingTrophy_2x.png) --> <!-- <img src="https://res.cloudinary.com/dg3gyk0gu/image/upload/v1539186394/theTestingTrophy_2x.png" height="600"/> --> <br/><br/> <br/><br/> <br/><br/> ## Importance des tests e2e <!-- ![](https://www.perfecto.io/sites/default/files/image/2022-09/social-blog-cypress-vs-playwright.jpg) --> ![Selenium vs Playwright vs Cypress](https://i.imgur.com/kUNxpDh.jpg) <!-- ![Chart 1v1](https://www.zeljkovic.sh/wp-content/uploads/2022/09/star-history-2022913-2048x1457.png) --> ![Chart 1v1v1](https://i.imgur.com/lb8KlT3.png) ## Demo 1 - Test court ![](https://i.imgur.com/GTHgZBT.png) - Montrer ce que l'on veut tester https://playwright.dev/ - Mettre `only` sur le test - Lancer le test `yarn e2e` - Rapport `yarn e2e:report` - Introduire une erreur. Rapport automatique - Debug avec le trace viewer `yarn e2e:trace` - Debug avec le debugger `e2e:debug` - Activer la vidéo. `yarn:e2e` - Fix erreur, enlever le `only` ## Demo 2 - Test long ![](https://i.imgur.com/ah2ClPe.png) - Montrer ce que l'on veut tester https://demo.playwright.dev/todomvc/#/ - Mettre `only` sur test - Lancer le test `yarn e2e` - Lancer en mode headed `yarn e2e:headed` - Mode `slowMo 1000ms` dans `playwright.config.ts` - Relancer en mode headed `yarn e2e:headed` - Désactiver `fullyParallel` et mettre `slowMo 200ms` - Relancer les tests en mode headed `yarn e2e:headed` - Enlever le `only` et remettre les options par défaut ## Demo 3 - Astrée ![](https://i.imgur.com/O9eqtyz.jpg) - Lancer Astrée - Montrer Astrée http://127.0.0.1:5173/ - Montrer Codegen `e2e:codegen` (entrer manuellement l'url) - Copier et lancer le test