fix(matcher): update suggestion and snapshot summary to display corre…

…ct values
americanexpress · Jun 7, 2018 · 0ce55c6 · 0ce55c6
1 parent c503314
commit 0ce55c6
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 6 deletions.
diff --git a/__tests__/index.spec.js b/__tests__/index.spec.js
@@ -35,6 +35,8 @@ describe('toMatchImageSnapshot', () => {
   }
 
   beforeEach(() => {
+    // In tests, skip reporting (skip snapshotState update to not mess with our test report)
+    global.UNSTABLE_SKIP_REPORTING = true;
     jest.resetModules();
     jest.resetAllMocks();
   });
@@ -363,3 +365,14 @@ describe('toMatchImageSnapshot', () => {
     });
   });
 });
+
+describe('updateSnapshotState', () => {
+  it('mutates original state', () => {
+    const { updateSnapshotState } = require('../src/index');
+    global.UNSTABLE_SKIP_REPORTING = false;
+    const originalState = { some: 'value' };
+    updateSnapshotState(originalState, { another: 'val' });
+
+    expect(originalState).toEqual({ some: 'value', another: 'val' });
+  });
+});
diff --git a/__tests__/integration.spec.js b/__tests__/integration.spec.js
@@ -29,6 +29,8 @@ describe('toMatchImageSnapshot', () => {
   const diffExists = identifier => fs.existsSync(path.join(__dirname, diffOutputDir(), `${identifier}-diff.png`));
 
   beforeAll(() => {
+    // In tests, skip reporting (skip snapshotState update to not mess with our test report)
+    global.UNSTABLE_SKIP_REPORTING = true;
     const { toMatchImageSnapshot } = require('../src'); // eslint-disable-line global-require
     expect.extend({ toMatchImageSnapshot });
   });

diff --git a/src/index.js b/src/index.js
@@ -21,8 +21,11 @@ const fs = require('fs');
 
 const SNAPSHOTS_DIR = '__image_snapshots__';
 
-function updateSnapshotState(oldSnapshotState, newSnapshotState) {
-  return merge({}, oldSnapshotState, newSnapshotState);
+function updateSnapshotState(originalSnapshotState, partialSnapshotState) {
+  if (global.UNSTABLE_SKIP_REPORTING) {
+    return originalSnapshotState;
+  }
+  return merge(originalSnapshotState, partialSnapshotState);
 }
 
 function configureToMatchImageSnapshot({
@@ -40,12 +43,14 @@ function configureToMatchImageSnapshot({
     failureThreshold = commonFailureThreshold,
     failureThresholdType = commonFailureThresholdType,
   } = {}) {
-    const { testPath, currentTestName, isNot } = this;
+    const {
+      testPath, currentTestName, isNot, snapshotState,
+    } = this;
     const chalk = new Chalk({ enabled: !noColors });
 
-    let { snapshotState } = this;
     if (isNot) { throw new Error('Jest: `.not` cannot be used with `.toMatchImageSnapshot()`.'); }
 
+
     updateSnapshotState(snapshotState, { _counters: snapshotState._counters.set(currentTestName, (snapshotState._counters.get(currentTestName) || 0) + 1) }); // eslint-disable-line max-len
     const snapshotIdentifier = customSnapshotIdentifier || kebabCase(`${path.basename(testPath)}-${currentTestName}-${snapshotState._counters.get(currentTestName)}`);
 
@@ -82,13 +87,14 @@ function configureToMatchImageSnapshot({
     if (result.updated) {
       // once transition away from jasmine is done this will be a lot more elegant and pure
       // https://github.com/facebook/jest/pull/3668
-      snapshotState = updateSnapshotState(snapshotState, { updated: snapshotState.updated += 1 });
+      updateSnapshotState(snapshotState, { updated: snapshotState.updated + 1 });
     } else if (result.added) {
-      snapshotState = updateSnapshotState(snapshotState, { added: snapshotState.added += 1 });
+      updateSnapshotState(snapshotState, { added: snapshotState.added + 1 });
     } else {
       ({ pass } = result);
 
       if (!pass) {
+        updateSnapshotState(snapshotState, { unmatched: snapshotState.unmatched + 1 });
         const differencePercentage = result.diffRatio * 100;
         message = () => `Expected image to match or be a close match to snapshot but was ${differencePercentage}% different from snapshot (${result.diffPixelCount} differing pixels).\n`
                   + `${chalk.bold.red('See diff for details:')} ${chalk.red(result.diffOutputPath)}`;
@@ -105,4 +111,5 @@ function configureToMatchImageSnapshot({
 module.exports = {
   toMatchImageSnapshot: configureToMatchImageSnapshot(),
   configureToMatchImageSnapshot,
+  updateSnapshotState,
 };