Testing a react-native component with jest

Question

I'm working on a react-native project and I want to do some testing on it using the testing-library for react-native and jest. The issue is that I cannot render components that contain the Pressable component from react-native. Here is the component that im trying to render:

import React from 'react'
import { View, Text, Pressable } from 'react-native'
export default function FilteringOptions() {

    return (
        <View style={{ flexDirection: 'row' }}>
            <Pressable>
                <Text style={{ fontSize: 24, paddingLeft: 10 }}>{'\u29BF'} All </Text>
            </Pressable>
            <Pressable>
                <Text style={{ fontSize: 24, paddingLeft: 10 }}>{'\u29BF'} Finance  </Text>
            </Pressable>
            <Pressable>
                <Text style={{ fontSize: 24, paddingLeft: 10 }}>{'\u29BF'} Health</Text>
            </Pressable>
        </View>
    );
}

Here is the test case in jest:

test('Testing if FilteringOptions renders', () => {
    render(<FilteringOptions />);
    expect(screen.toJSON()).toMatchSnapshot();
});

And here is the error im getting:


  console.error
    Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
    1. You might have mismatching versions of React and the renderer (such as React DOM)
    2. You might be breaking the Rules of Hooks
    3. You might have more than one copy of React in the same app
    See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

Besides this jest also tells me that this error occurs in the component and the test fails cause there is a:

TypeError: Cannot read properties of null (reading 'useRef')

The app works without any issues and components that do not contain the component render and pass the test without any issues.

I couldn't find any specific fix to this issue. The only thing I have tried is updating my repoes.

Testing a react-native component with jest

0 Answers0