Testing with Jest

Recently, I’ve completed working on an API using Node, Express, and MongoDB. Testing would require me to open up Postman to test that my users can login, see their information, upload their photos, and it all just felt very manual. I thought it would be a great way to start looking into testing on my application.

Jest is a javascript framework to ensure the correctness of your application. If you had a function in your codebase that took the sum of two numbers, how would you make sure that the function is working as intended?

const sum = (num1, num2) => {
   return num1 + num2
}

Simple enough, you know this will return the sum of whatever two parameters you’ve intended for this function but let’s say you made a typo and in the return value, you instead returned ‘num1 + num1’. Very different isn’t it? Using jest, small errors like that won’t go unnoticed.

Using Jest

Lets start by adding it to our project using:

npm i jest

Create a simple file called ‘sum.test.js’. Whenever creating the name of a file that will hold our test, it will follow this naming convention. <filename>.test.js. This is what makes a test file unique to another js file.

Inside our test file, we’re ready to start testing jest to see what the outputs look like.

// Inside of sum.test.js
test('Hello World!', () => {});
// Output
// npm test 
PASS  test/math.test.js
✓ Hello World (1 ms)
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        1.509 s
Ran all test suites related to changed files.

To get started, we define our test with the ‘test’ method which takes in a string and a callback. The string defines what exactly you’re testing; in this case we use a place holder ‘Hello World’. The callback is empty and therefore passes the test. To run your test, enter ‘npm test’ in your terminal.

So now let’s use the sum function that we wrote earlier.

const sum = require('<path to your sum file >')
test('Should return the sum of two numbers', () => {
   const total = sum(5,10);
   expect(total).toBe(15);
})

Once we require the function, essentially importing it, we can use it inside of our test. Our string clearly defines what this test should be doing and our callback uses the sum function to define our total.

Inside of the jest documentation you’ll find various methods that can be used to test. Instead of using an if statement, which you can do, you can also use their ‘expect’ method. It makes reading the test much easier. Looking at it you know that you expect your return value from sum to be 15 given the 5 and 10 arguments to the sum function. If all works you should see this:

✓ Should return the sum of two numbers (4 ms)
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.65 s
Ran all test suites related to changed files.

Great, but what if you get an error. Let’s say that you made that typo that I mentioned earlier. The sum is actually returning the sum of ‘num1 + num1’.

✕ Should return the sum of two numbers (5 ms)
● Should return the sum of two numbers
expect(received).toBe(expected) // Object.is equality
Expected: 15
Received: 10
26 | test('Should return the sum of two numbers', () => {
27 |   const total = sumOfTwo(5,10);
> 28 |   expect(total).toBe(15)
|                 ^
at Object.<anonymous> (test/math.test.js:28:17)
Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   0 total
Time:        0.728 s, estimated 1 s
Ran all test suites related to changed files.

Beautiful. It looks a bit crazy but theres a bunch of useful information here. Clearly, we aren’t getting what we want but why? Well, it can be three things. Either there’s a typo inside of your logic, your logic isn’t actually producing what you want, OR this can be an edgecase that requires additional code!

I’m still relatively new to Jest but I understand now why people prefer test driven development. Coding out your expectations and getting errors back really help define your logic much better and it also helps mitigate edge cases.

Thanks for tuning in on this one! I hope this helps someone get started with Jest. As always, happy coding!