diff --git a/README.md b/README.md index d8b088c..ee12bf3 100644 --- a/README.md +++ b/README.md @@ -36,8 +36,9 @@ Jest matcher that performs image comparisons using [pixelmatch](https://github.c `toMatchImageSnapshot()` takes an optional options object with the following properties: * `customDiffConfig`: Custom config passed [pixelmatch](https://github.com/mapbox/pixelmatch#pixelmatchimg1-img2-output-width-height-options) (See options section) - * By default we have set the `threshold` to 0.01, you can increase that value by passing a customDiffConfig as demonstrated below. + * By default we have set the `threshold` to 0.01, you can increase that value by passing a customDiffConfig as demonstrated below. * Please note the `threshold` set in the `customDiffConfig` is the per pixel sensitivity threshold. For example with a source pixel colour of `#ffffff` (white) and a comparison pixel colour of `#fcfcfc` (really light grey) if you set the threshold to 0 then it would trigger a failure *on that pixel*. However if you were to use say 0.5 then it wouldn't, the colour difference would need to be much more extreme to trigger a failure on that pixel, say `#000000` (black) +* `customSnapshotsDir`: A custom directory to keep this snapshot in * `customSnapshotIdentifier`: A custom name to give this snapshot. If not provided one is computed automatically * `noColors`: (default `false`) Removes colouring from console output, useful if storing the results in a file * `failureThreshold`: (default `0`) Sets the threshold that would trigger a test failure based on the `failureThresholdType` selected. This is different to the `customDiffConfig.threshold` above, that is the per pixel failure threshold, this is the failure threshold for the entire comparison. diff --git a/__tests__/src/__custom_snapshots_dir__/integration-5-snap.png b/__tests__/src/__custom_snapshots_dir__/integration-5-snap.png new file mode 100644 index 0000000..1ee7f75 Binary files /dev/null and b/__tests__/src/__custom_snapshots_dir__/integration-5-snap.png differ diff --git a/__tests__/src/diff-snapshot.spec.js b/__tests__/src/diff-snapshot.spec.js index c609224..fdeb777 100644 --- a/__tests__/src/diff-snapshot.spec.js +++ b/__tests__/src/diff-snapshot.spec.js @@ -12,6 +12,7 @@ * the License. */ +/* eslint-disable global-require */ const fs = require('fs'); const path = require('path'); diff --git a/__tests__/src/index.spec.js b/__tests__/src/index.spec.js index f393b7b..36add88 100644 --- a/__tests__/src/index.spec.js +++ b/__tests__/src/index.spec.js @@ -12,6 +12,7 @@ * the License. */ +/* eslint-disable global-require */ const fs = require('fs'); const path = require('path'); diff --git a/__tests__/src/integration.spec.js b/__tests__/src/integration.spec.js index b8b9142..4000e42 100644 --- a/__tests__/src/integration.spec.js +++ b/__tests__/src/integration.spec.js @@ -29,7 +29,7 @@ describe('integration tests', () => { const intercept = require.requireActual('../../src'); const originalToMatchImageSnapshot = intercept.toMatchImageSnapshot; - intercept.toMatchImageSnapshot = function (...args) { + intercept.toMatchImageSnapshot = function toMatchImageSnapshot(...args) { const ctx = this; let originalUpdateSnapshot = null; @@ -54,8 +54,10 @@ describe('integration tests', () => { return intercept; }; - const cleanSnapshot = function (customSnapshotIdentifier) { - const snapPath = path.join(snapDir, `${customSnapshotIdentifier}-snap.png`); + const getSnapshotBasename = identifier => `${identifier}-snap.png`; + + const cleanSnapshot = (customSnapshotIdentifier, snapshotsDir = snapDir) => { + const snapPath = path.join(snapshotsDir, getSnapshotBasename(customSnapshotIdentifier)); if (fs.exists(snapPath)) { fs.unlink(snapPath); @@ -112,4 +114,17 @@ describe('integration tests', () => { // Test against an image much larger than the snapshot. expect(() => expect(failImageData).toMatchImageSnapshot({ customSnapshotIdentifier })).toThrowError(); // eslint-disable-line max-len }); + + it('creates snapshot in custom directory if such is specified.', () => { + const customSnapshotsDir = path.resolve(__dirname, '__custom_snapshots_dir__'); + const customSnapshotIdentifier = 'integration-5'; + + cleanSnapshot(customSnapshotIdentifier, customSnapshotsDir); + + // First we need to write a new snapshot image + expect(() => expect(imageData).toMatchImageSnapshot({ customSnapshotsDir, customSnapshotIdentifier })).not.toThrowError(); // eslint-disable-line max-len + + // Then we check if the file was created in custom directory + expect(() => fs.readFileSync(path.resolve(customSnapshotsDir, getSnapshotBasename(customSnapshotIdentifier)))).not.toThrowError(); // eslint-disable-line max-len + }); }); diff --git a/src/index.js b/src/index.js index 231ec3f..19fe87c 100644 --- a/src/index.js +++ b/src/index.js @@ -18,6 +18,8 @@ const path = require('path'); const Chalk = require('chalk').constructor; const { diffImageToSnapshot } = require('./diff-snapshot'); +const SNAPSHOTS_DIR = '__image_snapshots__'; + function updateSnapshotState(oldSnapshotState, newSnapshotState) { return merge({}, oldSnapshotState, newSnapshotState); } @@ -30,6 +32,7 @@ function configureToMatchImageSnapshot({ } = {}) { return function toMatchImageSnapshot(received, { customSnapshotIdentifier = '', + customSnapshotsDir, customDiffConfig = {}, noColors = commonNoColors, failureThreshold = commonFailureThreshold, @@ -47,7 +50,7 @@ function configureToMatchImageSnapshot({ const result = diffImageToSnapshot({ imageData: received, snapshotIdentifier, - snapshotsDir: path.join(path.dirname(testPath), '__image_snapshots__'), + snapshotsDir: customSnapshotsDir || path.join(path.dirname(testPath), SNAPSHOTS_DIR), updateSnapshot: snapshotState._updateSnapshot === 'all', customDiffConfig: Object.assign({}, commonCustomDiffConfig, customDiffConfig), failureThreshold, @@ -85,4 +88,5 @@ module.exports = { toMatchImageSnapshot: configureToMatchImageSnapshot(), configureToMatchImageSnapshot, updateSnapshotState, + SNAPSHOTS_DIR, };