Тестирование нажатия кнопки в React Native с помощью Jest и энзима - PullRequest
Новая
       21

Тестирование нажатия кнопки в React Native с помощью Jest и энзима

0 голосов
/ 14 апреля 2020

Я новичок в тестировании реагирующих нативных приложений с Jest и не знаю, что я делаю. Я провел некоторые исследования в Интернете, но большинство курсов, похоже, устарели.

В моем приложении есть изображение, которое при нажатии переносит пользователя на другой экран. После некоторого исследования кажется, что использование энзима - способ сделать это (это, вероятно, устарело, и я делаю это неправильно).

Вот мой код. 

import 'react-native';
import React from 'react';
import HomeScreen, { TouchableOpacity } from '../app/HomeScreen';
import { render, fireEvent } from 'react-native-testing-library';
import { configure, shallow, mount } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() })

it("can press the button", () => {
  
const onPressMock = jest.fn();

const button = shallow((<TouchableOpacity onPress={onPressMock} />));
button.find('button').simulate('click');
expect(onPressMock).toHaveBeenCalled();
expect(onPressMock.mock.calls.length).toEqual(1);
});

Когда я запускаю тест с пряжей, я получаю следующую ошибку, есть ли способ исправить это?

error

Вот код моего домашнего экрана 

export default class HomeScreen extends React.Component 
{
 render() {
   
  return (
  <ScrollView>
     <View style={{flex:1}}>
     <TouchableOpacity onPress={() => this.props.navigation.navigate('Listen')}>
     <ImageBackground source={require('./bible.png')} style={{width: '100%', opacity: 0.8}}>
              <Text style={styles.MainText}>Sermons</Text>
              </ImageBackground>
         </TouchableOpacity>
         <TouchableOpacity onPress={() => this.props.navigation.navigate('Events')}>
      <ImageBackground source={require('./events.png')} style={{width: '100%', opacity: 0.8}}>
              <Text style={styles.MainText}>Events</Text>
         </ImageBackground>
         </TouchableOpacity>
         <TouchableOpacity onPress={() => this.props.navigation.navigate('Connect')}>
         <ImageBackground source={require('./connect.png')} style={{width: '100%', opacity: 0.8}}>
              <Text style={styles.MainText}>Connect</Text>
         </ImageBackground>
         </TouchableOpacity>
         <TouchableOpacity onPress={() => this.props.navigation.navigate('About')}>
      <ImageBackground source={require('./church.png')} style={{width: '100%', opacity: 0.8}}>
              <Text style={styles.MainText}>About</Text>
         </ImageBackground>
         </TouchableOpacity>
     </View>

    </ScrollView>
  )
 }
}
...