Don't highlight passing asymmetric matchers as changes in diffs

[calebeby]

🚀 Feature Proposal

Hi 👋. I think it would be great if Jest would better highlight diffs for objects with asymmetric matchers. Currently, Jest highlights correct/passing asymmetric matchers as changes, which is confusing to the user. I propose that Jest only highlights the matchers that do not pass.

For example:

test('asdf', () => {
  expect({ name: 'asdf' }).toStrictEqual({
    name: expect.any(String),
    week: expect.any(Number),
  })
})

This output is unclear to the user. It shows that the name property is different from the expected value, which makes it less clear that the week property is missing. Objects with more properties make it harder and harder to tell the actual changes.

I propose that Jest highlights the above example like:

- Expected
+ Received

  Object {
    "name": "asdf",
-   "week": Any<Number>,
  }

This would make it much more clear to the user which property is missing.

[SimenB]

I like this suggestion!

@pedrottimark think it's possible?

[pedrottimark]

@calebeby Thank you for the example. Yes, I agree the output is unclear. It’s a challenge to fix :)

We need to break down barriers of lost information between steps evaluate, serialize, and diff.

If you are interested to lend a hand, here are current thoughts what we might need to do:

1. Make a suite of realistic test failures (like this) in which the report can become clearer.
2. In expect package:
   • build a data structure corresponding to evaluation of an assertion to distinguish which properties of received and expected values passed and failed
   • export ability to compute differences of failed values recursively to find common properties
3. In new counterpart to jest-diff package:
   • as first pass, compute data structure (described above) to find data differences
   • as second pass, compare serialization of data differences
4. In pretty-format package: instead of serializing entire received and expected values, format a common value with inline differences either by new custom diff object or improved API for composite objects like array, object, map, set, and so on

[SimenB]

@rickhanlonii can we reuse something here from snapshot property matchers? Or vice versa

[rickhanlonii]

Is this a dupe of #6184?

[calebeby]

I believe so

[rickhanlonii]

Cool, thanks, will close in favor of that since it's older 👌

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.