React Redux 应用程序中集成测试的最佳实践？答案

【问题标题】：Best practice for integration testing in React Redux app?React Redux 应用程序中集成测试的最佳实践？
【发布时间】：2021-10-26 14:12:06
【问题描述】：

我正在尝试为 React-Redux 应用程序设置测试。包括 Redux Docs 和 the main contributor to react-testing-library 在内的大多数资源都主张将重点放在集成测试上，并且应尽可能将 Redux 代码视为实现细节。这很酷，但我在实践中很难做到这一点。

我在集成测试中发现的大多数示例都设置了一个组件，您可以在其中观察直接单元中的效果。但是在我的应用程序中的几个地方，我有向我的商店发送调度的组件，这会导致应用程序的另一部分重新渲染。为了说明我的问题，我在下面创建了一个简化的组件树，我想单击AddToListButton 以将Element1 添加到List。

如果 Redux 是一个实现细节，我如何实际测试单击按钮会导致更新而不渲染（或多或少）整个应用程序？我了解如何进行单元测试和端到端测试，但不确定如何实施集成测试。

<App>
  <Search>
    <SearchResult>
      <Element1>
        <AddToListButton /> //I WANT TO TEST THIS BUTTON
      </Element1>
      <Element2>
        <AddToListButton />
      </Element2> 
    </SearchResult>
  </Search>
  <List>
    <Element1 /> // WHEN THE BUTTON IS PRESSED THE ELEMENT SHOULD GO HERE
  </List>
</App>

【问题讨论】：

标签： reactjs redux react-testing-library

【解决方案1】：

您实际上会（或多或少地）渲染整个应用程序——或者至少是所有涉及的组件。这几乎就是集成测试的重点。

与端到端测试的唯一区别是不涉及其他服务，并且您可以也只集成测试应用的某些部分，但这并不意味着您必须只对应用程序的某些部分进行集成测试。

【讨论】：