React Testing Library Cheat Sheet

React Testing Library is a popular testing framework for React applications. It is designed to make testing React components more accessible and intuitive. The library provides a set of utilities that allow developers to test their components in a way that closely resembles how users interact with them.

One of the key features of React Testing Library is its focus on testing the behavior of components rather than their implementation details. This means that tests are written in a way that simulates user interactions with the component, rather than testing the internal state or structure of the component.

This cheat sheet provides an extensive list of React Testing Library methods and their descriptions. The methods are divided into different categories for easy reference.

Queries

Method	Description
getByLabelText	Returns the first element that matches the given labelText attribute.
getByPlaceholderText	Returns the first element that matches the given placeholder attribute.
getByText	Returns the first element that matches the given text content.
getByAltText	Returns the first element that matches the given alt attribute.
getByTitle	Returns the first element that matches the given title attribute.
getByRole	Returns the first element that matches the given role attribute.
getByTestId	Returns the first element that matches the given data-testid attribute.
queryByLabelText	Returns the first element that matches the given labelText attribute, or null if no elements match.
queryByPlaceholderText	Returns the first element that matches the given placeholder attribute, or null if no elements match.
queryByText	Returns the first element that matches the given text content, or null if no elements match.
queryByAltText	Returns the first element that matches the given alt attribute, or null if no elements match.
queryByTitle	Returns the first element that matches the given title attribute, or null if no elements match.
queryByRole	Returns the first element that matches the given role attribute, or null if no elements match.
queryByTestId	Returns the first element that matches the given data-testid attribute, or null if no elements match.
getAllByLabelText	Returns an array of all elements that match the given labelText attribute.
getAllByPlaceholderText	Returns an array of all elements that match the given placeholder attribute.
getAllByText	Returns an array of all elements that match the given text content.
getAllByAltText	Returns an array of all elements that match the given alt attribute.
getAllByTitle	Returns an array of all elements that match the given title attribute.
getAllByRole	Returns an array of all elements that match the given role attribute.
getAllByTestId	Returns an array of all elements that match the given data-testid attribute.

Matchers

Method	Description
toBeDisabled	Matches if the element is disabled.
toBeEnabled	Matches if the element is enabled.
toBeEmpty	Matches if the element has no children.
toBeInTheDocument	Matches if the element is present in the document.
toBeInvalid	Matches if the element is invalid.
toBeRequired	Matches if the element is required.
toBeValid	Matches if the element is valid.
toBeVisible	Matches if the element is visible.
toContainElement	Matches if the element contains another element.
toContainHTML	Matches if the element contains the given HTML string.
toHaveAttribute	Matches if the element has the given attribute.
toHaveClass	Matches if the element has the given class.
toHaveFocus	Matches if the element has focus.
toHaveFormValues	Matches if the element has the given form values.
toHaveStyle	Matches if the element has the given style.
toHaveTextContent	Matches if the element has the given text content.
toHaveValue	Matches if the element has the given value.

Events

Method	Description
fireEvent	Fires the given event on the element.
click	Fires a click event on the element.
dblClick	Fires a dblclick event on the element.
change	Fires a change event on the element.
submit	Fires a submit event on the element.
focus	Fires a focus event on the element.
blur	Fires a blur event on the element.
keydown	Fires a keydown event on the element.
keyup	Fires a keyup event on the element.
keypress	Fires a keypress event on the element.
mouseDown	Fires a mousedown event on the element.
mouseUp	Fires a mouseup event on the element.
mouseEnter	Fires a mouseenter event on the element.
mouseLeave	Fires a mouseleave event on the element.
touchStart	Fires a touchstart event on the element.
touchEnd	Fires a touchend event on the element.
touchMove	Fires a touchmove event on the element.

Async Utilities

Method	Description
waitFor	Waits for the given callback function to return a truthy value.
waitForElementToBeRemoved	Waits for the element to be removed from the document.
waitForDomChange	Waits for the DOM to change.
waitForElement	Waits for the element to be present in the document.
waitForElementToBeVisible	Waits for the element to be visible in the document.
waitForElementToBeHidden	Waits for the element to be hidden in the document.

Mocking

Method	Description
jest.fn()	Creates a new mock function.
jest.spyOn()	Creates a spy on the given object and method.
jest.mock()	Mocks the given module.
jest.resetAllMocks()	Resets all mock functions.
jest.clearAllMocks()	Clears all mock function calls.

References

For more information on React Testing Library, please refer to the official documentation: https://testing-library.com/docs/react-testing-library/intro/