Javascript 如何使用带有React和Redux的嵌套容器测试组件？

由于我正在处理的应用程序的复杂性，我决定使用嵌套的redux容器，而不是将操作作为支撑传递给子组件。然而，当将

外部容器

与

摩卡

、

柴

和

西农

组合呈现时，这对于单元测试来说是有问题的

以下是视图结构的人为示例：

<OuterContainer>
  <div>
    <InnerContainer />
  </div>
</OuterContainer>

其中，

OuterContainer

和

InnerContainer

用connect包装。e、 g:

export connect（）（）

运行测试时，我得到的错误是：

不变冲突：在“连接（组件）”的上下文或道具中找不到“存储”。将根组件包装在``中，或者显式地将“store”作为prop传递给“Connect（component）”。

---

是否有一种方法可以在不使用浅层渲染的情况下展开或存根

内部容器进行单元测试？
在测试时将组件包装在
中。这取决于您是提供一个真正的存储还是一个带有
{dispatch，getState，subscribe}
的模拟。将最外层的组件包装在
中也将使子组件在任何嵌套级别都可以使用存储，就像在应用程序本身中一样

const store = createStore(reducer) // can also be a mock
ReactTestUtils.renderIntoDocument(
  <Provider store={store}>
    <OuterContainer />
  </Provider>
)

const store=createStore（reducer）//也可以是模拟
ReactTestUtils.renderIntoDocument(
)
另一种方法是导出要连接的组件和容器。当然，容器是默认的

export const Comp = (props) => (<p>Whatever</p>)
export default connect(...)(Comp)

export const Comp=（道具）=>（无论什么
）
导出默认连接（…）（组件）

因此，您可以进行单元测试
Comp
不确定这是否是您的问题所在，但我相信这可能会帮助一些人查看此提要

我有同样的错误，这是一个简单的修复：

我忘记在我的输入文件中传递我的组件我的存储对象（使用webpack）

我刚刚向根组件“store={store}”添加了一个属性，如下所示：

    document.addEventListener("DOMContentLoaded", () => {
      const store = configureStore();
       ReactDOM.render(<Root store={store} />, 
     document.getElementById('content'));
    });

document.addEventListener（“DOMContentLoaded”，（）=>{
const store=configureStore（）；
ReactDOM.render（，
document.getElementById（'content'）；
});

这也是我的根文件代码，仅供参考：

    import React from 'react';
    import { Provider } from 'react-redux';
    import App from './app';

    const Root = ({ store }) => (
     <Provider store={ store }>
        <App />
     </Provider>
    );

从“React”导入React；
从'react redux'导入{Provider}；
从“./App”导入应用程序；
常量根=（{store}）=>(
);

导出默认根目录

希望这对别人有帮助
 模拟
提供程序
组件以返回子组件

将此添加到
descripe（）
之前

jest.mock（'Provider'，（）=>（{children}=>children）
太棒了！谢谢你的建议。现在试一试：）很有魅力。再次感谢@DanAbramov@丹·阿布拉莫夫：这很有效。然而，它不再是真正的单元测试了。酶有
浅的
，但它仍然通过一个连接的子成分深入。你知道有没有可能在不渲染的情况下测试
是否存在。我自己也喜欢这个解决方案，但它使测试变得比应该的更复杂。但这违背了测试具有完整Redux链接的组件的目的。不是吗？@shobhit1但是你正在测试你的组件和
connect
，它已经被
react-redux
测试过了。不坏也不好。你只是测试过度了。如果像问题中那样，
Comp
本身导入并使用另一个容器，那么这将不起作用。然后，分包商将期望
存储
，测试将失败。