testing-library/react-testing-library

Can not find createPortal from React DOM

Myllaume opened this issue · 1 comments

  • @testing-library/react version: 16.0.1
  • @testing-library/dom version: 10.4.0
  • Testing Framework and version: Jest v.29.4.3, with TypeScript
  • DOM Environment: Jest DOM: "jest-environment-jsdom": "^29.4.3",
  • Node version : v20.8.1
  • React version: 18.3.1

Relevant code or config:

Tested component:

import { createPortal } from 'react-dom';

const Header = () => {
  return createPortal(<div />, document.getElementById("header"));
};

Test:

beforeAll(() => {
  const portalEl = document.createElement('div');
  portalEl.id = 'header';
  document.body.appendChild(portalEl);
});

it('should render primary content', () => {
  const { queryByTestId } = render(
    <Header primaryContainer={<div data-testid="primary" />} />,
  );
  expect(queryByTestId('primary')).not.toBeNull();
});

What you did:

I execute tests and get error.

What happened:

    TS2305: Module '"react-dom"' has no exported member 'createPortal'.

    3 import { createPortal } from 'react-dom';
               ~~~~~~~~~~~~

Hi @Myllaume, it looks like this one is working in our stackblitz:
https://stackblitz.com/edit/rtl-template-wwkcar?file=src%2FApp.test.tsx

If this still doesn't work for you, please comment here with a reproduction link using our stackblitz: https://testing-library.com/new-rtl