3

我对 MobX 注入装饰器的理解是，使用 Enzyme，我应该能够在我的单元测试中简单地初始化一个存储，然后作为道具传递给我正在安装的组件。[src: https://semaphoreci.com/community/tutorials/how-to-test-react-and-mobx-with-jest并滚动到集成测试部分。] 但是我不断收到商店不可用！错误。这往往是一个问题，特别是如果我要注入多个商店。

所以在我的组件中：

export default inject('errorStore', 'someOtherStore', 'andTheThirdStore')(observer(MyComponent));

我的测试应该是这样的。

import errorStore from './stores/errorStore';
import someOtherStore from './stores/someOtherStore';
import andTheThirdStore from './stores/andTheThirdStore';
import Component from './components/Component';

describe('My Component', () => {
  someOtherStore.initializeWithData('./examples','TEST-123-45678-90', 'USERID');
  andTheThirdStore.initialize();
  const storeProp = { errorStore, someOtherStore, andTheThirdStore };

  beforeEach(() => {
      const wrapper = mount(<Component {...storeProp} />
  }

  it ('does all the things', () => {...});

我在这里需要其他类型的提供者还是我只是错过了一些明显的东西？

4

2 回答 2

2

据我所知，您的设置是正确的。你有可重复的设置吗？请注意，您也可以直接使用安装原始组件，wrappedComponent另请参见本期中的示例

于 2016-12-05T18:38:06.830 回答
0

在你的MyComponent：

export default inject('errorStore', 'someOtherStore', 'andTheThirdStore')(observer(MyComponent));

在下面添加另一行export default：

export const  undecorated = MyComponent

在您的测试用例中import {undecorated as MyComponent} from './MyComponent'

并且关于您的商店，您在进行纯单元测试时不需要初始化创建示例商店对象。

在上面的例子中：

create const errorStore={}.

如果您进行单元测试，还可以shallow使用另外一件事。mount

于 2017-03-09T20:10:31.667 回答