API Testing with Cypress

If you have worked on automation testing of a web based application, there are chances that you would have done both UI and web service automation and you would have achieved those using different tool sets.

However adopting such approaches may have their own fallacies in the form of more bootstrapping effort or maintenance overhead. Therefore it may serve us well if we can use same tool set to automate both layers wherever possible.

I did have similar experience when we selected cypress for both UI and api automation in my project. In this post, I would like to walk you through how to perform api automation using cypress. This has been an often overlooked feature as people view cypress as a UI-only automation tool.

Cypress Installation:

npm install cypress

We can do lot of things like stubbing using cypress as it runs inside the browser.Cypress has lot of commands to perform operations, but as we want to do API testing we use the command called request().

We can call any method type from cypress request command, below is the sample code to call GET API.

Image for post
Image for post

In the above example, method is type of the method we are calling, url is the endpoint, you can pass the token in auth and you have to pass query parameters in qs options. Finally, we are calling request command by providing options.

the same way we can call POST method as well, below is the example

Image for post
Image for post

Now we are able to call any end point, and from calling any endpoint we will get some sort of response. The next step in our automation will be asserting the response , Cypress use chai library for assertions. In below code we are asserting the status and name property in the response body.

Image for post
Image for post

If you observe we have hard coded the input parameters and expected value which will not work in long run. It is better we separate that test data from the tests, I am gonna create config.json file and put my test data. Usually we will put the test data in fixtures folder of cypress and read from there, below is my test data.

{
"url": "https://localhost:3030/employee",
"id": 2,
"name": "cypress"
}

Now we have config file, let’s read from the config file and pass to our request command, below is our spec now after doing that.

Image for post
Image for post

Custom Commands:

Using custom commands we can override the cypress existing commands or we can create new commands, let’s create new custom command for our GET /employee end point, we have to create custom commands in cypress commands.js file.

Image for post
Image for post

Now we have created custom command and we can call that custom commands in our actual tests, let’s rewrite our test using newly created custom command

Image for post
Image for post

One thing we have to note is Cypress always expects status as 2XX or 3XX otherwise it make the test as fail, so if you are testing any negative scenario and expecting status is other than 2XX or 3XX, you have to pass failOnStatusCode: false for request command

Debugging:

Image for post
Image for post

I hope this helps, let me know if you have any feedback. Thank you for reading.

Written by

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