Question

我有一个RootStore文件，该文件实例化了我所有的mobx商店：

class RootStore {
    @observable stores = {};

    constructor() {
        this.stores.uiStateStore = new UiStateStore(this);
        ...
    }
}

export default new RootStore();

我还有一个基本的React组件，可以导入RootStore：

import React from 'react';
import RootStore from '../../Stores/RootStore';
import { Button } from '../Button';

const CloseButton = props => {
    const handleClose = ev => RootStore.stores.uiStateStore.closeModal();
    return <Button icon="Close" onClick={handleClose} {...props} />;
};

export default CloseButton;

我对mobx相当陌生，也没有测试经验。我正在尝试使用Jest和Enzyme编写一些基本测试来验证组件的渲染是否正常：

it('should render correctly with no props', () => {
    const component = shallow(<CloseButton/>);
    expect(component).toMatchSnapshot();
});

我的问题是，因为该组件导入了RootStore，所以它将实例化所有其他存储，这显然效率不高。

测试此组件的最佳方法是什么？

如何测试导入主要mobx存储的简单React组件？

0 个答案: