The screenshot names are different when running All Integration Specs via the cy ui

[Dassderdie]

Setup

I use cypress@9.2.1 and cypress-image-diff-js@1.16.1.

I have a simple integration test in landing-page.spec.ts:

describe('The landing page', () => {
    it('is possible to make visual regression tests', () => {
        cy.visit('/');
        cy.get('.container').compareSnapshot('landing-page', 0.1);
    });
});

Bug description

If I start cypress via cypress run I get a screenshot with the name landing-page.spec.ts-landing-page.png.

If I start cypress via cypress open and click on Run 1 integration spec the resulting screenshot name is All Integration Specs-landing-page.png.

Some quick thoughts

I guess the relevant code is here

      const specName = Cypress.spec.name
      const testName = `${specName.replace('.js', '')}-${name}`

There are two issues:

1. Cypress.spec.name doesn't seem to be the correct way to get the filename of the test
2. there are more file endings than just .js

There also seems to be Cypress.currentTest.titlePath.

The solution from cypress-plugin-snapshots seems to also not rely on the file name of the tests, but the describe blocks? - No it seems to have the same problem.

function getTestTitle(test) {
  return (test.parent && test.parent.title ? `${getTestTitle(test.parent)} > ` : '') + test.title;
}

[Dassderdie]

After a bit further investigation, it seems like this is a well-known bug: cypress-io/cypress#3090 and cypress-plugin-snapshots has actually a caveat in their readme about this.