From d0d1cad528cd20cde54a039f8f3f56a6710448f5 Mon Sep 17 00:00:00 2001 From: Halldor Thorhallsson Date: Fri, 21 Oct 2022 15:22:45 -0400 Subject: [PATCH 1/3] Fixes #13480 --- packages/jest-matcher-utils/src/index.ts | 25 +++++++++++++------ .../__snapshots__/printSnapshot.test.ts.snap | 18 ++++++++++--- .../src/__tests__/printSnapshot.test.ts | 15 +++++++++++ packages/jest-snapshot/src/printSnapshot.ts | 9 +++++-- 4 files changed, 53 insertions(+), 14 deletions(-) diff --git a/packages/jest-matcher-utils/src/index.ts b/packages/jest-matcher-utils/src/index.ts index 8985eab6ade8..4dc18aec096f 100644 --- a/packages/jest-matcher-utils/src/index.ts +++ b/packages/jest-matcher-utils/src/index.ts @@ -363,12 +363,7 @@ export const printDiffOrStringify = ( if (isLineDiffable(expected, received)) { const {replacedExpected, replacedReceived} = - replaceMatchedToAsymmetricMatcher( - deepCyclicCopyReplaceable(expected), - deepCyclicCopyReplaceable(received), - [], - [], - ); + replaceMatchedToAsymmetricMatcher(expected, received, [], []); const difference = diffDefault(replacedExpected, replacedReceived, { aAnnotation: expectedLabel, bAnnotation: receivedLabel, @@ -412,7 +407,21 @@ const shouldPrintDiff = (actual: unknown, expected: unknown) => { return true; }; -function replaceMatchedToAsymmetricMatcher( +export const replaceMatchedToAsymmetricMatcher = ( + replacedExpected: unknown, + replacedReceived: unknown, + expectedCycles: Array, + receivedCycles: Array, +): any => { + return _replaceMatchedToAsymmetricMatcher( + deepCyclicCopyReplaceable(replacedExpected), + deepCyclicCopyReplaceable(replacedReceived), + expectedCycles, + receivedCycles, + ); +}; + +function _replaceMatchedToAsymmetricMatcher( replacedExpected: unknown, replacedReceived: unknown, expectedCycles: Array, @@ -446,7 +455,7 @@ function replaceMatchedToAsymmetricMatcher( expectedReplaceable.set(key, receivedValue); } } else if (Replaceable.isReplaceable(expectedValue, receivedValue)) { - const replaced = replaceMatchedToAsymmetricMatcher( + const replaced = _replaceMatchedToAsymmetricMatcher( expectedValue, receivedValue, expectedCycles, diff --git a/packages/jest-snapshot/src/__tests__/__snapshots__/printSnapshot.test.ts.snap b/packages/jest-snapshot/src/__tests__/__snapshots__/printSnapshot.test.ts.snap index 4fa135cd940a..b1d923f8275d 100644 --- a/packages/jest-snapshot/src/__tests__/__snapshots__/printSnapshot.test.ts.snap +++ b/packages/jest-snapshot/src/__tests__/__snapshots__/printSnapshot.test.ts.snap @@ -259,13 +259,23 @@ Received: "received" `; exports[`printPropertiesAndReceived omit missing properties 1`] = ` -- Expected properties - 2 -+ Received value + 1 +- Expected properties - 1 ++ Received value + 0 Object { - "hash": Any, -- "path": Any, -+ "path": "…", + "path": Any, + } +`; + +exports[`printPropertiesAndReceived only highlight non passing properties 1`] = ` +- Expected properties - 1 ++ Received value + 1 + + Object { + "a": Any, +- "b": Any, ++ "b": "some string", } `; diff --git a/packages/jest-snapshot/src/__tests__/printSnapshot.test.ts b/packages/jest-snapshot/src/__tests__/printSnapshot.test.ts index f76eee2aa566..1a2ccfd638b2 100644 --- a/packages/jest-snapshot/src/__tests__/printSnapshot.test.ts +++ b/packages/jest-snapshot/src/__tests__/printSnapshot.test.ts @@ -809,6 +809,21 @@ describe('printPropertiesAndReceived', () => { printPropertiesAndReceived(properties, received, false), ).toMatchSnapshot(); }); + + test('only highlight non passing properties', () => { + const received = { + a: 1, + b: 'some string', + c: 'another string', + }; + const properties = { + a: expect.any(Number), + b: expect.any(Number), + }; + expect( + printPropertiesAndReceived(properties, received, false), + ).toMatchSnapshot(); + }); }); describe('printSnapshotAndReceived', () => { diff --git a/packages/jest-snapshot/src/printSnapshot.ts b/packages/jest-snapshot/src/printSnapshot.ts index b49a64492eca..5672bbaa9011 100644 --- a/packages/jest-snapshot/src/printSnapshot.ts +++ b/packages/jest-snapshot/src/printSnapshot.ts @@ -27,6 +27,7 @@ import { RECEIVED_COLOR, getLabelPrinter, matcherHint, + replaceMatchedToAsymmetricMatcher, } from 'jest-matcher-utils'; import {format as prettyFormat} from 'pretty-format'; import { @@ -205,9 +206,13 @@ export const printPropertiesAndReceived = ( const bAnnotation = 'Received value'; if (isLineDiffable(properties) && isLineDiffable(received)) { + const {replacedExpected, replacedReceived} = + replaceMatchedToAsymmetricMatcher(properties, received, [], []); return diffLinesUnified( - serialize(properties).split('\n'), - serialize(getObjectSubset(received, properties)).split('\n'), + serialize(replacedExpected).split('\n'), + serialize(getObjectSubset(replacedReceived, replacedExpected)).split( + '\n', + ), { aAnnotation, aColor: EXPECTED_COLOR, From b63882d762a1b4638da0673d34d8748b1c926334 Mon Sep 17 00:00:00 2001 From: Halldor Thorhallsson Date: Sun, 23 Oct 2022 10:44:27 -0400 Subject: [PATCH 2/3] Added type to replaceMatchedToAsymmetricMatcher --- packages/jest-matcher-utils/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/jest-matcher-utils/src/index.ts b/packages/jest-matcher-utils/src/index.ts index 4dc18aec096f..99c35101c46c 100644 --- a/packages/jest-matcher-utils/src/index.ts +++ b/packages/jest-matcher-utils/src/index.ts @@ -412,7 +412,7 @@ export const replaceMatchedToAsymmetricMatcher = ( replacedReceived: unknown, expectedCycles: Array, receivedCycles: Array, -): any => { +): {replacedExpected: unknown; replacedReceived: unknown} => { return _replaceMatchedToAsymmetricMatcher( deepCyclicCopyReplaceable(replacedExpected), deepCyclicCopyReplaceable(replacedReceived), From 2154843f0223802610fcbbb26e2f27465f2dd9e2 Mon Sep 17 00:00:00 2001 From: Halldor Thorhallsson Date: Sun, 23 Oct 2022 19:01:34 -0400 Subject: [PATCH 3/3] Add changelog entry and adhere to styleguide when exporting functions --- CHANGELOG.md | 1 + packages/jest-matcher-utils/src/index.ts | 6 +++--- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index fbba7206284a..73ad9e9275f4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,7 @@ - `[@jest/test-sequencer]` Make sure sharding does not produce empty groups ([#13476](https://github.com/facebook/jest/pull/13476)) - `[jest-circus]` Test marked as `todo` are shown as todo when inside a focussed describe ([#13504](https://github.com/facebook/jest/pull/13504)) - `[jest-mock]` Ensure mock resolved and rejected values are promises from correct realm ([#13503](https://github.com/facebook/jest/pull/13503)) +- `[jest-snapshot]` Don't highlight passing asymmetric property matchers in snapshot diff ([#13480](https://github.com/facebook/jest/issues/13480)) ### Chore & Maintenance diff --git a/packages/jest-matcher-utils/src/index.ts b/packages/jest-matcher-utils/src/index.ts index 99c35101c46c..94ae0d1acc7c 100644 --- a/packages/jest-matcher-utils/src/index.ts +++ b/packages/jest-matcher-utils/src/index.ts @@ -407,19 +407,19 @@ const shouldPrintDiff = (actual: unknown, expected: unknown) => { return true; }; -export const replaceMatchedToAsymmetricMatcher = ( +export function replaceMatchedToAsymmetricMatcher( replacedExpected: unknown, replacedReceived: unknown, expectedCycles: Array, receivedCycles: Array, -): {replacedExpected: unknown; replacedReceived: unknown} => { +): {replacedExpected: unknown; replacedReceived: unknown} { return _replaceMatchedToAsymmetricMatcher( deepCyclicCopyReplaceable(replacedExpected), deepCyclicCopyReplaceable(replacedReceived), expectedCycles, receivedCycles, ); -}; +} function _replaceMatchedToAsymmetricMatcher( replacedExpected: unknown,