动态导入的React组件的单元测试

Question

我有一个非常简单的React组件，用于react-loadable动态导入另一个组件。该代码看起来类似于以下内容：

import React from 'react';
import Loadable from 'react-loadable';
import LoaderComponent from 'path/to/LoaderComponent';


export default outerLoadableComponent = Loadable({
  loader: () => import('path/to/innerComponent'),
  loading() {
    return <LoaderComponent />
  }
});

我正在尝试通过使用Enzyme to来测试此组件，该组件在我可以看到包装的位置将其设置为true的地方mount outerLoadableComponent创建了包装。但是，我陷入内部无法解决的问题。这似乎是一个承诺，只有在实际完成导入后才能解决，但是即使有一些超时，它也无法正常工作：outerLoadableComponentLoaderComponentloadingStateimport

const expect = chai.expect;
chai.use(sinonChai);

it('should render the loading state, and innerComponent', (done) => {
  const wrapper = mount(
    <outerLoadableComponent />
  );

  expect(wrapper.loading).to.be.true;

  setTimeout(() => {
    expect(wrapper.loading).to.be.false;
    expect(wrapper.loaded).to.exist; // loaded state returns a function
    expect(wrapper.find(innerComponent)).to.exist;
    done();
  }, 500);
});

我babel-rc已经dynamic-import-node在测试之外运行此程序，一切正常。但是，似乎没有明确/有记载的方法（用sinon来模拟）import诺言的结果。有任何想法吗？