No handler function found for event: "scroll"

Describe the bug

I was writing tests to see if I could invoke the refreshControl component on my <ScrollView />. When invoking fireEvent.scroll(getByText("foobar"), eventData);, I get the error No handler function found for event: "scroll".

I haven’t defined an onScroll on my <ScrollView /> component. I shouldn’t need to, it’s an optional parameter for the component.

It’s interesting to see in the docs that a “scroll handler” is mocked.

Expected behavior

I can use a query to select a component on my screen, which exists inside of a <ScrollView /> component and call fireEvent.scroll(queriedComponent, eventData).

Steps to Reproduce

// Foobar.tsx - skipped set up code for brevity
const _onRefresh = async () => {
  setRefreshing(true);
  await someAsyncFunction();
  setRefreshing(false);
};

return (
  <ScrollView
       accessible={false}
       refreshControl={
         <RefreshControl refreshing={refreshing} onRefresh={_onRefresh} />
       }
  >
    <View>
       <Text}>"Foobar"</Text>
    </View>
  </ScrollView>
);

// Foobar.test.tsx
it("test foobar scroll", async () => {
  const { getByText } = await waitFor(() => render(<Foorbar />);

  // Scroll Up
  const eventData = {
    nativeEvent: {
      contextOffset: {
        y: -200,
      },
    },
  };
  const someText = getByText("Foobar");
  fireEvent.scroll(someText, eventData); // breaks here
});

then run

yarn test <path-to-test-folder>/Foobar.test.tsx

Screenshots

N/A

Versions

  npmPackages:
    @testing-library/react-native: ^7.0.2 => 7.1.0 
    react: 16.13.1 => 16.13.1 
    react-native: ^0.63.2 => 0.63.3 
    react-test-renderer: 16.13.1 => 16.13.1 

[thymikee]

The implementation of fireEvent is simply quite naive and doesn’t reflect the complexity of React Native’s event system. PRs welcome to improve it 😃

[thymikee]

fireEvent.scroll expects that there’s a onScroll prop attached to the ScrollView (or other components). That’s why it complains about no handler being found.