matchImageSnapshot opens a new page to take the screenshots and that it is an issue

[melibe23]

An element that I want to take a screenshot of hides when there is any other action on the site. So, even if I select correctly the element, the image appears empty

This is my config

addMatchImageSnapshotCommand({
  failureThreshold: 0.09, // threshold for entire image
  failureThresholdType: 'percent', // percent of image or number of pixels
  customDiffConfig: { threshold: 0.01 }, // threshold for each pixel
  capture: 'viewport', // capture viewport in screenshot
})

This is my test:

describe(`Compare basket`, () => {
      context(`Desktop`, () => {
        before(() => {
          
          cy.visit(url)
          cy.get(appBar).find(`[data-testid="icon-ga-compare"]`).click({ force: true })
        })

        it(`dropdown_with_${index}_app`, () => {
          cy.get(`[data-testid="compare-basket"]`).matchImageSnapshot()
        })
      })

[philsherry]

Is this not simply down to you calling it from a new .it() block?

For something like you're after, you'd have to do something more like this, right?

it(`dropdown_with_${index}_app`, () => {
  // (call them in the same block same block)
  cy.get(appBar).find(`[data-testid="icon-ga-compare"]`).click({ force: true })
  cy.get(`[data-testid="compare-basket"]`).should('be.visible').matchImageSnapshot()
})