---
# System prepended metadata

title: Untitled

---

![](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
