Interceptando Network Requests

How to make your tests more resilient with network request interception?

When we talk about automated tests, it is key that they are resilient to unexpected changes in third-party applications or libraries. Often, they fail due to bugs not so much in our code, but in those libraries or services we use. These services may be unstable or not allocate enough resources to us in test environments. This is where Cypress, a popular testing tool, provides us with effective options such as network request interception to improve the reliability of our tests.

What is a CI.request and how is it used?

For those who are already familiar with Cypress, the CI.request command allows you to make requests to APIs directly:

cy.request('https://pokeapi.co/api/v2/pokemon/ditto').then((response) => { expect(response.body).to.have.property('name', 'ditto'); expect(response.status).to.eq(200); });

This command is especially useful for authenticating users or simulating interactions with backend services. However, it does not allow us to validate how our interface handles these network requests.

How to intercept network requests in Cypress?

The intercept feature in Cypress covers this limitation. It allows capturing and modifying requests, as well as validating that certain queries are performed when interacting with the interface.

Practical example of interception

We can intercept a GET request to analyze how the application responds:

cy.intercept('GET', '**/pokemon/1').as('getBulbasaur');cy.visit('/some-page');cy.contains('Bulbasaur').should('be.visible');
cy.wait('@getBulbasaur').then((interception) => { expect(interception.response.body.name).to.eq('bulbasaur'); expect(interception.response.statusCode).to.eq(200);});

1. Interception: We define a rule to intercept requests to a specific URL. In this case, the one for the Pokémon Bulbasaur.
2. Visit and validation: We navigate to a page and check that "Bulbasaur" is visible.
3. Wait for response: We use cy.wait to wait for the intercepted request to complete, allowing us to verify that the response is as expected.

Adaptation to slow environments.

What if an API is known to be slow? We can adjust the timeout to ensure that tests have enough time:

cy.wait('@getBulbasaur', { timeout: 20000 }).its('response.statusCode').should('eq', 200);

Using intercepts in automated testing with Cypress can be a valuable tool. Not only does it allow us to verify that you are collaborating correctly with APIs, but also to simulate certain conditions of the production environment without risk, validating how our applications behave in response to unexpected changes or temporary failures.

Remember that improving the resilience of your tests is essential to minimize failures and reduce maintenance. Continue to explore the broad capabilities that Cypress offers, and continue to hone your skills with each test.