Accessing queries with the screen object - Finding elements with React Testing Library queries

Finding elements with React Testing Library queries

Become familiar with all the ways to find elements in your rendered components with React Testing Library. This is a more in depth look at all the getBy, findBy and queryBy functions

React Testing Library queries intro

Intro to React Testing Library queries

Not started

GetBy, QueryBy, FindBy

Not started

Single vs Multiple queries

Not started

Picking a query function by priority

Not started

Accessing queries with the screen object

Current

Common query options (except TextMatch)

Not started

TextMatch in detail

Not started

Getting direct access to the DOM

Not started

React Testing Library queries

ByRole (common uses)

Not started

ByRole (less common uses)

Accessing queries with the screen object

In React Testing Library (RTL), the most useful object is the screen object.

The rest of this course covers the queries like getByText(). The typical way to get those query functions is via screen.getByText().

import { screen } from '@testing-library/react';

This is also covered in our main React testing course. If you've taken that already, you can skip this lesson.

We'll soon move into the more advanced query APIs.

In this lesson we'll do a quick recap of screen, and the different ways to access it.

Loading full lesson content & code...

Ready to try running tests for this lesson?