Update to be compatible with Cypress 10

[admah]

Hello 👋 I'm writing on behalf of the Cypress DX team. We wanted to notify you that some changes may need to be made to this plugin to ensure that it works in Cypress 10.

For more information, here is our official plugin update guide.

[simonsmith]

This seems to work okay - #254 cc @jaredpalmer

If it doesn't get merged I'll publish it on npm as a fork

Edit: You can grab it here - https://www.npmjs.com/package/@simonsmith/cypress-image-snapshot

[lruszlewicz]

I notice one Issue connected with cypress snapshot, the default snapshot directory is different when I run all spec by cypress run command, but when I want just update one spec file and use command cypress run --spec path to spec , then directory is different.

[simonsmith]

@lruszlewicz Different how?

[shinoshinosp]

• When I run all spec by cypress run command
  ./cypress/e2e/path/to/spec.cy.js → ./cypress/snapshots/path/to/spec.cy.js/test-name.snap.png
• When I use command cypress run --spec ./cypress/e2e/path/to/spec/spec.cy.js
  ./cypress/e2e/path/to/spec.cy.js → ./cypress/snapshots/spec.cy.js/test-name.snap.png

[simonsmith]

It does seem like this behaviour is intentional from the Cypress side in version 10 - https://docs.cypress.io/guides/references/migration-guide#Generated-Files

[fengkx]

Edit: You can grab it here - https://www.npmjs.com/package/@simonsmith/cypress-image-snapshot

First of all thank you for your work on this. But I come up with this error after I add this package to the config file in a TypeScript project. Any idea?

EDIT: npx cypress cache clear then npx cypress install fix this.

[wilsonpage]

@simonsmith have you found a workaround for the open/run screenshot file location issue?

[wilsonpage]

I opened a PR to fix this: simonsmith/cypress-image-snapshot#1

[shinoshinosp]

@wilsonpage
To avoid this probrem, I make an empty spec like dummy.cy.js in cyprees/e2e, and add a script to package.json like
cypress run --spec ${npm_config_spec},cypress/e2e/dummy.cy.js
then run with
npm run cypress --spec=your.cy.js

By using this script, you can make snapshots be stored in same directory when you use cypress run
Since cypess always run empty spec after other specs, this is not perfect solution.

[simonsmith]

I opened a PR to fix this: simonsmith#1

Thanks! Merged and in 5.0.3

[ivanhara]

This seems to work okay - #254 cc @jaredpalmer

If it doesn't get merged I'll publish it on npm as a fork

Edit: You can grab it here - https://www.npmjs.com/package/@simonsmith/cypress-image-snapshot

Hi, I can not create an issue in your fork, so I will write here.
I am getting this error

ReferenceError: Cypress is not defined at Object. (C:\Users\ivan.ha\Downloads\repos\cypress-sb\node_modules\@simonsmith\cypress-image-snapshot\command.js:19:27) at Module._compile (node:internal/modules/cjs/loader:1105:14) at Module._extensions..js (node:internal/modules/cjs/loader:1159:10) at Object.require.extensions. [as .js] (C:\Users\ivan.ha\AppData\Local\Cypress\Cache\10.10.0\Cypress\resources\app\node_modules\ts-node\src\index.ts:1608:43) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:102:18) at Object. (C:\Users\ivan.ha\Downloads\repos\cypress-sb\cypress.config.ts:2:1) at Module._compile (node:internal/modules/cjs/loader:1105:14) at Module.m._compile (C:\Users\ivan.ha\AppData\Local\Cypress\Cache\10.10.0\Cypress\resources\app\node_modules\ts-node\src\index.ts:1618:23) at Module._extensions..js (node:internal/modules/cjs/loader:1159:10) at Object.require.extensions. [as .ts] (C:\Users\ivan.ha\AppData\Local\Cypress\Cache\10.10.0\Cypress\resources\app\node_modules\ts-node\src\index.ts:1621:12) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:102:18) at loadFile (C:\Users\ivan.ha\AppData\Local\Cypress\Cache\10.10.0\Cypress\resources\app\node_modules\@packages\server\lib\plugins\child\run_require_async_child.js:89:14) at EventEmitter. (C:\Users\ivan.ha\AppData\Local\Cypress\Cache\10.10.0\Cypress\resources\app\node_modules\@packages\server\lib\plugins\child\run_require_async_child.js:116:38) at EventEmitter.emit (node:events:527:28) at EventEmitter.emit (node:domain:475:12) at process. (C:\Users\ivan.ha\AppData\Local\Cypress\Cache\10.10.0\Cypress\resources\app\node_modules\@packages\server\lib\plugins\util.js:33:22)

[jcubic]

@simonsmith any chance to update to Cypress 11?

[simonsmith]

@jcubic What have you encountered that is breaking in Cypress 11? I'm yet to update my projects but when I do I can fix any major pain points

[jcubic]

I have no idea I'm not able to install Cypress 11 because of your package. So I'm forced to use Cypress 10 if I want to use image snapshots.