Add a flag to disable CSS transformation in CI environment

[nvh95]

Is your feature request related to a problem? Please describe.

CSS Transform takes time. Especially after #241, processing a CSS file with PostCSS config would take 0.3 seconds on Mac M1. Those results are cached in local by default. But in CI, it's likely not to be cached, which leads to CI run longer

Describe the solution you'd like

• Provide a way for users to toggle on/off processing CSS in the CI environment
• Why? Since some tests can be failed if they have snapshot testing

transform: {
   '^.+\\.(css|scss|sass)$': ['<rootDir>/transforms/css', { transformCssInCI: false }], // default to false
},

Describe how should jest-preview implements this feature

• if CI
  • if css file => return string
  • if css modules => use identity-obj-proxy
• See how to use "babel-like" syntax to pass configuration

Describe alternatives you've considered

None

Additional context

None

[nvh95]

This is possibly not needed if we implement #252

[timkindberg]

On the flip side it would be nice if we could have this working fully in CI and save the debug screenshot somewhere to be analyzed.

[cben]

When using jest.config.js or similar extension (anything except passive jest.config.json), I think user can simply make the config conditional e.g. process.env.CI ? ... : ..., no?

A benefit that has over a fixed flag like transformCssInCI: false is flexebility in determining whether you're running in CI (though CI env var is pretty universal), and whether you want CSS for any other reasons. It's also less "magic": user understands and controls the logic.

So WDYT documenting a recommended pattern under Installation?