React component testing with Jest and React Testing Library

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • WorkOS - The modern identity platform for B2B SaaS
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • jest-cheat-sheet

    Jest cheat sheet

  • Jest cheat sheet

  • jest-dom

    :owl: Custom jest matchers to test the state of the DOM

  • Jest-Dom is not required but makes writing tests much easier because it extends Jest matchers (methods that let you test values in different ways e.g. toBe(), toHaveBeenCalled()) and allows you to write clearer tests.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • semantic-ui-react

    The official Semantic-UI-React integration

  • Above we are destructuring props and state. We are also returning a Semantic UI React Search module. In essence, the above will render an input field. When changed, it will call onSearchChange and Semantic UI React will automatically pass two arguments, event and data (all props, including current value). One of onSearchChange’s jobs is to call an API and return results that match the current value.

  • jest

    Delightful JavaScript Testing.

  • Why Jest and RTL (React Testing Library)?

  • Enzyme

    JavaScript Testing utilities for React

  • Another popular tool is Enzyme, but many believe that it can lead to bad testing practices. The main concern is that Enzyme offers extra utilities that allow you to test the internal workings of a component (e.g. read and set state of the component). The team at React tests React; therefore, there is no need for you to test React’s functionality such as state, componentDidMount, etc. The same goes for other libraries you may use.

  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

    WorkOS logo
NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts