Jest Snapshot testing vs unit testing?

Question

It's fairly easy to implement snapshot testing in jest, but it's something I am not really comfortable with because it feels like I am not actually testing anything.

In unit testing I can easily take components I want to test and write expectations on their actual behavior and also test what they should be rendering. But all I can see about snapshot testing is that it yields when you change something and shows you the difference... similar to what git diff does.

So when should I use snapshot testing over unit testing?

Answer 1

You can think about a snapshot test as a unit test with an auto generated assumption about your component.

The advantages are that you can easily test complex structures without writing much code, that you get good warnings when something changed and that you can easily update this test.

The disadvantages are that from just reading the test it is not always clear what is tested and what the expected behaviour is, that it could happen that the created snapshot is so complex that you overlook wrong assumptions that then end up as expected result and that it is so easy to update snapshots that wrong stuff can sneak in.

So when using snapshot test its really important to make them more granular, so not always testing the whole component, but have some smaller test that test parts of it and to have good code review culture, to spot bugs in the snapshot.

Answer 2

You should write both snapshot and unit tests. Snapshot tests will check for changes when rendering, like if className, inline styles, some conditional rendering or loops are not working as they worked before. You should still write unit tests for any functionality that can't be checked with simple rendering (if onClick is called when clicked and so on).