Update to be compatible with Cypress 10 #252

admah · 2022-05-26T15:33:04Z

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 · 2022-06-15T19:17:01Z

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 · 2022-06-24T12:20:18Z

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 · 2022-06-28T15:47:44Z

@lruszlewicz Different how?

shinoshinosp · 2022-07-04T04:33:27Z

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 · 2022-07-04T13:33:23Z

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 · 2022-07-27T12:34:52Z

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 · 2022-08-02T12:24:32Z

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

wilsonpage · 2022-08-02T15:05:54Z

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

shinoshinosp · 2022-08-03T01:00:30Z

@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 · 2022-08-07T16:27:34Z

I opened a PR to fix this: simonsmith#1

Thanks! Merged and in 5.0.3

ivanhara · 2022-10-23T00:59:05Z

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 · 2022-11-12T19:35:30Z

@simonsmith any chance to update to Cypress 11?

simonsmith · 2022-11-15T13:47:26Z

@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 · 2022-11-15T15:32:15Z

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.

rstoneIDBS · 2022-11-16T14:30:58Z

@jcubic @simonsmith
We're using 6.0.0 quite happily with Cypress 11, I upgraded them both last week and didn't have to change/fix anything.

CoreyGahafer · 2022-11-17T22:00:03Z

@simonsmith I'm coming across one issue with your fork and maybe you can help me with it. Prior to Cypress 10, we were using a custom integrationFolder path and with Cypress 10, this is no longer an option. With that being the case, is there a way to set a similar base path like was previously being leveraged with the integrationFolder?

uilton-oliveira · 2022-11-22T19:26:27Z

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.

As a workaround, just add this overrides block to your package.json:

"devDependencies": {
    "@simonsmith/cypress-image-snapshot": "^6.0.0",
},
"overrides": {
    "@simonsmith/cypress-image-snapshot": {
      "cypress": "^11.1.0"
    }
},

Its working fine here

jcubic · 2022-11-22T20:40:52Z

@uilton-oliveira thanks, I didn't know you can do that.

simonsmith · 2022-11-24T11:51:18Z

It's on my list to update to Cypress 11 for my own projects, once I do I'll update the fork. Thanks for the workaround for now @uilton-oliveira

rojasss11 · 2023-01-10T08:25:48Z

Additional information:

If someone wants to use the cypress-image-snapshot types, they should add:

npm i --save-dev @types/simonsmith__cypress-image-snapshot@npm:@types/cypress-image-snapshot

willwearing · 2023-05-04T14:08:21Z

@simonsmith I've created a small PR to update the README with @rojasss11's type fix: simonsmith/cypress-image-snapshot#8

Are we considering moving to this new repo as it seems to be the most active?!

sosog · 2023-05-04T15:08:56Z

@willwearing you can also see my fork and PR, I think we can create a discord channel for it, and if we want to create a new package with TS support or continue with some fork.

willwearing · 2023-05-04T15:15:57Z

@sosog lets wait to see what @simonsmith says and if @jaredpalmer weighs in.

Discord might not be needed if we can get ownership of the repo transferred and/or we agree to move to Simons ford etc

simonsmith · 2023-05-05T13:43:04Z

I am in the middle of a rewrite of cypress-image-snapshot at the moment. I will replace my fork with it once it's ready. Thanks for all your continued help!

simonsmith · 2023-05-17T22:38:09Z

Removed my fork and recreated as standalone

Have a few more bits to add/test and then will release a new version

aleksey-ilin · 2023-05-21T11:58:04Z

Hi, @simonsmith.
Thanks for your job. I want to store screenshots in folder with tests (cypress/intergation/test1/snapshots/). Does your plugin can it?

simonsmith · 2023-05-21T21:30:58Z

Right now it currently supports customSnapshotsDir.

Seen here - https://github.com/americanexpress/jest-image-snapshot#%EF%B8%8F-api

abf7d · 2023-05-25T00:34:07Z

Hi @simonsmith, I tried installing @simonsmith/cypresss-image-snapshot and it seems to support only js. Is there any plan to publish your typescript work on npm anytime soon?

simonsmith · 2023-05-25T10:01:10Z

@abf7d Yep, I am currently working out some issues with getting semantic-release to work correctly. I am also going to be testing the new version on a work project with hundreds of tests to ensure everything works there also. I'd like the next release to work smoothly for everyone

As a temporary workaround you can see this comment I think - #252 (comment)

abf7d · 2023-05-25T13:59:46Z

Thanks @simonsmith !

simonsmith · 2023-05-25T16:25:20Z

It worked well for me, so here is version 7.0.0 - https://github.com/simonsmith/cypress-image-snapshot/releases/tag/7.0.0

Update to use maintained for of 'cypress-image-snapshot' plugin and update to Cypress v10 See: jaredpalmer/cypress-image-snapshot#252 (comment)

baronvonbirra mentioned this issue Jul 12, 2022

Screenshot path is different when running headless and open cypress-io/cypress#22753

Closed

barbados-clemens mentioned this issue May 22, 2023

Cypress component testing with snapshots nrwl/nx#17134

Closed

4 tasks

simonsmith mentioned this issue May 25, 2023

change cypress-image-snapshot to maintained fork cypress-io/cypress-documentation#5276

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update to be compatible with Cypress 10 #252

Update to be compatible with Cypress 10 #252

admah commented May 26, 2022

simonsmith commented Jun 15, 2022 •

edited

lruszlewicz commented Jun 24, 2022

simonsmith commented Jun 28, 2022

shinoshinosp commented Jul 4, 2022

simonsmith commented Jul 4, 2022

fengkx commented Jul 27, 2022 •

edited

wilsonpage commented Aug 2, 2022 •

edited

wilsonpage commented Aug 2, 2022

shinoshinosp commented Aug 3, 2022 •

edited

simonsmith commented Aug 7, 2022

ivanhara commented Oct 23, 2022

jcubic commented Nov 12, 2022

simonsmith commented Nov 15, 2022

jcubic commented Nov 15, 2022

rstoneIDBS commented Nov 16, 2022

CoreyGahafer commented Nov 17, 2022

uilton-oliveira commented Nov 22, 2022 •

edited

jcubic commented Nov 22, 2022

simonsmith commented Nov 24, 2022

rojasss11 commented Jan 10, 2023

willwearing commented May 4, 2023

sosog commented May 4, 2023

willwearing commented May 4, 2023

simonsmith commented May 5, 2023

simonsmith commented May 17, 2023 •

edited

aleksey-ilin commented May 21, 2023

simonsmith commented May 21, 2023 •

edited

abf7d commented May 25, 2023

simonsmith commented May 25, 2023

abf7d commented May 25, 2023

simonsmith commented May 25, 2023 •

edited

Update to be compatible with Cypress 10 #252

Update to be compatible with Cypress 10 #252

Comments

admah commented May 26, 2022

simonsmith commented Jun 15, 2022 • edited

lruszlewicz commented Jun 24, 2022

simonsmith commented Jun 28, 2022

shinoshinosp commented Jul 4, 2022

simonsmith commented Jul 4, 2022

fengkx commented Jul 27, 2022 • edited

wilsonpage commented Aug 2, 2022 • edited

wilsonpage commented Aug 2, 2022

shinoshinosp commented Aug 3, 2022 • edited

simonsmith commented Aug 7, 2022

ivanhara commented Oct 23, 2022

jcubic commented Nov 12, 2022

simonsmith commented Nov 15, 2022

jcubic commented Nov 15, 2022

rstoneIDBS commented Nov 16, 2022

CoreyGahafer commented Nov 17, 2022

uilton-oliveira commented Nov 22, 2022 • edited

jcubic commented Nov 22, 2022

simonsmith commented Nov 24, 2022

rojasss11 commented Jan 10, 2023

willwearing commented May 4, 2023

sosog commented May 4, 2023

willwearing commented May 4, 2023

simonsmith commented May 5, 2023

simonsmith commented May 17, 2023 • edited

aleksey-ilin commented May 21, 2023

simonsmith commented May 21, 2023 • edited

abf7d commented May 25, 2023

simonsmith commented May 25, 2023

abf7d commented May 25, 2023

simonsmith commented May 25, 2023 • edited

simonsmith commented Jun 15, 2022 •

edited

fengkx commented Jul 27, 2022 •

edited

wilsonpage commented Aug 2, 2022 •

edited

shinoshinosp commented Aug 3, 2022 •

edited

uilton-oliveira commented Nov 22, 2022 •

edited

simonsmith commented May 17, 2023 •

edited

simonsmith commented May 21, 2023 •

edited

simonsmith commented May 25, 2023 •

edited