Getting started with API testing using Cypress

Siddharth Murugan
3 min readSep 19, 2021

--

API call with Cypress.io

Are you new to Cypress and excited to learn about API testing with Cypress? Then this article is for you!

I never knew that Cypress has a separate function to do API call. Yes, we can do all API call with cy.request(). Before proceeding further, you need to install Cypress in your system. Please refer here to install cypress — Cypress installation.

Sign up weather API:

To demonstrate this API call, I have made use of public weather API and you can sign up here.

Once you are done, you will get a secret API access key which you can use it to access the data. Try to call the same API with POSTMAN manually to confirm whether it is working fine.

Postman screenshot with 200 status code

Cypress command to make API call:

To make Cypress API call, Cypress has provided command cy.request() and below is the syntax provided in the Cypress documentation,

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

In our case for weather API, we may need to provide method, url and query params mandatory to make successful API call. Below are the parameters which we need to pass through cy.request() function,

method:'GET'
url:'http://api.weatherstack.com/current'

Passing query params:

But how do we pass query params with the cy.request() function? I had that question and I got the answer too in the documentation provided by Cypress — here

Documentation shows how to pass query parameters

Yes, as mentioned in the documentation we need to pass query parameters as “qs”. So our query parameters should be passed as below format,

qs:{
access_key: 'xxxxxxxxxxxxxxxxxxxxxxxxxx',
query: 'city_name'
}

Creating Cypress command:

Since we are clear about syntax and mandatory parameters, now lets do the API call with cy.request() function. You can make the request inside testcase spec file using below piece of code,

cy.request({
method:'GET',url:'http://api.weatherstack.com/current',
qs:{
access_key: '########################',
query: 'city_name'}
})

Note: access_key value should be your own key which you got from website and give query value with your own prefered city.

But you may need to handle promise in order to get the values which you get from response, so use .then() function to handle promise as below,

Getting temperature from the response:

As we are able to get the response, now we need to get the temperature from the response. On the cypress runner window, right click over the object{8} and select inspect to open the console as below,

console window

As you could see that the temperature is found inside body > current object, you need to get the temperature as below,

cy.log(response.body.current.temperature)

Above command will print the temperature in the cypress runner as below,

Temperature of 31 is printed in cypress runner

Asserting values:

Now lets do some assertion with the response we got from API. We will do assertion with Jquery expect() function and check whether the temperature is greater than 5. Below will be your complete piece of code,

That’s it!! When you execute it, you will get the successful screenshot based on assertion condition.

Successful testcase execution screenshot

--

--

Siddharth Murugan

Programmer who loves to do things creatively. #automationTester by profession #javascript #nodejs #reactjs