Allow dynamically matching requests with a function

To allow highly flexible matching of which requests you want to stub, we could add the option to accept a function instead of a fixed method/URL. This would recieve the request object (or some wrapper around it). The motivation is that I have and SPA that uses a GraphQL backend where all requests have the same URL and I want to filter them by the query name which is sent as a parameter in the POST body.

cy.route({
  matcher: (request) => !! request.body.match(//)
})

[nazar]

Thank you for the update @jennifer-shehane

I’ve been able to find a work-around that provides me with the required functionality. I feel it’s a bit hacky but it works for now.

My support/index.js contains:

beforeEach(() => {
  cy
    .server()
    .route({
      method: 'POST',
      url: '/api/graphql' <---- this is our graphQL endpoint
    })
    .as('graphqlRequest');
});

And the following in my support/commands.js

Cypress.Commands.add('waitForQuery', operationName => {
  cy.wait('@graphqlRequest').then(({ request }) => {
    if (request.body.operationName !== operationName) {
      return cy.waitForQuery(operationName); <---- this is the hacky bit
    }
  });
});

The above can be used as follows:

      it('Should Foo Bar', () => {
        cy
          .waitForQuery('fooQuery')

          .get('[data-cy=bar]')
          .should('exist')
       
           // can also be used to check XHR payloads
          .waitForQuery('fooQuery')
          .its('request')
          .then(({ body: { variables: { search: { foo } } } }) => expect(foo).to.equal(1))
       });

HTH anybody with the same requirements.

[godspeedelbow]

Opened a PR for this feature request after spending way to much time trying to hack it in in userland. This should be supported out of the box IMO.

https://github.com/cypress-io/cypress/pull/3984