Skip to content

Commit 7407b7e

Browse files
novemberbornkevva
authored andcommitted
Update readme
1 parent c7c8861 commit 7407b7e

File tree

2 files changed

+13
-25
lines changed

2 files changed

+13
-25
lines changed

media/snapshot-testing.png

-42.4 KB
Loading

readme.md

Lines changed: 13 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -923,11 +923,7 @@ Assert that `value` is not the same as `expected`. This is based on [`Object.is(
923923

924924
### `.deepEqual(value, expected, [message])`
925925

926-
Assert that `value` is deeply equal to `expected`. This is based on [Lodash's `isEqual()`](https://lodash.com/docs/4.17.4#isEqual):
927-
928-
> Performs a deep comparison between two values to determine if they are equivalent.
929-
>
930-
> *Note*: This method supports comparing arrays, array buffers, booleans, date objects, error objects, maps, numbers, `Object` objects, regexes, sets, strings, symbols, and typed arrays. `Object` objects are compared by their own, not inherited, enumerable properties. Functions and DOM nodes are compared by strict equality, i.e. `===`.
926+
Assert that `value` is deeply equal to `expected`. See [Concordance](https://github.com/concordancejs/concordance) for details. Works with [React elements and `react-test-renderer`](https://github.com/concordancejs/react).
931927

932928
### `.notDeepEqual(value, expected, [message])`
933929

@@ -998,15 +994,14 @@ Assert that `contents` does not match `regex`.
998994

999995
Assert that `error` is falsy.
1000996

1001-
### `.snapshot(contents, [message])`
997+
### `.snapshot(expected, [message])`
998+
### `.snapshot(expected, [options], [message])`
1002999

1003-
Make a snapshot of the stringified `contents`.
1000+
Compares the `expected` value with a previously recorded snapshot. Snapshots are stored for each test, so ensure you give your tests unique titles. Alternatively pass an `options` object to select a specific snapshot, for instance `{id: 'my snapshot'}`.
10041001

10051002
## Snapshot testing
10061003

1007-
Snapshot testing comes as another kind of assertion and uses [jest-snapshot](https://facebook.github.io/jest/blog/2016/07/27/jest-14.html) under the hood.
1008-
1009-
When used with React, it looks very similar to Jest:
1004+
AVA supports snapshot testing, [as introduced by Jest](https://facebook.github.io/jest/docs/snapshot-testing.html), through its [Assertions](#assertions) interface. You can snapshot any value as well as React elements:
10101005

10111006
```js
10121007
// Your component
@@ -1028,32 +1023,25 @@ test('HelloWorld component', t => {
10281023
});
10291024
```
10301025

1031-
The first time you run this test, a snapshot file will be created in `__snapshots__` folder looking something like this:
1026+
Snapshots are stored alongside your test files. If your tests are in a `test` or `tests` folder the snapshots will be stored in a `snapshots` folder. If your tests are in a `__tests__` folder then they they'll be stored in a `__snapshots__` folder.
10321027

1033-
```js
1034-
exports[`HelloWorld component 1`] = `
1035-
<h1>
1036-
Hello World...!
1037-
</h1>
1038-
`;
1039-
```
1028+
Say you have `~/project/test/main.js` which contains snapshot assertions. AVA will create two files:
10401029

1041-
These snapshots should be committed together with your code so that everyone on the team shares current state of the app.
1030+
* `~/project/test/snapshots/main.js.snap`
1031+
* `~/project/test/snapshots/main.js.md`
10421032

1043-
Every time you run this test afterwards, it will check if the component render has changed. If it did, it will fail the test.
1033+
The first file contains the actual snapshot and is required for future comparisons. The second file contains your *snapshot report*. It's regenerated when you update your snapshots. If you commit it to source control you can diff it to see the changes to your snapshot.
10441034

1045-
<img src="media/snapshot-testing.png" width="814">
1035+
AVA will show why your snapshot assertion failed:
10461036

1047-
Then you will have the choice to check your code - and if the change was intentional, you can use the `--update-snapshots` (or `-u`) flag to update the snapshots into their new version.
1037+
<img src="media/snapshot-testing.png" width="814">
10481038

1049-
That might look like this:
1039+
You can then check your code. If the change was intentional you can use the `--update-snapshots` (or `-u`) flag to update the snapshots:
10501040

10511041
```console
10521042
$ ava --update-snapshots
10531043
```
10541044

1055-
Note that snapshots can be used for much more than just testing components - you can equally well test any other (data) structure that you can stringify.
1056-
10571045
### Skipping assertions
10581046

10591047
Any assertion can be skipped using the `skip` modifier. Skipped assertions are still counted, so there is no need to change your planned assertion count.

0 commit comments

Comments
 (0)