@testing-library/react-native sequential fireEvent not working as expected

22 views Asked by At

I've been trying to make this testcase work by asserting if the next screen is getting called with correct country id and the fireevent doesn't seem to be working as expected. this line:

fireEvent.press(await rendered.findByTestId('country-ID'));

should fetch the TouchableOpacity element with testID: 'country-ID' and then this line:

fireEvent.press(await rendered.findByText(i18n.t('btn_continue')));

should be called to call the navigate method that will be asserted like this:

expect(navigateMock).toHaveBeenCalledWith('SystemDowntimeScreen', {
  selectedCountry: 'ID'
});

When console.logged seems to be still sending TH in selectedCountry prop.

Here is the failing testcase:

it('Should navigate to SystemDowntimeScreen', async () => {
    const navigateMock = jest.fn().mockReturnValue(true);
    jest
      .spyOn(UINavigator, 'navigate')
      .mockImplementation(() => navigateMock());
    await act(async () => {
      fireEvent.press(await rendered.findByTestId('country-ID'));
      fireEvent.press(await rendered.findByText(i18n.t('btn_continue')));
    });
    expect(navigateMock).toBeCalledWith('SystemDowntimeScreen', {
      selectedCountry: 'ID',
    });
  });

I tried these:

  • using await waitFor() individually for both fireEvents but no luck
  • putting complete test in await waitFor()
  • using getByText() and getByTestId() for fetching both the elements

Any help is much appreciated. Thanks

0

There are 0 answers