Cypress Test: How to Separate Test Data Using Fixture

End to end testing using cypress: fixtures
Cypress Fixture

In this article, I will show you how to separate test data from the test script. While designing a Test Automation Framework, it is important to segregate the test scripts from the test data. With help of fixtures, Cypress is capable to do that.

What is a fixture in Cypress?

Cypress fixtures are used to store test data for automation, and the fixtures folder is placed inside the Cypress project. The fixtures folder contains JSON files, which contain test data that can be read by multiple tests. We store this data in a key-value format, which allows us to access it in our test scripts.

How to use Fixtures in Cypress Tests?

For this article’s simulation, I will use a dummy test automation website from zero.webappsecurity.com.

This site is published by Micro Focus Fortify for the sole purpose of demonstrating the functionality and effectiveness of Micro Focus Fortify’s WebInspect products in detecting and reporting Web application vulnerabilities.

This site is not a real banking site and any similarities to third-party products and/or Web sites are purely coincidental. To access the website, you can click the link below.

Write the test data

The test data is stored in the fixtures folder:

Fixtures folder in cypress hierarchy
Fixtures folder in cypress hierarchy

Within the folder, create a file in JSON or other formats, and the data is maintained in “key:value” pairs. For this login simulation, I will create JSON and name it user.json. We can specify our test data with the following values:

{
“username”: “invalid_username”,
“password”: “invalid_password”
}

The implementation automation testing in Cypress is as follows:

describe(‘Login with Fixture Data’, ()=>{
it(‘should try to login’, () =>{
cy.visit(‘http://zero.webappsecurity.com/login.html')

cy.fixture(‘user’).then(user => {
const username = user.username
const password = user. password
cy.get(‘#user_login’).type(username)
cy.get(‘#user_password’).type(password)
cy.contains(‘Sign in’).click()
})
})
})

As we can see, I use cy.fixture to call the data from the fixture file “user.json” and use the values obtained to fill in the username and password fields. Save the above test files as and run the test as per the steps mentioned in the article “Cypress Test: Create your first End-to-End Testing”.

Loop a dynamic test data

In this section, I will show you, how the fixture file is consist of an array and want to use all the data as test data. I will create JSON and name it userDynamic.json with the following values:

{
“data”: [
{
“username”: “username1”,
“password”: “password1”
},
{
“username”: “username2”,
“password”: “password2”
}
]
}

The implementation automation testing in Cypress is as follows:

describe(‘Login with Fixture Data’, ()=>{
it(‘should try to login’, () =>{
cy.visit(‘http://zero.webappsecurity.com/login.html')

cy.fixture(‘userDynamic’)
.its('data')
.then(user => {
user.forEach((user) => {
const username = user.username
const password = user. password
cy.get(‘#user_login’).type(username)
cy.get(‘#user_password’).type(password)
cy.contains(‘Sign in’).click()
})
})
})
})

Save the above test files as and run the test. It will iterate array data from dataDynamic.json and use the values obtained to fill in the username and password fields.

Conclusion

The fixture provides segregation between test data and test script and allows the uses external data to be used in the test. It also allows the test to use multiple input data.

Follow me on

Facebook: https://www.facebook.com/mydoqa/

Instagram: https://www.instagram.com/mydoqa/

Twitter: https://twitter.com/MydoQa

This article is a part of the Cypress Test series. To read another story, please follow the links below:

Cypress Test Series:

API Test Series:

Software Testing Series:

Resources

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store