cypressscreenshot

I need for Cypress screenshot to wait until after the second click() is complete


I am running the following test in Cypress:

context('Overview', () => {
  it('4.1 - From Patient Summaries Screen, click a patient name. - Should take user to the weekly Patient Overview screen.', () => {
 cy.login()

 cy.get('body div ul li a span')
   .should('exist')
   .should('be.visible')
   .contains('Patients')
   .click()

cy.get('td[data-cy=Name]')
  .should('be.visible')
  .contains('I.B. Sickly')
  .click()

cy.get('div[data-cy=headerTitle]')
  .should('be.visible')
  .screenshot() 
})
})

So the screenshot is being taken too soon. It is taken after the first get. However, the last block does not work because it will take a screenshot of the headerTitle literally. If I chain on .screenshot() to the second get block that will not work because then it will take a screenshot of just that patient name inside of contains().

So most important of all I need for it to take a screenshot after the second click.


Solution

  • Here is what I ended up doing:

    context('Overview', () => {
      it('4.1 - From Patient Summaries Screen, click a patient name. - Should take user to the weekly Patient Overview screen.', () => {
        cy.login()
    
        cy.get('body div ul li a span')
          .should('exist')
          .should('be.visible')
          .contains('Patients')
          .click()
    
        cy.get('td[data-cy=Name]')
          .should('be.visible')
          .contains('I.B. Sickly')
          .click()
    
        cy.get('div[data-cy=patient-name]')
          .should('be.visible')
    
        cy.get('main div line')
          .should('be.visible')
    
        cy.screenshot()
      })
    })
    

    I added another get() block that shows that the new screen has something unique to it and that it is visible and, when it is, take the screenshot.

    That should('be.visible') seems to signal to Cypress that it's time to take the screenshot.