snapshot
snapshot copied to clipboard
Doesn't support Angular 12 / Webpack 5?
I'm running a project on Angular v12.2.14 and Cypress v6.9.1 and when I install the latest (v2.1.7) of this package and include require('@cypress/snapshot').register()
in my commands.js
as directed, I get this error in my Cypress runner complaining that process is not defined
in one of this package's dependencies.

I came across this Stack Overflow post https://stackoverflow.com/a/70523044/1917171 which explains that Webpack 5, included with Angular 12, has removed support for process
. I haven't had luck with the index.js
polyfill suggested yet.
I don't know if you already resolved it, but I am facing the same problem. It seems that we are trying to read the process.env
global variable from the Angular code, and it is not defined when we run the code from Cypress.
It works well when I run the application, because I configured the angular-builders/custom-webpack
builder, and I define my customWebpackConfig
which uses the dotenv-webpack
library to load the process env var by reading a .env
file.
It seems we need to tell Cypress to use the same configuration, but I still haven't found a proper way to do that.
Unfortunately I didn't end up resolving it and ended up creating my own custom snapshot script instead 🤔