Checking text appears inside an element using react testing library
Another way to do this
import {render, screen} from '@testing-library/react';
...
render(<MyComponent />);
expect(screen.getByTestId('my-test-id')).toHaveTextContent('some text');
Note it is now recommended to use screen
instead of the results of render.
(StackOverflow post the points to a KC Dobbs Article explaining why: react-testing-library - Screen vs Render queries)
Better to use within
for this sort of things:
render(<MyComponent />)
const { getByText } = within(screen.getByTestId('my-test-id'))
expect(getByText('some text')).toBeInTheDocument()