All you need to know about JavaScript Testing (JEST)

As the name suggests, ‘testing’ is done when we anticipate something to work as expected and check if it does. It tends to be your work, assignment, or anything you want to check for something anticipated. Furthermore, for our situation, we believe our program should function true to form, so we test it.
Most of you could say, "Hello, we can manually check for that. Why compose a different program code to look at another program ?"

No doubt, What you believe is correct just for a little line of code. We could undoubtedly check for issues if our code is a couple of lines. Yet, consider a program with more than 1000 lines with nonconcurrent functions, values bouncing from one piece of the program to the next, and so on.
In this situation, even a little slip-up in naming a variable or error could cause the program to act unpredictably. Furthermore, troubleshooting the logic and 1000 lines of code would be a bad dream.

By the day's end, the issue can be a fundamental error. So this is where you want to write tests for our code. In this blog, we will discuss testing our code in JavaScript. I trust this approach would be preferable to composing a tedious tale. Let's dive into the details of JavaScript Testing (JEST) without wasting time.

How is testing done in JavaScript?

We use libraries for testing. Some might be inbuilt, and some should get added as a bundle/package. Furthermore, this relies upon our programming language or the application we want to test. There are different libraries for testing JavaScript code, like Mocha, Jest, and so on. Also, in this blog, we will involve Jest for testing; however, you can utilize Mocha or some other libraries you like.

What is Jest?

Jest is a testing library for JavaScript, and Facebook develops it for use within ReactJS (acquired by Facebook). And thus Jest came out. Jest is built-in with React, yet for other JS applications, we can add it as a bundle from NPM.

Jest features

• Little configs: Very rare configuration is required to get started with writing tests & deploying them. However, a config file can also be supplied to the test suite.
• Isolated tests: Jest tests are run parallelly to improve run time.
• Snapshots: It can enable snapshot testing as well. The images are matched with the saved picture and checked for matching functionality.

How to set up Jest?

For this, we won't plunge profound into cutting-edge Jest functionalities; however, we keep it straightforward with only a couple of basic tests such as:

• For the setup, we need NPM and Node. So if you haven't installed it on your system, go on and install it. If you have it, then continue.
• As per your wish, create a folder with any name. Later on, create a folder with mkdir test-js and cd into it cd test-js.
• Since we will be installing Jest as a bundle, we need to initialize our folder with NPM with npm init -y.
• We can now add Jest with npm install --save-dev Jest. We need to add it as a developer dependency; hence, we use the flag --save-dev.
• In your package.json file, you could have to change the test script command to Jest so we can just run the npm test whenever we need to test our code.

{
  "name": "test-js",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "jest"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "jest": "^24.9.0"
  }
}

• Now, we can create our JavaScript file named functions.js to write our code which will be tested using Jest.
• To write our tests, we need to create a file functions.test.js.
• We need to have our test file similar to the name of the JavaScript file we wanna test, except adding a .test in-between.

And that's it. We are now ready to get started writing code and tests.

How to write tests?

1.Writing JavaScript

• In the functions.js file, let us write some code to test.

const functions = {
  sum: (a, b) => {
    return a + b
  },
  subtract: (a, b) => {
    return a - b
  },
  copyArray: (a) => {
    return [... a]
  }
}

module.exports = functions

• We have an object containing a few functions and export the code using the module. exports = functions to bring the thing into our test file, which is to be written.

• Note that capabilities in a module aren't the filename. All things being equal, it's the name of the object we pronounced. You can record the functions independently, but remember to export them

  2.Writing tests

• Since we have three functions, let us test it utilizing Jest. How about our fucntions? We can keep in touch with a few complex functions. In our functions.test.js file,
  

const functions = require('./functions.js')

test('adds properly', () => {
    expect(functions.sum(1, 5)).toBe(6)
})

test('subtracts properly', () => {
    expect(functions.subtract(1, 2)).toBe(-1)
})

We haven't included the copyArray function in our test. Run the npm test. You may see the test pass in the terminal.

Terminologies

The common terminology of JEST :

Test

'Test' is simply a keyword in Jest. We compose tests by utilizing the capability provided by Jest called test. The syntax goes by, test("", () => {}). It takes in two parameters, a string of what the test will do and another function where we compose our genuine test.

• 1st parameter: It is simply a definition of what the test will do.
• 2nd parameter: It is a function that takes in the actual testing stuff. We use 'expect' and 'matchers' within this function.

Expect

It is also a keyword in Jest. As the name suggests, we expect something from our function or the code we have composed. The overall syntax goes by, expect().matcher()

• Within the expect function, we give the inputs for our code from which we anticipate something.
• .matcher is where we utilize various matchers like toBe, toEqual, etc. Consider these as a result from expect needs to match. It's more of a kind of '==.'

Matchers

'Matchers' is not a keyword in Jest, but it’ gets utilized to call an assortment of methods in Jest. A lot of matchers in Jest, such as,

• toBe
• toEqual
• toBeDefined
• toBeFalsy, etc.

A typical example would be the one we used in our test file, expect(functions.add(1, 5)).toBe(6). Here, the matcher used is toBe. In simpler terms, we are just doing a check like, is 1+5 == 6? If so, we get the test passed.

What's there in the test record?

In our test record, the primary thing we want to do is to import the necessary module from our JavaScript record. For our situation, we sent out the function object. So let us import that utilizing const function = require('./functions.js'). Presently our test document knows the functions inside our item from the functions.js record.

*Then at that point, a function called test has two params. *

• The first is simply a string that defines what we want to do & what the test will do.
• The second param is again a function.

In the function, we expect the add function to return the sum of whatever the params we pass. So expect(functions.add(1, 5)).toBe(6). Here is the test case we have characterized for our add function. Similarly, we anticipate that the outcomes be something for the subtract function.

The Bottom Line

QL have done Unit testing, which is testing the most reduced central blocks or units of code. Furthermore, a test-driven approach is much better than manual testing, as every fundamental block of the code is tested and confirmed. Since our model code is a couple of functions, it's currently a unit size. Trying each littlest unit of the code for massive projects is essential and makes unit testing valuable before creation.

That's it. I hope the above info will help you. Now we know the basics of Jest. There is further development stuff like asynchronous testing, snapshots, and so on, which we will talk about another time. Try some testing on your own.

Thanks!!!