How do I can catch and modify XHR JSON response in cypress? - json

Question

In Cypress there is possibility to stub XHR response, but I wanted to catch and modify JSON response.
https://docs.cypress.io/guides/guides/network-requests.html#Stub-Responses
https://docs.cypress.io/api/commands/route.html#With-Stubbing
I do not find a good example that explain this.
In my app there is a call to an API:
/isHuman
and response is:
{"isHuman":true}
I wanted to intercept this call and put true and another test with false
can anybody provide this ?
Last Edit:
Testing app in on localhost(where I define baseURL - localhost:3123), but there are api calls to a different domain(https://api.app.com/isHuman).
I need to change response from that xhr call.

Answer 1

You can redefine the same url multiple times inside the same it():
it('should od whatever', () => {
cy.route('GET', '/isHuman', { "isHuman": true });
/* trigger some requests */
cy.route('GET', '/isHuman', { "isHuman": false });
/* trigger other requests */
});

Answer 2

it('modifies the response from the server to insert Kiwi', () => {
cy.intercept('favorite-fruits', (req) => {
req.reply((res) => {
// add Kiwi to the list received from the server
console.log('original response from the server is %s %o', typeof res.body, res.body)
const list = res.body
list.push('Kiwi')
res.send(list)
})
})
cy.visit('/')
// check if Kiwi is the last fruit
cy.get('li').should('have.length.gt', 3)
.last().should('contain', 'Kiwi')
})
below is the source of the code:
Partial route mock