How to fix Warning: ReactTestUtils is deprecated, use testing-library instead in React

ReactINTERMEDIATEMEDIUM

React's legacy testing utilities have been deprecated in favor of modern testing libraries. This warning appears when using ReactTestUtils or react-dom/test-utils APIs that are scheduled for removal in React 19.

What this error means

This deprecation warning indicates you're using React's legacy testing utilities (ReactTestUtils or react-dom/test-utils) which have been superseded by more modern testing approaches. React's team officially recommends migrating to React Testing Library for a better-supported and more user-centric testing experience. The deprecation affects multiple APIs: ReactDOMTestUtils.act() has been deprecated in favor of importing act from 'react' directly, renderIntoDocument will be removed in React 19, and most other test utilities have already been removed except for act. React Testing Library provides a more robust testing philosophy that encourages testing components the way users actually interact with them, rather than testing implementation details. This approach leads to more maintainable tests that are less likely to break when refactoring.

How to fix "Warning: ReactTestUtils is deprecated, use testing-library instead"

1Install React Testing Library

If you haven't already, add React Testing Library to your project:

bash

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

Or with Yarn:

bash

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

For React 18+, ensure you have version 13.0.0 or higher of React Testing Library.

2Replace renderIntoDocument with render

Migrate from ReactTestUtils.renderIntoDocument to React Testing Library's render:

Before:

jsx

import ReactTestUtils from 'react-dom/test-utils';

const component = ReactTestUtils.renderIntoDocument(
  <MyComponent />
);

After:

jsx

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

const { container, getByRole } = render(<MyComponent />);

React Testing Library's render returns helpful query functions and automatically handles cleanup.

3Replace Simulate with fireEvent or userEvent

Replace ReactTestUtils.Simulate with Testing Library's fireEvent or userEvent:

Before:

jsx

import ReactTestUtils from 'react-dom/test-utils';

ReactTestUtils.Simulate.click(button);
ReactTestUtils.Simulate.change(input, { target: { value: 'test' } });

After (with fireEvent):

jsx

import { render, fireEvent } from '@testing-library/react';

const { getByRole } = render(<MyComponent />);
fireEvent.click(getByRole('button'));
fireEvent.change(getByRole('textbox'), { target: { value: 'test' } });

Better (with userEvent):

jsx

import { render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';

const { getByRole } = render(<MyComponent />);
const user = userEvent.setup();
await user.click(getByRole('button'));
await user.type(getByRole('textbox'), 'test');

userEvent simulates real browser interactions more accurately.

4Update act imports to use React.act

If you're using act directly, import it from 'react' instead of 'react-dom/test-utils':

Before:

jsx

import { act } from 'react-dom/test-utils';

await act(async () => {
  // test code
});

After:

jsx

import { act } from 'react';

await act(async () => {
  // test code
});

Note: When using React Testing Library's render and fireEvent, you typically don't need to use act explicitly - it's handled automatically.

5Replace scryRenderedDOMComponentsWithClass and similar finders

Replace ReactTestUtils finder methods with Testing Library queries:

Before:

jsx

import ReactTestUtils from 'react-dom/test-utils';

const buttons = ReactTestUtils.scryRenderedDOMComponentsWithTag(
  component,
  'button'
);
const element = ReactTestUtils.findRenderedDOMComponentWithClass(
  component,
  'my-class'
);

After:

jsx

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

const { getAllByRole, getByText } = render(<MyComponent />);
const buttons = getAllByRole('button');
const element = getByText('My Text'); // or getByTestId('my-test-id')

Testing Library encourages querying by role, label, or text rather than implementation details like CSS classes.

6Update test assertions to work with Testing Library

Adopt Testing Library's assertion patterns and matchers:

Before:

jsx

expect(element.textContent).toBe('Hello');
expect(element.className).toContain('active');

After:

jsx

import '@testing-library/jest-dom';

expect(element).toHaveTextContent('Hello');
expect(element).toHaveClass('active');

jest-dom provides semantic matchers that make tests more readable and provide better error messages. Common matchers include: toBeInTheDocument, toBeVisible, toBeDisabled, toHaveAttribute.

7Run and verify your test suite

After migrating, run your tests to ensure everything works:

bash

npm test

Check that:
- All deprecation warnings are gone
- Tests pass with the same coverage
- Console is clear of React warnings

If you see any remaining warnings, search your codebase for remaining ReactTestUtils imports:

bash

grep -r "react-dom/test-utils" src/
grep -r "ReactTestUtils" src/

How to fix Warning: ReactTestUtils is deprecated, use testing-library instead in React

What this error means

Typical symptoms

Common causes

How to fix "Warning: ReactTestUtils is deprecated, use testing-library instead"

Advanced notes

Related errors

Official resources & further reading