Snapshots can be helpful, but if used improperly they can useless or even a burden.
Don't snapshot things you don't care about. Don't snapshot an entire wrapper component if you are only interested in a single subcomponent. You can use enzyme's find()
(available on both shallow and full wrappers).
Just like you shouldn't snapshot an entire wrapper if you are only interested in a single subcomponent, you shouldn't snapshot all of the subcomponents if you are only interested in the wrapper component. Use shallow()
(as opposed to mount()
) to exclude child component implementation details.
Note: for non-snapshot tests, the full DOM mount()
is usually preferable.
A stored snapshot is only as good as our ability to review it when it changes. Therefore keeping snapshots short and readable is very important to allow for thorough reviews. As a guideline, try to keep your snapshots under 50 lines.
If you are losing faith in the snapshot or are having trouble reading the diff, consider removing it. For example, if a snapshot test breaks and you are tempted to just update the snapshot (u
in Jest) because you can't figure out what's going on, remove and replace it.
Likely you'll need to break up the snapshot test into a few more targeted assertions.