What are Cypress fixtures and how to use them?

 

Best Cypress Training Course Institute in Hyderabad

In the fast-evolving landscape of web development and quality assurance, Cypress testing has become a game-changer in the world of front-end automation testing. For those aspiring to master Cypress and launch a successful career in software testing, Quality Thought stands out as the best Cypress training institute in Hyderabad.

Whether you're a graduate, postgraduate, someone with an education gap, or a job domain changer, Quality Thought has designed a career-transforming Cypress course that meets your unique need

What are Cypress Fixtures?

In Cypress, a fixture is a way to store and reuse test data.
They are basically external JSON or other static files (like .json, .csv, .txt) placed inside the cypress/fixtures folder.

Instead of hardcoding data inside your test, you can keep it in a fixture file and load it whenever needed.

👉 Example: User credentials, API response mocks, test input data.

🔹 Why use Fixtures?

• Keeps test code clean and readable.

• Easy to reuse test data across multiple test files.

• Useful for data-driven testing (looping through multiple sets of input).

• Helps in mocking API responses.

🔹 How to Use Cypress Fixtures?

1. Create a Fixture File

Inside cypress/fixtures/, create a file named user.json:

{
  "username": "testUser",
  "password": "123456",
  "email": "test@example.com"
}

2. Load Fixture in a Test

You can load and use it inside your Cypress test:

describe('Login Test using Fixtures', () => {
  it('should login with fixture data', () => {
    cy.fixture('user').then((userData) => {
      cy.visit('/login')
      cy.get('#username').type(userData.username)
      cy.get('#password').type(userData.password)
      cy.get('button[type="submit"]').click()
    })
  })
})

3. Using beforeEach for Multiple Tests

If you want the data available in multiple tests:

describe('User Tests', () => {
  let userData;

  beforeEach(() => {
    cy.fixture('user').then((data) => {
      userData = data;
    });
  });

  it('check username exists', () => {
    expect(userData.username).to.equal('testUser');
  });

  it('use email for signup', () => {
    cy.visit('/signup');
    cy.get('#email').type(userData.email);
  });
});

4. Using Fixtures with cy.intercept() (Mock API)

Fixtures are powerful for mocking API responses:

describe('Mock API with Fixtures', () => {
  it('should mock API response using fixture', () => {
    cy.intercept('GET', '/api/users', { fixture: 'users.json' }).as('getUsers');
    cy.visit('/users');
    cy.wait('@getUsers');
    cy.get('.user-list').should('contain', 'John Doe');
  });
});

Here, users.json in fixtures might look like:

[
  { "id": 1, "name": "John Doe" },
  { "id": 2, "name": "Jane Smith" }
]

Read More:

How do you write your first test in Cypress?

How does Cypress handle asynchronous code?

Which is the most affordable Cypress course in Ameerpet?

What are the best Cypress institutes in Hyderabad?

Is there any Cypress internship program in Hyderabad?

Visit Quality Thought Training institute in Hyderabad