How to Install React Testing Library with Yarn and NPM

The Daily Life Of Darth Vader by Paweł Kadysz

React Testing Library is a popular tool for testing React components. It focuses on testing user interactions rather than implementation details, resulting in more robust and maintainable tests. If you’re starting a new project or looking to integrate React Testing Library into an existing one, here’s how you can do it using either Yarn or NPM.

Initialize a new project (if needed): If you haven’t already set up a project, you can create a new one by running:

yarn init

Install React Testing Library: Run the following command to add React Testing Library to your project:

yarn add @testing-library/react @testing-library/dom

Verify Installation: After the installation is complete, you can verify that React Testing Library is installed correctly by checking your package.json file or by running:

yarn list --depth=0

You should see @testing-library/react and @testing-library/dom in the list of installed packages.

Installing with npm

If you prefer using npm, you can install React Testing Library by following these steps:

1. Initialize a new project (if needed): If you haven’t already set up a project, you can create a new one by running:

npm init

Install React Testing Library: Run the following command to add React Testing Library to your project:

npm install --save-dev @testing-library/react @testing-library/dom

Verify Installation: After the installation is complete, you can verify that React Testing Library is installed correctly by checking your package.json file or by running:

npm ls --depth=0

You should see @testing-library/react and @testing-library/dom in the list of installed packages.

Conclusion

Regardless of whether you choose Yarn or NPM, integrating React Testing Library into your project is straightforward. Once installed, you can start writing tests for your React components using the intuitive and developer-friendly API provided by React Testing Library. Happy testing!