React IonDateTime does not render in Jest test

Viewed 93

When running Jest on an Ionic React component, the following test fails, regardless of whether or not the component receives a time value.

test('IonDateTime appears', () => {
  render(<IonDatetime data-testid="foo" mode="ios" />);
  const dateTimeComponent = screen.getByTestId('foo');

  expect(dateTimeComponent).toBeInTheDocument();
});

This is the output from Jest, where the body comes back with an empty div.

    TestingLibraryElementError: Unable to find an element by: [data-testid="foo"]
    <body>
      <div />
    </body>

I have mockIonicReact(); in my setupTests.ts file, which should allow for different Ionic components to get rendered in JSDOM.

1 Answers

Inside mockIonicReact.js, Jest can't use the mockController unless the variable to which it is assigned also begins with the word "mock" Previously answered at:

As of 16 Jun 2021, still a bug in Ionic React (view here)

Related