Cypress interception is not waiting

user_13560442 0
Viewed 4074

I'm using Cypress 6.0.0 new way of interception. Waiting on a request

I need to wait for the "templatecontract" response in order to click the #template-button-next because otherwise is disabled. But is trying to click it before getting the response from the API. The documentation seems pretty straight forward.

Am I wrong here?

I have also tried just like:

cy.wait('@templatecontract')
cy.get('#template-button-next').click()

it("Test", function() {
    cy.intercept(Cypress.env("baseUrl")+`/api/v1/contract-type/templatecontract`).as('templatecontract')
    cy.login(Cypress.env('testUserInviteEmail'), Cypress.env('testUserInvitePassword')).then((token) => {

        cy.visit(Cypress.env('baseUrl')+"/templates", {headers: {
            Authorization: token,
          },
        });
        cy.get('a[href="/create-template"]').click();
        cy.get('.template-usecasetitle').contains('UBO-Formular')
        cy.get('button[cy-data="Formular"]').click();
        cy.get('#title').type("Title for testing");
        cy.get('#usecasetitle').type("Usecasetitle for testing")
        cy.get('#description').type("Description just for testing")
        cy.wait('@templatecontract').then(interceptions => {
            cy.get('#template-button-next').click()
        });
    });
});
cypress
4 Answers

I'm not sure why but just setting the method type (POST in this case) have solved the problem.

cy.intercept('POST', Cypress.env("baseUrl")+`/api/v1/contract-type/templatecontract`).as('templatecontract')
user_135604420
user_14637700

Interestingly I am getting different results for

cy.intercept("POST", "https://backend.rocketgraph.app/api/signup").as("doSignup")

and

cy.intercept("POST", `${BACKEND_URL}/signup`).as("doSignup")

Not sure what is the issue. Also have to set POST as one of the users have mentioned

The first one is actually intercepted. Weird but happened.

user_33131400

If you spy a route at the top of your test, as you do here, cy.wait() will return immediately if there have already been responses to that route by the time it's called.

As an example, say you notice this in your network tab:

GET some-route: 200
GET some-route: 200
GET some-route: 200
GET some-route: 200
POST something-unique: 200
GET some-route: 500

^ some-route is 500ing at some clearly-identifiable point. Should be easy to catch in a test, right? Well:

it('Should fail on this 500, but doesn't???', () => {
  // start spying our indicator; seems good:
  cy.intercept('GET', 'something-unique').as('indicator')
  // but if we start spying the route here:
  cy.intercept('POST', 'some-route').as('route')

  // then hit some-route a bunch of times & return:
  foo()

  // then expect to catch the failure after something-unique fires:
  cy.wait('@indicator').its('response.statusCode').should('eq', 200).then( () => {
  // then expect the test to fail on the 500:
  cy.wait('@route').its('response.statusCode).should('not.eq', 500) 
  // ...this won't work! this test will pass because cy.wait() will
  // succeed and return the *first* GET some-route: 200 !
})

I personally find this to be pretty counter-intuitive - it feels reasonable that a wait() on a spied route would always actually wait for the next request! - but that's apparently not how it works.

One way around this is to not start spying until you're actually ready:

it('Fails on a 500', () => {
  cy.intercept('GET', 'something-unique').as('indicator')
  foo()

  cy.wait('@indicator').its('response.statusCode').should('eq', 200).then( () => {
  // don't start spying until ready:
  cy.intercept('POST', 'some-route').as('route')
  cy.wait('@route').its('response.statusCode).should('not.eq', 500) 
  // and the test fails correctly; response.statusCode 500 should not equal 500
})
user_197019490
Related