Cypress Intercept Command

Profile picture for user arilio666

Intercept is known as obstructing someone or something, but in this case, intercept is used to jam, stub, or spy responses from the route and get answers and compare them.

Intercept is used to spy on API requests and check the response and take the ID from the response to check the response in this order.

Intercepts are cleared after every test.

Syntax:

cy.intercept(URL, staticResponse)
cy.intercept(method, URL, staticResponse)
cy.intercept(routeMatcher, staticResponse)
cy.intercept(URL, routeMatcher, staticResponse)

Arguments Used in Cypress Intercept:

Method: Matches the route to the HTTP method like GET, POST, PUT, etc.
URL: Used to check if the specific URL matches or see matching URLs.
RouteMatcher: An object that matches the incoming HTTP requests with its intercepted routes.
RouteHandler: This function is called whenever the request is matched, with the first argument provided being the request object.
StaticResponse: By passing static response as the last argument, we can statically stub a response for matched requests.

Correct Usage:

cy.intercept('POST', '/cypress*', {
 statusCode: 201,
 body: {
   name: 'Intercept',
 },
})

Example:

  • We will be using the autopract site for the example.
    Let us try to log a response from the site where we will click cart intercept its route.
    We will also try to match the response code with the desired one.
  • After we click on the cart icon, we can see there are API responses and status codes for the specific search input.
    Let us play around with that.
describe('Intercept',()=>{

   it('Scroll',()=>{

 
       cy.visit('http://www.autopract.com/#/home/fashion')
       cy.get("button[aria-label='Close'] ").click()
       cy.intercept('GET', '?endpoint=customerchat&page_id=2123438804574660&suppress_http_code=1').as('searchIntercept')
       cy.get('img[src="assets/images/icon/cart.png"]').click()
     
       cy.wait('@searchIntercept').its('response.statusCode').should('eq',200)
    
       

       })
   })

  • So to intercept, we are providing the HTTP method it's calling when clicked and the endpoint of the URL the API is requesting.
    As the intercepted response code is 200, as we can witness from the console earlier, it should assert that it is equal to the specified code.
  • We can see that the response code matches, which is how we can intercept and play around in cypress.
  • Yields:
    cy.intercept() yields null.
    cy.intercept() can be aliased and cannot be chained further.
    cy.intercept(), when used with the wait, yields an object that contains information about matching requests.