snapshots are not consistent on firefox

[maximegheraille]

Hi,

I created this issue in the tool we use to take snapshots but it seems the issue is related the how jest takes snapshots simonsmith/cypress-image-snapshot#63

we currently have components where we have assets some text. All snapshots are taken on firefox, chrome and edge with https://github.com/simonsmith/cypress-image-snapshot

Both edge and chrome are always fine, but firefox keeps randomly failing them because the image seems different (which is not case).

my setting are as follows

const options: CypressImageSnapshotOptions = {
			failureThreshold: 0.01,
			allowSizeMismatch: true,
			failureThresholdType: 'percent',
			capture: 'viewport',
			comparisonMethod: 'ssim',
			customSnapshotsDir: `./cypress/reports/mochareports/snapshots/${Cypress.spec.fileName}`,
			e2eSpecDir: Cypress.spec.relative,
			snapFilenameExtension: '.snap',
};

[code-forger]

The blocks in the diff heavily implies this is an image compression algorithm problem.

If these images are being scaled down by the browser, and it is doing so with some image compression algorithm (such as jpeg), and this algorithm is non-deterministic, then your diff is exactly what i would expect to see.