https://github.com/waseemofficial/cypress_js
Software testing in JavaScript using Cypress
https://github.com/waseemofficial/cypress_js
cypress javascript json test-automation
Last synced: about 2 months ago
JSON representation
Software testing in JavaScript using Cypress
- Host: GitHub
- URL: https://github.com/waseemofficial/cypress_js
- Owner: waseemofficial
- Created: 2023-10-22T09:04:15.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-07-23T12:20:13.000Z (12 months ago)
- Last Synced: 2025-10-24T13:28:22.835Z (9 months ago)
- Topics: cypress, javascript, json, test-automation
- Language: JavaScript
- Homepage:
- Size: 53.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![]()
### Languages
### Technologies
# Cypress
## Cypress JavaScript Automation Framework
This repository contains an automation framework for end-to-end testing of web applications using Cypress and JavaScript. The framework is designed to provide a robust, scalable, and maintainable solution for modern web application testing.
## Features
- Cypress Integration: Leverages the power of Cypress for fast, reliable, and easy-to-write tests.
- Page Object Model (POM) Design Pattern: Promotes modularity and reusability by separating test logic from page-specific logic.
- Custom Commands: Extends Cypress functionality with custom commands for reusable actions.
- Fixtures for Test Data: Uses JSON files for managing test data, ensuring clean and maintainable test scripts.
- Cross-Browser Testing: Supports testing across multiple browsers (Chrome, Firefox, Edge, etc.).
- CI/CD Ready: Easily integrates with CI/CD tools like GitHub Actions, Jenkins, or CircleCI.
- Detailed Reporting: Generates comprehensive test execution reports using Mochawesome.
## Prerequisites
Before running the tests, ensure you have the following installed:
- Node.js (v14 or higher)
- npm (Node Package Manager)
- Cypress (installed via npm)
- IDE (Visual Studio Code, WebStorm, or any preferred IDE)
## Setup Instructions
Clone the Repository:
```bash
git clone https://github.com/waseemofficial/Cypress_js.git
cd Cypress_js
```
### Install Dependencies:
Run the following command to install all required dependencies:
>:information_source: **Information**
>
>npm install cypress --save-dev
```bash
npm install
Run Tests:
```
### Execute the tests using the following command:
```bash
npx cypress run
```
### To open the Cypress Test Runner in interactive mode, use:
```bash
npx cypress open
```
## Project Structure
```
Cypress_js/
├── cypress/
│ ├── e2e/ # Test specs
│ ├── fixtures/ # Test data (e.g., JSON files)
│ ├── pages/ # Page classes for POM
│ ├── plugins/ # Cypress plugins
│ ├── support/ # Custom commands and utilities
│ └── videos/ # Recorded test executions
├── cypress.config.js # Cypress configuration file
├── package.json # npm dependencies and scripts
├── README.md # Project documentation
└── .gitignore # Files and directories to ignore
```
## Example Test
Here’s an example of a test case using the Cypress framework:
```javascript
import LoginPage from '../pages/LoginPage';
import HomePage from '../pages/HomePage';
describe('Login Test Suite', () => {
it('should log in successfully with valid credentials', () => {
const loginPage = new LoginPage();
const homePage = new HomePage();
loginPage.visit();
loginPage.enterUsername('testuser');
loginPage.enterPassword('password123');
loginPage.clickLoginButton();
homePage.verifyWelcomeMessage('Welcome, testuser!');
});
});
```
## Custom Commands
Custom commands are defined in cypress/support/commands.js to simplify repetitive tasks. Example:
```javascript
Cypress.Commands.add('login', (username, password) => {
cy.get('#username').type(username);
cy.get('#password').type(password);
cy.get('#login-button').click();
});
```
## Reports
After test execution, detailed reports are generated using Mochawesome. You can find the reports in the cypress/reports directory. To generate and view the report, run:
```bash
npx cypress run --reporter mochawesome
```
## CI/CD Integration
This framework is CI/CD-ready and can be integrated with tools like GitHub Actions, Jenkins, or CircleCI. Example GitHub Actions workflow (.github/workflows/cypress-tests.yml):
```yaml
name: Cypress Tests
on: [push]
jobs:
test:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v2
- name: Install dependencies
run: npm install
- name: Run Cypress tests
run: npx cypress run --headless
```
## Contributing
Contributions are welcome! If you'd like to contribute, please follow these steps:
- Fork the repository.
- Create a new branch for your feature or bugfix.
- Submit a pull request with a detailed description of your changes.
## License
This project is licensed under the MIT License. See the LICENSE file for details.
Error:
[](https://cloud.cypress.io/projects/xvvhay/runs)
[](https://cloud.cypress.io/projects/xvvhay/runs)