This project demonstrates frontend testing using Cypress, Gherkin, and TypeScript. It showcases how Behavior Driven Development (BDD) can be integrated into the testing process.
-
Clone this repository:
git clone https://github.com/hello434/frontendTests.git
-
Install dependencies:
npm install
-
Open Cypress:
npx cypress open
-
To run tests in headless mode:
npx cypress run
This project uses GitHub Actions to automatically run tests every time changes are pushed to the main branch or when a pull request is opened. You can also manually trigger the tests via the GitHub Actions interface.
To manually run the tests:
- Go to the Actions tab in the repository.
- Select the Run Cypress Tests workflow.
- Click on the Run workflow button.
The pipeline automatically:
- Installs dependencies
- Runs all Cypress tests
This ensures that the test suite passes before any changes are merged into the main branch.
-
Successful login with valid credentials
- Feature: Login page
- Purpose: Test successful login with valid credentials
- Background:
- Given User opens login page
- Steps:
- Then User fills valid login
- Then User fills valid password
- When User clicks on login button
- Then User successfully logs in
-
Successfully add product to a cart and succesfully order it
- Feature: Product List
- Purpose: We are testing this scenario to ensure that users can successfully add a product to the cart, complete the checkout process, and place an order without any issues.
- Background:
- Given User is on product list page
- Steps:
- When User clicks on random item
- When User clicks to add to cart button from product description page
- Then User clicks to shopping cart button
- Then Product was successfully added to shopping cart
- When The user clicks on the Checkout button
- Then User fills first name
- Then User fills last name
- Then User fills postal code
- When The user clicks on the Continue button
- Then The user checks the order and makes sure that the product is the same
- When The user clicks on the Finish button
- Then The order was successfully completed
- Cypress - Frontend testing tool
- TypeScript - Programming language used for development
- Gherkin - BDD language for writing test scenarios
- Cucumber Preprocessor - For integrating Gherkin with Cypress
- ESLint - Tool for identifying and fixing problems in JavaScript/TypeScript code
- Faker.js - Library for generating fake data in tests