CODEWITHSUNDEEP
reactjscypress
Just_Ice
Just_Ice

Reputation: 563

Cypress async issue

I have a situation in my test where I click a button and it makes an apollo graphQL call in my reactJS side.

          createProductCategory({
            variables: {
              restaurantID: props.restaurant.id,
              name: name
            }
          });

This is how it looks like in the ReactJS side. This createProductCategory method returns a promise which we wait for and continue with the rest of the code.

This works perfectly fine when I click on the button manually. I can see the graphQL call being made in the network tab and it works perfectly fine. However, if I try to get cypress to click on the button, I can see the button gets clicked, but the graphQL call never gets made. I just cannot understand why it doesn't work and what I am doing wrong.

Can someone please help me out with this. I tried putting wait statements everywhere but it just doesnt "wait" for the promise in the reactJS side to be resolved.

      cy.contains("Save")
        .click()
        .then(() => {
          cy.wait(2000)
        });

     cy.wait(2000)

Thanks for the help in advance.

Upvotes: 0

Views: 260

Answers (1)

HRVHackers
HRVHackers

Reputation: 2873

From what you are describing you should have code that surrounds the button click and waits for the graphql call to complete like so

cy.server()
cy.route('/graphql').as('graphql')
cy.get('buton').contains('abc').click()
cy.wait('@graphql')

More info: alias waits

Upvotes: 1

Related Questions