@nafisha-maharjan/cypress

A simple, powerful, and reusable Cypress framework helper library.
Calculated to help you write better tests faster by providing ready-made utilities and a Page Object structure.

🚀 What is this?

This is a "Smart Enterprise Framework" for Cypress.
When you install this package, it automatically sets up a robust folder structure in your project. You don't have to manually create your Page Objects or Helper files—we do it for you!

📦 Installation

Run this command in your project terminal:

npm install @nafisha-maharjan/cypress --save-dev

✨ What happens next?

Once installed, the library automatically creates a cypress/support/framework folder in your project containing:

| Module | Description | | :--- | :--- | | 📁 pom/ | Contains Page Object Models (e.g., ExamplePage.js) to organize your selectors and actions. | | 🛠️ utils/ | Contains helper classes like ClickHelper, AssertHelper, and FakerHelper. |

Note: These files are now physically in your project! You can edit them, customize them, and make them your own.

📖 How to Use

Since the files are copied to your project, you can import them directly into your tests.

1. Using Page Objects

Instead of writing selectors in your test, use the Page Object Model.

// cypress/e2e/login_test.cy.js

// Import from your local framework folder
import { ExamplePage } from '../support/framework/pom/ExamplePage';

describe('Login Test', () => {
    const loginPage = new ExamplePage();

    it('should login successfully', () => {
        loginPage.visit();
        loginPage.login('username', 'password');
    });
});

2. Using Utilities

Make your tests simplified using our helpers.

Click Helper:

import ClickHelper from '../support/framework/utils/ClickHelper';

ClickHelper.click('#submit-button');
ClickHelper.forceClick('.hidden-button');

Assertion Helper:

import { AssertHelper } from '../support/framework/utils/AssertHelper';

AssertHelper.assertText('#welcome-msg', 'Hello User');
AssertHelper.assertVisible('.dashboard');

Faker Helper (Random Data):

import { FakerHelper } from '../support/framework/utils/FakerHelper';

const randomEmail = FakerHelper.getEmail();
const randomName = FakerHelper.getName();

3. Using Custom Commands

We have included some ready-to-use custom commands.

To use them, import the commands file in your cypress/support/e2e.js (or cypress/support/commands.js) file:

// cypress/support/e2e.js
import './framework/commands/customCommands'; 

Now you can use them in your tests:

cy.getDataCy('submit-button'); // Selects element with data-cy="submit-button"
cy.isVisible('#header');       // Asserts elements is visible
cy.login('user', 'pass');      // Example login command

❓ FAQ

Q: Can I edit the files in cypress/support/framework?
A: Yes! That is the point. We give you a starting foundation, and you can modify it to fit your specific application needs.

Q: What if I install the package again?
A: The installer checks if files exist. It generally skips overwriting your changes, so your work is safe. But always use Git to track your changes!

👨‍💻 Author

Nafisha Maharjan