“Warning: react-modal: App element is not defined. Please use `Modal.setAppElement(el)` or set `appElement={el}`”

Question

How to fix this warning in console of a React app using the react-modal package:

Warning: react-modal: App element is not defined. Please use Moda

Answer 1

If you get that warning on testing with the "react-testing-library" here is a solution: https://github.com/reactjs/react-modal/issues/576#issuecomment-524644035

using the react-testing-library (https://testing-library.com/) I get rid of that warning with:

import Modal from "react-modal";

const { container } = render();
Modal.setAppElement(container);

....  // to the testing, use Modal

or, if you want to test the modal component directly:

const { container, rerender } render();
Modal.setAppElement(container);
// now the appElement is set we can show the modal component
rerender();

....  // to the testing