API testing with Cypress

Marie Drake, Quality Engineering Manager @ Zoopla

      https://www.mariedrake.com/         @mcruzdrake

Cypress recap

First Cypress Test

/// <reference types="cypress" />

describe('TodoApp', () => {
  it('should add a new todo successfully', () => {
    cy.visit('/');
    cy.get('.new-todo').as('addTodo');

    cy.get('@addTodo').type('do lunch and learn about Cypress {enter}');
    cy.get('@addTodo').type('have lunch {enter}');

    cy.get('.todo-list').find('li').should('have.length', 2);
    cy.getFirstTodoItem().should(
      'be.equal',
      'do lunch and learn about Cypress'
    );
  });
});

Cypress Test Runner

Now.. let's talk about API testing

API Testing Tools

  • Postman 
  • Newman
  • Supertest
  • Chai-HTTP
  • Rest Assured
  • Karate
  • ... and so much more

Title Text

What if we have 1 tool for both UI and API test automation?

Cypress to the rescue!

Cypress to the rescue!

Advantages of using Cypress to test your APIs

  • Built in support
  • Easy debugging (no more console logs!)
  • Revisit your API state via Cypress test runner - time travel
  • Skills easy to transfer since we are only using 1 tool
  • More buy-in to get developers involve with testing

cy.request()

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

First API test

/// <reference types="cypress" />

describe('Todo API', () => {
  it('returns a JSON data', () => {
    cy.request('/todos')
      .its('headers')
      .its('content-type')
      .should('include', 'application/json');
  });
});

Make a GET request to /todos API endpoint

Check its headers

On the header, check its content type

Assert that it returns a JSON data

Let's look at more examples!

https://github.com/mdcruz/cypress-api-testing-framework


Additional Resources

Any questions?

@mcruzdrake

API testing with Cypress

By Marie Drake

API testing with Cypress

Cypress was originally created to cater the needs of front end developers so they can test their applications easily. However, Cypress is more than that. In this session, we'll look at how we can use Cypress to do API testing.

  • 1,331

More from Marie Drake