Cypress API Testing

Cypress is a next generation front-end testing tool used to automate Unit Testing, Integration Testing, API Testing and especially End-to-End Testing. Even though every tester knows the advantages of End-to-end testing, they may not be interested in writing it. The reason is because it takes more time and needs more integration of several tools / frameworks to achieve End-to-End testing. Cypress is a wonderful tool which provides a testing platform to create End-to-End testing of modern web applications with minimal configuration and uses JavaScript for implementation.

Why Cypress?

As DevOps methodology evolved, nowadays we start testing from very early stages of Development phase which helps to achieve quality, right from the beginning of implementation. So developers also in need of some testing tool which could be used during development of web applications where most of the frond-end are developed with modern web technologies like Angular, Vue, React, Elixir etc…

API Testing in Cypress

Most of the application’s core functionalities are developed as APIs for easy maintenance. So before the application is ready, we could start with Functional API testing. Cypress provides great support for API testing.

Objective of this article is :

• Cypress Setup
• API Tests — Validate Header
• Validate status code
• Validate Content
• Create User
• Update User

Cypress Setup

1. Create a project folder (cypress-apitesting) in workspace.
2. Ensure nodeJS is installed in your system.
3. Install VS Code Editor
4. Move to folder and install cypress from VC Code.
5. npm install cypress

Cypress test specs should be created under projectfolder/cypress/integration folder.

To start interacting with API endpoints use,

• cy.request(url)
• cy.request(url, body)
• cy.request(method, url)
• cy.request(method, url, body)
• cy.request(options)

Our First API Program

To check the header

describe(‘Rest API Test with Cypress’, () => {
const baseUrl = ‘https://jsonplaceholder.typicode.com/'
const empUrl = ‘http://dummy.restapiexample.com/api/v1/'
it(‘API Test — Validate Headers’, () => {
cy.request(baseUrl.concat(‘users/3’)).as(‘user’)
cy.get(‘@user’)
.its(‘headers’)
.its(‘content-type’)
.should(‘include’, ‘application/json; charset=utf-8’)
})

Here,

cy.request(baseUrl.concat(‘users/3’)).as(‘user’)

cy.request() will talk to endpoint and response as an object containing properties such as

• status
• body
• headers
• duration

Above, .as(‘user’) is alias the request.

To check the status code

//To check statuscode
it(‘API Test — Validate statuscode’, () => {
cy.request(baseUrl.concat(‘users/3’)).as(‘user’)
cy.get(‘@user’).its(‘status’).should(‘equals’, 200)
})

To check the content

Here checking the number of employee details and verifying first employee name.

//To check content
it(‘API Test — Validate Content’, () => {
var url
cy.request(empUrl.concat(‘employees’)).then((response) => {
expect(response.body.data[0].employee_name).equal(‘Tiger Nixon’)
expect(response.body.data).to.have.length(24)
})
})

To create new user

//To Post user
it(‘API Test — Create user’, () => {
var user = {
id: 11,
name: ‘Anandhi’,
email: ‘email@gmail.com’
}
cy.request(‘POST’, baseUrl.concat(‘users’), user).then((response) => {
expect(response.status).equal(201)
expect(response.body.id).equal(user.id)
expect(response.body.name).equal(user.name)
expect(response.body.email).equal(user.email)
})
cy.request('POST', baseUrl.concat('users'), user)
.its('body')
.should('include', { name: 'Anandhi' })
})

Note: Really resources will not be created in the server.

To update user detail

it(‘API Test — Update user’, () => {
var user1 = {
name: ‘Anandhi’,
email: ‘udpatedEmail@gmail.com’,
}
cy.request(‘PUT’, baseUrl.concat(‘users/1’), user1).then((response) => {
expect(response.status).equal(200)
expect(response.body.name).equal(user1.name)
expect(response.body.email).equal(user1.email)
})
cy.request('PUT', baseUrl.concat('users/1'), user1)
.its('body')
.should('include', { email: 'udpatedEmail@gmail.com'})
})

Command for executing in browser

  npx cpress open

Command for executing in headless

 npx cypress run –spec “cypress/integration/validateUserAPI.spec.js” –headless

Reference

https://www.cypress.io/blog/2017/11/07/add-gui-to-your-e2e-api-tests/

Conclusion

It concludes, Cypress makes a way to achieve End-to-End testing by provisioning API Testing, Visual Testing, Integration Testing… all in one tool.