fix(expect): correctly show async matcher diff (#3960)

packages/utils/src/error.ts

@@ -1,6 +1,6 @@
 import { diff } from './diff'
 import { format } from './display'
-import { getOwnProperties, getType } from './helpers'
+import { deepClone, getOwnProperties, getType } from './helpers'
 import { stringify } from './stringify'
 
 const IS_RECORD_SYMBOL = '@@__IMMUTABLE_RECORD__@@'
@@ -96,8 +96,13 @@ export function processError(err: any) {
   if (err.name)
     err.nameStr = String(err.name)
 
-  if (err.showDiff || (err.showDiff === undefined && err.expected !== undefined && err.actual !== undefined))
-    err.diff = diff(err.expected, err.actual)
+  if (err.showDiff || (err.showDiff === undefined && err.expected !== undefined && err.actual !== undefined)) {
+    const clonedActual = deepClone(err.actual, { forceWritable: true })
+    const clonedExpected = deepClone(err.expected, { forceWritable: true })
+
+    const { replacedActual, replacedExpected } = replaceAsymmetricMatcher(clonedActual, clonedExpected)
+    err.diff = diff(replacedExpected, replacedActual)
+  }
 
   if (typeof err.expected !== 'string')
     err.expected = stringify(err.expected, 10)

test/core/test/jest-expect.test.ts

@@ -787,4 +787,28 @@ it('correctly prints diff', () => {
   }
 })
 
+it('correctly prints diff with asymmetric matchers', () => {
+  try {
+    expect({ a: 1, b: 'string' }).toEqual({
+      a: expect.any(Number),
+      b: expect.any(Function),
+    })
+    expect.unreachable()
+  }
+  catch (err) {
+    setupColors(getDefaultColors())
+    const error = processError(err)
+    expect(error.diff).toMatchInlineSnapshot(`
+      "- Expected
+      + Received
+
+        Object {
+          \\"a\\": Any<Number>,
+      -   \\"b\\": Any<Function>,
+      +   \\"b\\": \\"string\\",
+        }"
+    `)
+  }
+})
+
 it('timeout', () => new Promise(resolve => setTimeout(resolve, 500)))