Сбой Jest при использовании встроенных в react прокручиваемых файлов

#react-native #jestjs #react-navigation

#react-native #jestjs #реагирование-навигация

Вопрос:

При импорте, например, FlatList из react-navigation мои тесты завершаются неудачей, если я импортирую его из react-native, он работает. Мой компонент выглядит так:

 import React from 'react';
import { Text, View } from 'react-native';
import { FlatList } from 'react-navigation';

const renderItem = ({ item }) => (
  <View>
    <Text>{item}</Text>
  </View>
);

const MyList = () => (
  <FlatList data={['a', 'b', 'c']} renderItem={renderItem} />
);

export default MyList;
  

и мой тест выглядит так:

 import React from 'react';
import renderer from 'react-test-renderer';

import MyList from '../MyList';

describe('MyList component', () => {
  it('renders correctly', () => {
    const component = renderer.create(<MyList />);
    const tree = component.toJSON();
    expect(tree).toMatchSnapshot();
  });
});
  

Сообщение об ошибке, которое я получаю, выглядит следующим образом:
введите описание изображения здесь

Ответ №1:

Я решил это, издеваясь над прокручиваемыми объектами следующим образом:

 jest.mock('react-navigation', () => ({
  FlatList: 'FlatList',
}));
  

Если вы также используете SectionList и / или ScrollView, вы можете добавить их таким же образом:

 jest.mock('react-navigation', () => ({
  ScrollView: 'ScrollView',
  SectionList: 'SectionList',
}));