The Battle Between Jest and Mocha for Testing JavaScript Applications

We wanted to take the time to review two of the most popular testing frameworks for Javascript: Jest and Mocha. If you are new to JavaScript testing or if you want to make sure you are using the best testing framework, then you've come to the right place. We discussed with the Ponicode community to find out which one of the two is their favorite, and we decided to share our observations and conclusions with you.

Jest

Jest is a testing framework created by Facebook. It is open source and it allows you to create JavaScript tests fast and easily.

Jest is a very complete testing framework that comes not only with a test runner, but also with its own assertion and mocking library. This means that, different from other testing frameworks, there is no need to install and integrate additional libraries to be able to mock, spy or make assertions. You'll be able to start writing your tests right after Jest is installed.

Jest is particularly popular for testing React. It is built in the create-react-app package and it is well integrated with other React testing tools such as Enzyme. The increasingly popular React Testing Library is built on Jest too.

One of the reasons for Jest’s popularity in the React community is that it lets the user create snapshot tests for components. Snapshots are a great way to monitor the changes in your application UI, and ensure that unwanted changes aren’t unknowingly introduced.

Jest might have been built with React in mind, but it's not exclusive to it. It is often used for Vue and Angular as well as other JavaScript frameworks. While Angular has Karma/Jasmine as a default testing framework, there are many tutorials out there on how to replace it with Jest. Moreover, if you look closely, Vue leaves the user a free choice between Mocha and Jest, but does point out the advantage of having snapshot tests in Jest.

Another important reason why some love Jest is its high speed of test execution. Thanks to its smart parallel testing, Jest beats its competition significantly when it comes to test speed – something that is is often important for large projects that require running large test suites in the CI.

Jest is very active with its updates and our community agrees has evolved nicely over time.

Mocha

Mocha was created in 2011, and it was originally designed for Node.js.

Mocha’s test runner, differently from Jest, comes without a built-in assertion library and instead integrates other complementary packages to provide a complete experience.

This means that in order to get started writing a simple assertion test, not to mention use any sort of test doubles (meaning mocks, spies, stubs, etc), it requires installing separate libraries. The most popular amongst these are Chai and Sinon, but the choice is completely up to the user, depending on their needs.

This approach results in a much more naked and lightweight framework that it is up to the user to customize through configuration and integration setup to achieve the perfect test environment for a specific project. Of course, this means it can take a little bit longer from installation to having your first test run.

Mocha can also be used for front-end testing. For testing React, for example, Mocha integrates well with Enzyme and Chai, so tests can be written using very similar syntax to other frameworks, using classic component testing methods such as shallowRender. Similarly, it integrates well with Vue’s test-utils library, and with a little setup, it can be used on Angular too.

So, which one is the best?

From speaking with the community, we confirmed that there isn’t a single answer to this question. The choice of one framework over another really depends on the specific needs for the project, as well as a pinch of personal preference of course.

For some, the fact that Jest comes pre-packaged with lots of utils that might not be needed for the task at hand (think of snapshot testing for a backend project!) is a bit of a turn-off.

For others, having everything available in one single place without the need to go looking for extra tools is exactly what they're looking for.

In general, however, our community seems in agreement that large back-end projects can more often benefit from the flexibility of Mocha in terms of configuration and ad-hoc external library choice.

On the other hand, if the speed of test running is of importance, the advantage of the flexibility of Mocha needs to be seriously weighed against the decisively superior speed of the Jest runner.

Similarly, if the goal is getting started fast with some tests on a relatively small project, Jest’s (almost)-no-setup-needed approach can be a winner. Jest’s benefits articulate around speed and ease.

For front-end development, there is a consensus that while Mocha does the job perfectly well, aligning with the tools promoted by the framework creators is probably a better idea, as it can guarantee better and faster updates when new framework releases are made, as well as better integration with framework-specific tools. React-Testing-Library is a good example of why it would be more convenient to use Jest than Mocha in a React project.

In terms of documentation, both frameworks have complete and well-maintained documentation, although some argue that due to being created first, Mocha wins in terms of docs clarity.

Overall, there seems to be a lot of love for both Jest and Mocha out there.

At Ponicode, we decided to start with a Jest integration for one main reason: we want to get as many people as possible unit testing, including developers who have never written one. To this goal, we figured that keeping configuration as simple as possible would be a great plus. We are, however, very much open to the idea of integrating with Mocha in the future, when there is a need!

And even if you're a software testing pro, I'm sure there are still some ways you can improve the quality of your code 😉

First published here