Jest is awesome and you should use it…

Henrique Ramos Limas
3 min readMar 23, 2017

--

…or not, that choice is up to you and not me 😜. But here I will show what I found amazing about Jest, comparing it with others testing frameworks and test runners like Karma or Mocha.
But before that, lets introduce my journey with testing. I started with Karma, testing AngularJS applications because I really found amazing how Angular is easy to mock services, http requests and modules. And what about Karma? It is amazing, robust and easy to configure.
Angular was thought to make front-end application easy to test with his dependency injection and his architecture. But how about applications that don’t use Angular? How we are going to create mocks of modules that we import on es6 modules or modules from NodeJS? I know that exists some package that try to mock modules, but I always found it hard to use and configure.
And here that Jest comes in. Jest its a complete tool to test your code. Comes from the way that you wrote test, the server that run your test and also it has code coverage inside it. One of the most amazing functionality that I found in Jest, is the way it mocks modules. We just need to add a folder __mocks__ and a file with the module we want to mock and say to jest that we want to use that mock instead of the original one. Here is the structure of the folders:

Folder structure

And here is the code for the foo example (original and mocked) that we have:

Source for foo module (original and mocked)

But how we can use that in the test code? Simple as calling the jest.mock(‘foo.js’):

Testing foo module

Amazing yeah? I found it amazing and easy to use.

Great, mock is amazing, but whats next? Testing with Snapshots 📸

Snapshot testing

Should be amazing if you can just use a line of code to test your UI? To do that, that line of code needs to compare a previous version of the current version and see if something changed. If the two version are different it just throw an error. And that is Testing with Snapshots in Jest.

If we are using React, we can test our components using the expect(tree).toMatchSnapshot() and Jest will compare the current version with the previous version and it is just it. Lets see an example:

Testing a component with snapshot

When Jest run the first time it will generate a file like that on the __snapshots__ folder:

Snapshot generated by Jest

With Snapshot its easy, fast and fun to make all your components testable. In that way, you should increase your code coverage.

Mocks and Snapshots are, IMHO, the best functionality that Jest has. But it has many more that are really amazing and you should take a look. Some example are the code coverage, the watch functionality and all the mock functionality that it has.

Jest maybe can be your next tool for running tests, and I hope it will, but if it doesn’t, just take a look and play with it, you will like it.

Hope you enjoyed that post, but please add some comments below what you think about Jest and what you like or dislike of it.

--

--