Screenshot destination folder.

[MihaelN]

Hi,

I am integrating Cypress testing into a project, and have one question regarding the capability of storing test screenshots. My team and I are trying to store screenshots of components invoked by the screenshot() into a folder that lives outside of the cypress installation folder.

Is this possible to acchieve? Whatever I try to pass into the screenshotsFolder in cypress.json or on "after:screenshot" plugins/index.js just creates new folders inside of the screenshots folder in cypress installation.

Project
│   README.md
│
└───Components
│   │
│   └───Navigation (Save screenshot and videos here)
│       │   Navigation.js
│       │   Navigation.test.js
│       │   Navigation-screenshot.png
│       │   Navigation-video.mp4
│       │   ...
│   │
│   └───Header (Save screenshot and videos here)
│       │   Header.js
│       │   Header.test.js
│       │   Header-screenshot.png
│       │   Header-video.mp4
│       │   ...
│   
└───Cypress
│   │
│   └───Fixtures
│   │
│   └───integration
│   │
│   └───plugins
│   │
│   └───screenshots
│   │
│   └───support
│   │
│   └───videos
│       │   ...

[jennifer-shehane]

You should be able to move the image to wherever you like after the screenshot is taken - with this workaround, do not touch the screenshotsFolder. The screenshotsFolder likely does need to be within the current project (where cypress.json is located). https://on.cypress.io/after-screenshot-api#Modify-screenshot-path

[MihaelN]

after:screenshot works differently from what I expected, I end up with a bunch of empty folders in the cypress/screenshots directory and I don't see the current screenshot file name being passed down to the details prop. I wasn't sure why it didn't work, and I haven't seen anything about screenshotsFolder caveat but this does give the desired result, thank you very much :)

Edit:
Before applying these changes, I did manage to alter the cypress.json to change the screenshot folder and have it sit outside of the root cypress directory, but I assume after:screenshot is the intended method for this?

[MihaelN]

You should be able to move the image to wherever you like after the screenshot is taken - with this workaround, do not touch the screenshotsFolder. The screenshotsFolder likely does need to be within the current project (where cypress.json is located). https://on.cypress.io/after-screenshot-api#Modify-screenshot-path

After testing the recommended approach, I stumbled across one issue with this solution. If we run tests with run-ct everything works fine, however when tests are run by open-ct the specName changes to All specs and it makes it impossible to identify which test is currently executing as all of the screenshots are saved into the cypress/screenshots/All specs. Any recommendations for how to try and solve this?

[jennifer-shehane]

Yeah, this is a known issue with All specs running as detailed here: #2319 There's not a workaround currently other than running via cypress run for screenshots.