π οΈJobsity Challenge: Test Automation with Cypress for Magento E-Commerce π
June 25, 2024 Β· View on GitHub
Welcome to the Jobsity Challenge! This project involves creating automation scripts for "Orders and Returns" validations on a Magento E-Commerce website. The objective is to ensure the robustness and reliability of the e-commerce platform by leveraging cutting-edge tools and best practices in test automation.
π Table of Contents
- Project Overview
- Tech Stack
- Getting Started
- Project Structure
- Running the Tests
- Continuous Integration
- Reporting
π #Project Overview
This repository contains the test automation scripts for the "Orders and Returns" functionalities of a Magento E-Commerce site. The scripts are designed using the Page Object Model (POM) design pattern to enhance code reusability and maintainability.
π οΈ Tech Stack
- TypeScript & JavaScript
- Cypress: The idea behind selecting this tool is because it's fast, reliable and a featured tool.
- POM Design Pattern
- FakerJS: To generate Dynamic Data
- Docker-Compose
- GitHub Actions
- Allure Report: A flexible lightweight multi-language test report tool.
π Getting Started
Prerequisites
Ensure you have the following installed on your local machine:
- Node.js
- Docker
- Docker-Compose
Installation
-
Clone the repository:
git clone https://github.com/Moaaz-Adel/Jobsity-Challenge.git -
Change the current directory to be inside the cloned repo:
cd Jobsity-Challenge -
Install dependencies:
npm install
π Project Structure
Jobsity-Challenge/
β
βββ cypress/
β βββ fixtures/ # Test data files
β βββ e2e/ # Test cases
β βββ plpages # Page Obejects
β βββ support/ # Custom commands and POM
β
βββ docker-compose.yml # Docker Compose configuration
βββ cypress.config.ts # Cypress Configureation
βββ package.json # Project dependencies
βββ tsconfig.json # TypeScript configuration
βββ README.md # Project documentation
βΆοΈ Running the Tests
To run the tests Locally type the following commands:
- Interactive Mode:
npx cypress open(open the tests with the browser) - Headless Mode Without generating Allure Report
npm run cy:test:run- Will generate a mocha report only (Report located in "cypress/reports/index.html")
- Headless mode with Allure Report Enabled:
npm run cy:test:report- Will generate an allure report automatically & Mocha report
- One Command to run Tests in Headless Mode, Generate report and serve it automatically:
npm run allure:clear ; npm run cy:test:run ; npm run allure:generate ; npm run allure:serve
Test Result:
Note
Test Run Screen Records available on Notion
π₯ Using Docker-Compose
Just run the following Command:
docker-compose run e2e-chrome
And to run on different browsers replace "chrome" with:
- e2e-firefox
- e2e-electron
Note: You can run on all browsers using the command without specifying the browser type:
docker-compose run
and to try different browsers replace chrome with:
e2e-firefox e2e-electron
βοΈ Continuous Integration
The configuration file for GitHub Actions is located in .github/workflows/.
Triggering CI Pipeline On each pull request or push to the main branch, the CI pipeline will be triggered automatically.
Tip
Test Run Screen Records available on Notion
πββοΈ Test Results:
Allure Report (If allure is installed):
Mocha Awesome (Always will be generated):
π Reporting
Generate Allure Report Run the tests with Allure:
npx cypress run --env allure=true
Generate the report:
allure generate allure-results --clean
Serve the report:
allure Serve
Notes:
All interactions are configured and refactored to include:
"Retries" to decrease Flakeness
The refactored methods are documented for ease of use and understanding
Following Page Object Model (POM) Design Pattern
Following Coding Standards and Best Practices
Happy Testing! πβ¨