cy.route2() doesn't work when method is used as the first parameter

[bhgsbatista]

Current behavior

When passing POST as the first parameter to route2 requests are not properly intercepted.

// Does not work
cy.route2('POST', `${BasePage.api_url}/events/createTemplate`).as('create_template')
cy.wait('@create_template')

// Works
cy.route2(`${BasePage.api_url}/events/createTemplate`).as('create_template')
cy.wait('@create_template')

Desired behavior

Using the method parameter should work.

Test code to reproduce

https://github.com/bhgsbatista/cypress-test-tiny/tree/route2_method_fail

Versions

Cypress v5.3.0
Windows 10

[JonahKK]

If you want to set the method, without altering the response, you need to do it in following way:

cy.route2({ method: 'PUT', pathname: '**/api' }).as('api');

See https://docs.cypress.io/api/commands/route2.html#Usage

[bhgsbatista]

That is not at all reflected in the documentation, that same link you shared has this snippet of code:

cy.route2(url, routeHandler?)
cy.route2(method, url, routeHandler?)
cy.route2(routeMatcher, routeHandler?)

Below that there's an example using the method argument without altering the response:

cy.route2('POST', '/organization', (req) => {
  expect(req.body).to.include('Acme Company')
})

https://docs.cypress.io/api/commands/route2.html#Intercepting-a-request

--

There is definitely an issue here, either with the implementation, or with the documentation.

[jennifer-shehane]

It looks like the route for the one with POST method is reading the POST as the url argument. I would agree that this is a bug (assuming the documentation is correct).

Looking at the code, it looks like it is always expecting a 3rd argument - the routeMatcher - and won't work without that. Although this contradicts the documentation which says the 3rd arg is optional.

https://github.com/cypress-io/cypress/blob/develop/packages/driver/src/cy/net-stubbing/add-command.ts#L249:L249

it('works', () => {
  cy.route2('http://dummy.restapiexample.com/api/v1/create').as('create')

  cy.window().then((win) => {
    win.eval(
      `fetch("http://dummy.restapiexample.com/api/v1/create", {
        method: 'POST', // *GET, POST, PUT, DELETE, etc.
      });`
    )
  })

  cy.wait('@create')
})

it('should work', () => {
  cy.route2('POST', 'http://dummy.restapiexample.com/api/v1/create').as('create')

  cy.window().then((win) => {
    win.eval(
      `fetch("http://dummy.restapiexample.com/api/v1/create", {
        method: 'POST', // *GET, POST, PUT, DELETE, etc.
      });`
    )
  })

  cy.wait('@create') // wait times out
})

Current Workaround

Pass a 3rd arg until this is fixed / clarified. Just passing an empty object will make it work.

cy.route2('POST', 'http://dummy.restapiexample.com/api/v1/create', {}).as('create')

[sainthkh]

Problem

This is happening because there is an ambiguity in the definition of route2:

In the case above, the OP is using cy.route2(string, string).

But it can be 2 calls:

• cy.route2(url: string, routeHandler: string)
• cy.route2(method: string, url: string, routeHandler: undefined)

The OP tries to use the second definition, but Cypress interpreted it as the first.

Solution?

Currently, we're only checking if the first arg is string or not. This ambiguity can be solved by checking if the first arg is an HTTP request method or a WebDAV request method.

What do you think, @flotwig?

[flotwig]

Currently, we're only checking if the first arg is string or not. This ambiguity can be solved by checking if the first arg is an HTTP request method or a WebDAV request method.

@sainthkh yeah, I think that would be a perfect fix, doing a case-insensitive check against known HTTP methods for the first string parameter. Do you want to pick this up?

[sainthkh]

I do. I'll get it done today. Maybe you'll be reviewing the PR next morning 😄 .