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.

Sign up for GitHub

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

Jump to bottom

Interactive Snapshot Mode improvements #5864

Merged
merged 13 commits into from
Mar 26, 2018
Merged

Interactive Snapshot Mode improvements #5864

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
1825ed4
Interactive Snapshot Mode updates
rickhanlonii Mar 25, 2018
2ac970b
Update docs
rickhanlonii Mar 25, 2018
f6c9ead
Squash images
rickhanlonii Mar 25, 2018
9ce3f4b
More squashing
rickhanlonii Mar 25, 2018
733c032
Update snaps
rickhanlonii Mar 25, 2018
6fb9184
Move arrow to a const
rickhanlonii Mar 25, 2018
7a6cd1b
Add comment
rickhanlonii Mar 25, 2018
7537f58
Update GIF
rickhanlonii Mar 25, 2018
170f708
Clarify cursorUp usage
rickhanlonii Mar 25, 2018
d525507
Update snaps
rickhanlonii Mar 25, 2018
daa8fcc
Update CHANGELOG
rickhanlonii Mar 25, 2018
2eb3a44
Merge remote-tracking branch 'upstream/master' into rh-interactive-im…
rickhanlonii Mar 25, 2018
d66a2b8
Add AssertionLocation type
rickhanlonii Mar 25, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 3 additions & 1 deletion CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,9 @@
([#5605](https://github.com/facebook/jest/pull/5605))
* `[jest-cli]` Add `isSerial` property that runners can expose to specify that
they can not run in parallel
[#5706](https://github.com/facebook/jest/pull/5706)
([#5706](https://github.com/facebook/jest/pull/5706))
* `[jest-cli]` Interactive Snapshot Mode improvements
([#5864](https://github.com/facebook/jest/pull/5864))

### Fixes

Expand Down
9 changes: 7 additions & 2 deletions docs/SnapshotTesting.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,13 +128,18 @@ Failed snapshots can also be updated interactively in watch mode:
![](/jest/img/content/interactiveSnapshot.png)

Once you enter Interactive Snapshot Mode, Jest will step you through the failed
snapshots one test suite at a time and give you the opportunity to review the
failed output.
snapshots one test at a time and give you the opportunity to review the failed
output.

From here you can choose to update that snapshot or skip to the next:

![](/jest/img/content/interactiveSnapshotUpdate.gif)
Copy link
Member

@SimenB SimenB Mar 25, 2018 •
edited

Choose a reason for hiding this comment

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

in the new gif, mind turning off the text effect (https://github.com/zeit/hyper-power?)? It's a bit distracting.

And maybe consider having something like https://github.com/keycastr/keycastr? I find it a bit confusing following what's going on 🙂

Other than that, slick demo! 👍

Copy link
Member Author

Choose a reason for hiding this comment

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

Updated, thanks for the tip


Once you're finished, Jest will give you a summary before returning back to
watch mode:

![](/jest/img/content/interactiveSnapshotDone.png)

### Tests Should Be Deterministic

Your tests should be deterministic. That is, running the same tests multiple
Expand Down
298 changes: 285 additions & 13 deletions packages/jest-cli/src/__tests__/__snapshots__/snapshot_interactive_mode.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,36 +1,308 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`SnapshotInteractiveMode updateWithResults last test success, trigger end of interactive mode 1`] = `"TEST RESULTS CONTENTS"`;
exports[`SnapshotInteractiveMode skip 1 test, then quit 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, then quit 2`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>1 snapshot reviewed<bold></>, <bold><yellow>1 snapshot skipped</></>

<bold>Watch Usage</>
<dim> › Press </>r<dim> to restart Interactive Snapshot Mode.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, then restart 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, then restart 2`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>1 snapshot reviewed<bold></>, <bold><yellow>1 snapshot skipped</></>

<bold>Watch Usage</>
<dim> › Press </>r<dim> to restart Interactive Snapshot Mode.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, then restart 3`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, update 1 test, then finish and restart 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>2 snapshots remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, update 1 test, then finish and restart 2`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>, <bold><yellow>1 snapshot skipped</></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, update 1 test, then finish and restart 3`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>2 snapshots reviewed<bold></>, <bold><green>1 snapshot updated</></>, <bold><yellow>1 snapshot skipped</></>

<bold>Watch Usage</>
<dim> › Press </>r<dim> to restart Interactive Snapshot Mode.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
"
`;

exports[`SnapshotInteractiveMode skip 1 test, update 1 test, then finish and restart 4`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 2 tests, then finish and restart 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>2 snapshots remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 2 tests, then finish and restart 2`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>, <bold><yellow>1 snapshot skipped</></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode skip 2 tests, then finish and restart 3`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>2 snapshots reviewed<bold></>, <bold><yellow>2 snapshots skipped</></>

exports[`SnapshotInteractiveMode updateWithResults overlay handle progress UI 1`] = `
"TEST RESULTS CONTENTS
[MOCK - cursorUp]
<bold>Watch Usage</>
<dim> › Press </>r<dim> to restart Interactive Snapshot Mode.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
"
`;

exports[`SnapshotInteractiveMode skip 2 tests, then finish and restart 4`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><red>2 suites failed</></>, <bold><green>1 suite passed</></>
› <bold><dim>2 snapshots remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test suite.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Update Mode.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode updateWithResults with a test failure simply update UI 1`] = `
"TEST RESULTS CONTENTS
[MOCK - cursorUp]
exports[`SnapshotInteractiveMode update 1 test, skip 1 test, then finish and restart 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><red>1 suite failed</></>
› <bold><dim>2 snapshots remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Update Mode.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode updateWithResults with a test success, call the next test 1`] = `"TEST RESULTS CONTENTS"`;
exports[`SnapshotInteractiveMode update 1 test, skip 1 test, then finish and restart 2`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>, <bold><green>1 snapshot updated</></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode update 1 test, skip 1 test, then finish and restart 3`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>2 snapshots reviewed<bold></>, <bold><green>1 snapshot updated</></>, <bold><yellow>1 snapshot skipped</></>

<bold>Watch Usage</>
<dim> › Press </>r<dim> to restart Interactive Snapshot Mode.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
"
`;

exports[`SnapshotInteractiveMode update 1 test, skip 1 test, then finish and restart 4`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode update 1 test, then finish and return 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode update 1 test, then finish and return 2`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>1 snapshot reviewed<bold></>, <bold><green>1 snapshot updated</></>

<bold>Watch Usage</>
<dim> › Press </>Enter<dim> to return to watch mode.</>
"
`;

exports[`SnapshotInteractiveMode update 2 tests, then finish and return 1`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>2 snapshots remaining<bold></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode update 2 tests, then finish and return 2`] = `
"[MOCK - cursorUp]
[MOCK - eraseDown]

<bold>Interactive Snapshot Progress</>
› <bold><dim>1 snapshot remaining<bold></>, <bold><green>1 snapshot updated</></>

<bold>Watch Usage</>
<dim> › Press </>u<dim> to update failing snapshots for this test.</>
<dim> › Press </>s<dim> to skip the current test.</>
<dim> › Press </>q<dim> to quit Interactive Snapshot Mode.</>
<dim> › Press </>Enter<dim> to trigger a test run.</>
"
`;

exports[`SnapshotInteractiveMode update 2 tests, then finish and return 3`] = `
"[MOCK - eraseDown]

<bold>Interactive Snapshot Result</>
› <bold><dim>2 snapshots reviewed<bold></>, <bold><green>2 snapshots updated</></>

<bold>Watch Usage</>
<dim> › Press </>Enter<dim> to return to watch mode.</>
"
`;