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);