yarn add puppeteer --dev
- Generate screenshots and PDFs of pages.
- Crawl a SPA (Single-Page Application) and generate pre-rendered content (i.e. "SSR" (Server-Side Rendering)).
- Automate form submission, UI testing, keyboard input, etc.
- Create an up-to-date, automated testing environment. Run your tests directly in the latest version of Chrome using the latest JavaScript and browser features.
- Capture a timeline trace of your site to help diagnose performance issues.
- Test Chrome Extensions.
yarn add cypress --dev
- Time Travel: Cypress takes snapshots as your tests run.
- Debuggability: Stop guessing why your tests are failing
- Automatic Waiting: Never add waits or sleeps to your tests.
- Spies, Stubs, and Clocks: Verify and control the behavior of functions, server responses, or timers.
- Network Traffic Control: Easily control, stub, and test edge cases without involving your server.
- Consistent Results: The architecture doesn’t use Selenium or WebDriver.
- Screenshots and Videos: View screenshots taken automatically on failure, or videos of your entire test suite when run from the CLI.
- Cross browser Testing: Run tests within Firefox and Chrome-family browsers (including Edge and Electron) locally and optimally in a Continuous Integration pipeline.
Playwright is built to automate the broad and growing set of web browser capabilities used by Single Page Apps and Progressive Web Apps.
- Scenarios that span multiple page, domains and iframes
- Auto-wait for elements to be ready before executing actions (like click, fill)
- Intercept network activity for stubbing and mocking network requests
- Emulate mobile devices, geolocation, permissions
- Support for web components via shadow-piercing selectors
- Native input events for mouse and keyboard
- Upload and download files
To install Headless Recorder, go to the Chrome Webstore and install it
- Records clicks and type events.
- Records form entries like dropdowns, radio buttons, checkboxes etc.
- Records screenshots.
- Adds waitForNavigation, setViewport/setViewportSize and other useful clauses.
- Generates a Puppeteer or Playwright script, ready for copy & pasting.
- Shows which events are being recorded.
- Offers configuration options to tweak the generated code.
- Is open source. Check the code on the GitHub repo!
CMO : E2E
POC : Mise en place des tests End To End (e2e).
Objectif : Atomatiser le test de la création d'une CMO.
Benchmark solution E2E : https://gist.github.com/mikamboo/7eec04b08ecb64e80145c045a24c7d12
Stack
Nous utiliserons :
Installation
Cypress est un projet nodejs qui peut s'ajouter simplement en une commande :
Plus de détails dans la doc officielle
Mise en place des test
Mode DEV
"cypress:open": "cypress open"
dans la sections scripts dupackage.json
.yar rnu cypress:open
Mode CI
Sur un environnement CI/CD n à plus d'interface graphique pour gérer les tests.
Tout doit se faire en mode serveur et en particulier l’environnement navigateur est exécuté en mode headless (sans UI).
//TODO :