Testing React components

We already know that unit testing involves checking small units, which, most often, are just functions that perform some logic and return a result. The same principle applies when testing React components. We know that at their core, React components are actually createElement functions that return a node that, as a result of the render function, is displayed on the browser screen as HTML elements. In unit testing, we don't have a browser, but this is not a problem for us since we know that the render target in React can be almost anything. As you may have already guessed, in the unit tests of React components, we will be rendering components into a specially created JSDOM environment, which is identical to the browser DOM, and the React Testing Library will help us with this. This library contains a set of tools that allow rendering components, simulating events, and then checking the results in various ways.

Before we start, let's set up the environment...