Cypress Test - Filtering results based on a URL query parameter

Question

I have the following in Cypress v12.17:

it.only('Foo Test', () => {
  cy.intercept('somePath/someEndpoint**', { fixture: 'someJsonFile' }).as('getFoo');

  cy.visit('somePath/someEndpoint?queryParamOne=someValue');

  cy.wait('@getFoo').then((interception) => {
    console.log('URL', JSON.stringify(interception.request.url));
    console.log('QUERY', JSON.stringify(interception.request.query));
  });
});

When executing the test, the left pane (where it shows pass/fail) shows the full url of https://someHost/somePath/someEndpoint?queryParamOne=someValue

However, the interception.request.url only shows https://someHost/somePath/someEndpoint and interception.request.query shows {}

How do I access queryParamOne=someValue from inside the interception? I need the key and value to filter the contents of interception.response.body before returning the response.

Answer 1

I can't really pinpoint where your code is going wrong, but I can make it work with the following changes:

• using regex for the intercept (because life's too short for messing with glob)

• dropping the JSON.stringify() in the interception because it's easier to test an object than a string

cy.intercept(/somePath\/someEndpoint/, { fixture: 'example.json' })
  .as('my-intercept')

// Fire the network request
cy.window().then(win => win.fetch('somePath/someEndpoint?queryParamOne=someValue'))

cy.wait('@my-intercept')
  .then((interception) => {
    console.log('QUERY', interception.request.query)
    return interception.request.query
  })
  .should('have.property', 'queryParamOne', 'someValue')

---

Specifying the query in the RouteMatcher

Since there's no substantial difference between your code and mine, I am guessing there is another call without query parameters that is consuming your intercept (or rather the cy.wait()).

If that's the case, you can make the intercept more specific by specifying the query in the RouteMatcher.

In this example I've added a prior call to 'somePath/someEndpoint' that I want to ignore (since it has no query parameter).

I've used a wildcard for the parameter value using regex /.+/ which means the query value has at least one character.

cy.intercept({
    path: /somePath\/someEndpoint/, 
    query: {queryParamOne: /.+/},   
  },
  { fixture: 'example.json' }
).as('my-intercept')

// Fire the network requests
cy.window().then(win => win.fetch('somePath/someEndpoint'))
cy.window().then(win => win.fetch('somePath/someEndpoint?queryParamOne=someValue'))

cy.wait('@my-intercept')
  .then((interception) => {
    console.log('QUERY', interception.request.query)
    return interception.request.query
  })
  .should('have.property', 'queryParamOne', 'someValue')