React Native 测试库 fireEvent.press 不触发 onPress

Question

I'm trying to get an integration test working in React Native (using Jest and RN Testing Library) and all my other tests work as expected but this one it seems the fireEvent.press() stops actually firing off the onPress event from the button TouchableHighlight for a specific component

Workflow:

1. List of people
2. press nav item to pull up filters (narrow down list)
3. inside modal 2 options of filter types, select "people" filters
4. renders new list of filters and select one of these
5. updates list of people and closes modal
6. user presses "You know it" button
7. console.log() or setPerson in onButtonPress never fires

View with button

export default function PondLeadSnippet({person, setPerson}) {
  const onButtonPress = useCallback(() => {
    console.log("========> onButtonPress");
    setPerson({...person, flagged: true});
  }, [false]);

  return (
    <View style={Style.container}>
      <View style={Style.content}>
        <Label accessibilityRole='person-name' scale='medium'>{person.name}</Label>
        <Text style={Style.detail}>{detail}</Text>
        <Text>{person.flagged ? 'Flagged' : 'Not Flagged'}</Text>
      </View>

      <TouchableHighlight testID={`flag-person-${person.uuid}`} onPress={onButtonPress}}>
        <Text>You know it</Text>
      </TouchableHighlight>
    </View>
  );
}

My Test

    test.only('can flag a person from list', async () => {
      const { getByText, getAllByRole, findByTestId, getByTestId, store } = setup();
      const bobSaget = people[1];

      // Modal to view filters -> this works!
      const filter = await findByTestId('people-filters');
      await fireEvent.press(filter);

      // toggle between 2 lists of filters -> this works!
      await waitFor(() => expect(getByTestId("people-list")).toBeTruthy());
      fireEvent.press(getByTestId("people-list"));

      // select filter -> this works!
      const peopleFilter = await findByTestId(`list-item-${someID}`);
      fireEvent.press(peopleFilter);

      // wait for list of people to update and modal closed
      await waitFor(() => expect(getAllByRole('person-name')).toHaveLength(2));
      const [ first, second ] = getAllByRole('person-name');
      expect(first.children).toContain("Bob S.")

      // press "Flag Person" button on person -> Does not work
      expect(getByTestId(`flag-person-${bobSaget.uuid}`)).toBeTruthy();
      fireEvent.press(getByTestId(`flag-person-${bobSaget.uuid}`));

      // after event rerender should happen w/ new text element w/ "Flagged"
      await waitFor(() => expect(getByText("Flagged")).toBeTruthy());
    });

Answer 1

Your TouchableHighlight might have not been rendered when you try fire event. Try to replace

 expect(getByTestId(`flag-person-${bobSaget.uuid}`)).toBeTruthy();

with

 await waitFor(() => {
     expect(getByTestId(`flag-person-${bobSaget.uuid}`)).toBeTruthy();
   })