Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

jest-snapshot: Ignore indentation for most serialized objects #9203

Merged
merged 4 commits into from
Nov 19, 2019

Conversation

pedrottimark
Copy link
Contributor

@pedrottimark pedrottimark commented Nov 18, 2019

Summary

Fixes #8626

Call diffLinesUnified2 to compare without indentation:

  • add optional indent arg to serialize received without indentation
  • call dedentLines heuristic to remove indentation from snapshot

Fall back to baseline diffLinesUnified in edge case of multi-line strings:

  • text node child of markup element
  • key or value of object property
  • item of array

Test plan

  • added 17 tests to new dedent.test.ts
  • added 5 snapshots to printSnapshot.test.ts (although my eyes have already adjusted to magenta and teal in console, <m> and <t> in snapshots will take a while longer)

See also pictures in following comment

Example pictures baseline at left and improved at right

@pedrottimark
Copy link
Contributor Author

delete lines when depth decreases in markup:

markup delete

insert lines when depth increases in markup:

markup insert

delete lines when depth decreases in object:

object delete

insert lines when depth increases in object:

object insert

alphabetical order of keys in object affects diff:

object alphabetical keys

fall back to baseline if text node is multi-line string:

markup fall back

Copy link
Member

@SimenB SimenB left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is so good, I continue to be amazed over how much you're able to do with these matchers. Great job! 👏

Question, does this also work for inline snapshots? I'd assume so, but since we already mess with indentation in them, I thought I'd ask.

Another q - should GlobalConfig.expand show more (full) diff?

Copy link
Collaborator

@thymikee thymikee left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<3

};
const indented = formatLines2(val);

expect(dedentLines(indented)).toEqual(null);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's quite a bunch of repetition in these tests. It's quite readable and I don't say it's bad. However, have you considered using test.each where it makes sense (e.g. for smaller inputs)?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh yeah, super suggestion!

@pedrottimark
Copy link
Contributor Author

Here is a picture to answer 2 questions:

  • Thank you for reminding me to show an inline snapshot
  • CLI option affects common lines: default --no-expand at left and --expand at right

expand

Many thanks Simen and Michał for patient review of so many prerequisite pull requests to reduce complexity so that we can spend some where it makes a difference (pardon pun :)

@SimenB
Copy link
Member

SimenB commented Nov 19, 2019

Thoughts on some sort of gutter indicator whitespace is not highlighted when expand? The diff will be there if people do git diff afterwards so maybe it makes sense when they've asked for larger diff?
Maybe not though! Feel free to merge when you're happy 🙂

@pedrottimark
Copy link
Contributor Author

@SimenB You mean a visual hint where indentation differs, but lines are considered common?

I used cyan instead of dim for non-snapshot matchers, but deleted it in the jest-diff refactor:

  • because as you say, default --no-expand option omits those lines
  • vague intuition told me we might need the color for another purpose ;)

Just to stretch our imaginations, this problem would have been solved automatically for markup, if the plugins did not indent tags but did indent the additional lines of multi-line text nodes:

<div>
<pre
  className="language-js"
>
  for (key in foo) {
    if (Object.prototype.hasOwnProperty.call(foo, key)) {
      doSomething(key);
    }
  }
</pre>
</div>

@pedrottimark pedrottimark merged commit 7df4cda into jestjs:master Nov 19, 2019
@pedrottimark pedrottimark deleted the snapshot-indentation branch November 19, 2019 22:41
ayush000 added a commit to ayush000/jest that referenced this pull request Nov 21, 2019
* master:
  chore: upgrade to fsevents 2 (jestjs#9215)
  docs: remove expect.assertions(1) in rejects example of Tutoria… (jestjs#9149)
  chore: bump to istanbul alphas (jestjs#9192)
  Fix typo in JestPlatform.md (jestjs#9212)
  jest-snapshot: Ignore indentation for most serialized objects (jestjs#9203)
  fix(jest-types): tighten Config types and set more defaults (jestjs#9200)
  jest-snapshot: Improve colors when snapshots are updatable (jestjs#9132)
  jest-snapshot: Omit irrelevant received properties when property matchers fail (jestjs#9198)
  chore: make changedFiles option optional in `shouldInstrument` (jestjs#9197)
  fix(pretty-format): correctly detect memo (jestjs#9196)
  chore: regenerate lockfiles in e2e tests (jestjs#9193)
  chore: bump handlebars
martijnwalraven added a commit to apollographql/federation that referenced this pull request Feb 4, 2021
We need to re-indent the lines printed from `graphql-js` in `astSerializer`, because Jest has started to ignore indentation when diffing snapshots, and it does this by invoking snapshot serializers with these values set to 0.

Without re-indenting, every line printed from `graphql-js` would be shown as changed. See jestjs/jest#9203.
@github-actions
Copy link

This pull request 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.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators May 11, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Optionally hide whitespace changes in diff
4 participants