This sample futuristic libation order application showcases how to use a common test suite for e2e test suites run within CI pipelines that can also be used for Synthetic Monitoring. It is the main example showcased within the talks Ctrl > Shift > Left > Right: Joining Dev and Support Forces Together Using e2e Testing and Synthetic Monitoring and Synthetic Monitoring and E2E Testing: 2 Sides of the Same Coin. These talks have been given at several conferences and meetups, including:
- Front Endgineers
- Devoxx UK 2023
- React Summit 2023
- SRE Day
Details of the approach are also provided in the blog Two sides of the same coin: Uniting testing and monitoring with Synthetic Monitoring.
The application is built using Svelte and Vite.
The aim is to meet the objective of allowing developers, QA engineers, operations agents, and SRE and DevOps experts to use a common approach to test and monitor an application. For this experiment, the following approach is used:
- e2e test journeys written using Playwright and Elastic Synthetics.
- Execution of the e2e test suite within CI using GitHub Actions.
- Upload of the Synthetic tests from GitHub Actions to Elastic Synthetics.
Before running locally please ensure you have the following pre-requisites installed:
Start synthetics-replicator app:
npm install
nx serve synthetics-replicator
Running the synthetics suite (requires a locally running synthetics-replicator app):
cd apps/synthetics-replicator-tests
npm install
cd ../../
npm run test
The e2e suite serves locally at http://localhost:5173/ both on your local machine and within the CI job.
For the deployed production instance, Elastic Synthetics pings a live production instance hosted on Netlify at https://synthetics-replicator.netlify.app/.
- Allergen Information: 14 Allergens | Food Standards Agency
- Drinks: The Geeky Bartender by Cassandra Reeder, The Geeky Chef
- Food & Drinks: The Geeky Chef Cookbook by Cassandra Reeder, The Geeky Chef