How to intercept cy.request? Is it possible?

[marcusramos]

Hi all,

I am trying to intercept a request from cy.request(). But the URL does not match. Here is a simple example.

The endpoint is a helper method in PHP to create the user. The response is returning as expected.

it('testing_intercept', () => {
        cy.intercept('POST', 'http://XXXXXX/api/_testing/createUser').as('user')
        cy.request('POST', 'http://XXXXXX/api/_testing/createUser')
        cy.wait('@user')
})

Is it possible to intercept a request from cy.request()?

If not, is there any workaround for this process? I am using variables but it is not advisable.

Thanks

[marcusramos]

Hello guys. Any help here?

[dtkocher]

I do not believe you can debug a cy.request with an intercept.

[dtkocher]

I do have a similar question though. Is it possible to intercept a api call to a 3rd party service when doing a cy.request.

cy.intercept('POST', 'https://api.sendgrid.com').as('emails');

cy.request({
  method: 'POST',
  url: `https;//graphqlendpoint.com`,
  body: { query, variables }
});

cy.wait('@emails').then((intercept) => {
  cy.log(intercept);
})

[sonicparke]

This would be FANTASTIC.

[mike-mccormick]

Just to add to this, I also have a few use cases that'd benefit from intercepting manual request calls.

[okyrylenko]

same here, would be very helpful to have that functionality

[jjhelguero]

I'm not sure why you may need to intercept a request made by the test, but cy.request() will wait for a 2xx status code until the responseTimeout.

But if you want to intercept a request

You'll have to set the intercept and then use fetch to make the network call instead of cy.request().

cy.intercept('POST', 'http://XXXXXX/api/_testing/createUser')
    .as('user')
    .then(() => {
      fetch('http://XXXXXX/api/_testing/createUser' , {method: 'POST'})
        .then((r) => r.json())
        .then((body) => {
          // make any assertions here
        })
    })
  cy.wait('@user').its('response.body')

You can also wrap the fetch to use cypress commands once the request completes.

cy.intercept('POST', 'http://XXXXXX/api/_testing/createUser')
    .as('user')
    .then(() => {
      cy.wrap(fetch('http://XXXXXX/api/_testing/createUser' , {method: 'POST'}))
         .invoke('json')
         .should('have.property', 'user')
    })
  cy.wait('@user')

You can also use the window.fetch.

cy.intercept('POST', 'http://XXXXXX/api/_testing/createUser')
    .as('user')
cy.window()
    .invoke('fetch', 'http://XXXXXX/api/_testing/createUser', {method: 'POST'}) // not exactly sure how to include method in this example
    .invoke('json')
    .then((body) => {
      cy.get('@user')
        .its('response.body')
        .should('deep.equal', body)
    })

[ezrag26]

Thank you!

And, just to reference Cypress docs, when comparing cy.route() to cy.intercept():

Unlike cy.route(), cy.intercept():

• can intercept all types of network requests including Fetch API, page loads, XMLHttpRequests, resource loads, etc.