Having this in mind, we can talk about chai and mocha.

Mocha logo

Mocha is a JavaScript test framework running on Node.js and in the browser. Mocha allows asynchronous testing, test coverage reports, and use of any assertion library.

Chai is a BDD / TDD assertion library for NodeJS and the browser that can be delightfully paired with any javascript testing framework.

Basically, mocha is a framework and chai is a library. Let's go a little deeper in mocha.

Mocha: how can I test?

Mocha uses hooks to organize its structure. Let's talk about them.

describe() : It's used to group, which you can nest as deep;

: It's used to group, which you can nest as deep; it() : It's the test case;

: It's the test case; before() : It's a hook to run before the first it() or describe();

: It's a hook to run before the first it() or describe(); beforeEach() : It’s a hook to run before each it() or describe();

: It’s a hook to run before each it() or describe(); after() : It’s a hook to run after it() or describe();

: It’s a hook to run after it() or describe(); afterEach(): It’s a hook to run after each it() or describe();

Let's see some scenarios

Scenario 1: One test case

In this case, we can just call a solitary it(), mocha will run this only test.

Scenario 2: A nested test case

In this case, we can nest some describes() hooks and finally call it() to execute the test.

Scenario 3: Two test cases in one test

Here, inside the describe() we have two it() that will execute the tests.

Scenario 4: Run just once before the first test case

In this scenario, before the first it() mocha will execute what is inside before(), but only once.

Scenario 5: Run once before each test case

On the contrary of before(), beforeEach() is executed each time for each it() [or describe()] that we have. If we have one it(), it will be executed just once. if we have two it() it will be executed twice. If we have three it() it will be executed three times and so go on.

Scenario 6: Two tests in a big test

In this last scenario, mocha will nest the describe() and execute it().

Hands-on!!!

To see it working, let's do firstly a simple case: A calculator. Let's create a test case where our calculator should calculate the following operations:

Addition

Subtraction

Multiplication

Division

We'll use all the TDD structure using mocha.

Creating the project

First, let's create a project called mocha-chai-tests.

$ mkdir mocha-chai-tests

$ cd mocha-chai-tests

$ yarn init or $ npm init -y

Install chai and mocha.

$ yarn add chai mocha or $ npm i chai mocha --save

Inside the project mocha-chai-tests, create a folder called tests and a file called calc.js.

$ mkdir tests

$ touch tests/calc.js

Now, we can create our first test. To do this, we'll create a describe() indicating that we're doing tests on a calculator and another one indicating the addition operation. Let'call a function called add that will sum two numbers. Let's test if 1 plus 1 will be 2.

mocha-chai-tests/tests/calc.js

Hey Sam, but the file src/calculator.js doesn't exist. How can we handle this?

It doesn't exist, but it should. So much that, if we run the tests we'll get an error. Let's do this to see what happens. Type the following command on terminal: