response-native-vector-icons + mocha: Инвариантное нарушение

Question

Это мой компонент.Он работает без проблем на эмуляторе / телефоне:

// mycomponent.js
import React, {Component} from 'react';
import {View} from 'react-native';
import Icon from 'react-native-vector-icons/FontAwesome';

export class MyComponent extends Component {
    // ...
    render () {
        return (
            <View>
               <Icon
                   name="check"
                   size={25}
                   color={'#62B300'}
               />
            </View>
        )
    }
}

Но когда я запускаю модульный тест в этом файле (mocha --recursive test / ** / *. Js):

// mycomponent.spec.js
import chai from 'chai';
import TestRenderer from 'react-test-renderer';
import mock from 'mock-require';
import 'react-native-mock-render/mock';
import {MyComponent} from '../app/components/MyComponent';

mock('react-native-vector-icons/FontAwesome', {});


describe('MyComponent', () => {
    it('should render', () => {
       const mycomponent = TestRenderer.create(<MyComponent>);

       return expect(mycomponent.root).to.exist;
    }
}

Выдает:

Нарушение инварианта: недопустимый тип элемента: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но есть: объект.Вероятно, вы забыли экспортировать компонент из файла, в котором он определен, или вы перепутали значения по умолчанию и именованный импорт.

Проверьте метод рендеринга MyComponent.

Это работает, если я использую <View> вместо <Icon>, но это должно быть посмешищем.Как я могу это исправить?

Answer 1

Решил это.Чтобы заставить это работать, макет должен возвращать функцию, возвращающую null вместо объекта.

mock('react-native-vector-icons/FontAwesome', () => null);