- Facebook claim that Jest is a delightful JavaScript testing framework, with a focus on simplicity. It works with projects using Babel, TypeScript, Node, React, Angular, Vue, and more. It's Open Source, and its capable of testing any kind of JavaScript application. It can follow Behavior-Driven Development to ensure that each line in the JavaScript is properly tested. Its syntax is small and simple, and it can test the smallest part of an application as a unit. The main advantages of Jest are that, It doesn't depend on any other JavaScript framework or a library. It doesn't need a DOM to test, and it has clean an obvious syntax. As with many testing frameworks, it splits testing golp into smaller chunks. A suite is used to define collections of similar type test cases written for a specific file and, or function. You can nest Suites to split files, and functions down further. Jest has files usually containing describe function. This is how a Suite is defined. Suites commonly have at least one test inside them. However, test files need not contain any Suites. The describe function has two arguments. The first is a string used to identify the test suite, and a callback function that contains the test specs. Tests are defined using either the it or a test function. there's no difference between them. If you check out the documentation, you'll find that it, is just an alias for test. They take two arguments similar to the describe function, a string to identify the test by, and a callback function that contains the steps to perform the test. The callback should have, some form of assertion at the end of it. Usually a call to expect. The expect function defines the actual value obtained by running the test. You can have more than one expect in a test. Although this is generally discouraged as a spec should only test one feature functional value. The second part of the expect call is to chain a Matcher function, to help compare the expected result with the actual result. Jest provides a large number of common built-in matchers like two equal. Each matcher, does a billion comparison on the actual and expected outputs. Here's a list and a set of descriptions for some of the built-in matchers. The full list can be found in the Jest API, and there's far too many for us to go into the more all we'll explain the ones we use as we use them. If you've looked through the built-in matchers, and none of them are appropriate, you can create a custom matcher as long as you follow the correct pattern. Again, the Jest documentation explains how you can create these, the testing functionality of Project Setup using create react app have a code coverage tool included. The switch minus minus minus minus coverage is used on the end of the NPM test command. This generates a test report on the console, but also stores the results in a /coverage folder. This has reports in many formats. If you want the interactive HTML report, this can be found in the index.html file in the lcove-report folder. So there's an overview of Jest and how it can be used to test JavaScript. Coming up, we'll see how we use it specifically to test react components. So here's an example of a test spec that has one suite and three tests. The suite defines two variables A and B that are initially undefined. The first test defines A and asserts that it is true. The second sets A to false and defines B as a string, and asserts that the string mi is somewhere in it. The third test asserts A is true and not a falsy . when we run these tests, the first two pass and the third fails. This is because the values for variables used in test follow normal JavaScript scope. If apparent level value is changed inside a spec, it will change false following specs.

Lectures

Introduction to Testing React with Jest - How to set up the Test Environment - The What and How of Testing in React - Snapshot Testing - Testing Components with Props - Mocking Components for Testing - Testing State Events Interactions - Mocking Functions - Testing Components Asynchronously - Testing Components with Routing - Testing Custom Hooks