In my upcoming project with Next.js, I am utilizing Cypress for testing a specific page. The objective is to validate two scenarios: 1. Successful outcome and 2. Error handling when a user encounters an issue.
Before(() => {
return void cy.server()
});
// First Scenario
Given('the user accesses the application', () => {
...
});
And('the user initiates a request', () => {
cy.route('GET', `${api}/cars`, 'fixture:good').as('goodRequest');
});
Then('the user should receive a successful response', () => {
cy.get('[data-cy=ok]').should('exist')
})
// Second Scenario
Given('the user accesses the application', () => {
...
});
And('the user initiates a request', () => {
cy.route('GET', `${api}/cars`, 'fixture:bad').as('badRequest');
});
Then('the user should see an error message', () => {
cy.get('[data-cy=bad]').should('exist')
})Although the first test is successful, the second one inherits the previous response from the initial request, resulting in the good response being displayed on the page. This causes the test to fail as the expected bad text is missing. Is there a way to reset the response after each test or any other solution to resolve this issue?