Enzyme тесты(snapshot) не работают, если в тестируемом компоненте имеется аннотация @observer(mobx), как исправить?

Question

[Владимир Зыков]

Привет, всем! У меня есть проблема с написанием тестов для проекта. В проекте есть store mobx. Enzyme тесты(snapshot) не работают, если в тестируемом компоненте имеется аннотация @observer (mobx).

Получаю сообщение об ошибке:

Test suite failed to run TypeError: Cannot read property 'componentWillReact' of undefined

Test:

const props = {
  store: {...store},
};

describe('ViewModal component testing', () => {

  it('mount to dom', async () => {
    const component = shallow(
            <Provider {...props}>
                <ViewModal />
            </Provider>);
    expect(component).toMatchSnapshot();
  });
});

Компонент для тестирования:

@inject('store')
@observer
export default class ViewModal extends React.Component<IProps> {
   componentDidMount() {
     this.props.store.getItem();
   }

  render() {
    const {item} =  this.props.store;
    return (
        <Row>
            {item}
        </Row>
    );
  }
}

Если удалить @observer, тест будет успешным. Как успешно выполнить тест с @observer в компоненте?
В интернете ответ не нашел.

Answer 1

[Дмитрий]

Используя shallow, вы рендерите только observer и не заходите глубже.
Кейс описан в документации: https://github.com/mobxjs/mobx-react#testing-store...