React 测试，我是否在浪费时间尝试不使用 Redux？

Question

我真的，真的迷路了。

我正在努力使我的 React 应用程序保持简单。基于应用程序的范围，我认为我们不需要 Redux。然而，当涉及到测试时，似乎我必须克服很多困难才能获得良好的覆盖率。这看起来太荒谬了，我一定是想错了。请帮忙？

例如，

class LoginForm extends Component {...}

onHandleClick(e) {
  if (this.state.username === '' && this.state.password === '') {
    this.setState({ error: 'Invalid details', });
  } else {
    this.setState({ error: '', });
  }
}

我想编写一个测试，确保在凭据为空时 state.error 设置为 'Invalid details'。我应该能够安装组件并访问它的 instance().onHandleClick() - 我想？

除此之外，它不会让我直接安装它，因为我需要将它包装在 MemoryRouter 中，因为 LoginForm 会根据正确的凭据进行重定向。

当然可以

mount(<MemoryRouter><LoginForm /></MemoryRouter>);

...但是我无法再访问包装器的 instance().onHandleClick()，因为 MemoryRouter 没有该方法，它在子对象中。

如果我的 none 组件知道它们的方法做了什么，那么测试似乎会容易 100 倍，它全部通过 props 传递，并且我的测试模拟了每个函数......但是然后，畏缩，如果我使用模拟方法来测试我的所有组件，我怎么知道 ACTUAL 方法有效？

你走得太远了，Redux 似乎是唯一的选择......但我有一个非常非常简单的 CRUD 应用程序，我不想让它过于复杂，我只是想能够测试我的组件！

请帮忙。

Answer 1

恕我直言，你应该使用 Sinon http://sinonjs.org/ 要测试那种东西，这里有一篇关于它的文章。 http://engineering.pivotal.io/post/stub-dont-shallow-render-your-child-components/

但基本上解决方案应该在 sinon 的 stub() 和 spy() 之间。

如果您想测试让 dipper 进行测试，请查看 JEST 它是基于快照的出色测试工具，因此您只需将呈现的代码与假设的代码进行比较。脸书也推荐

https://facebook.github.io/jest/

React 测试，我是否在浪费时间尝试不使用 Redux？

React Testing, am I wasting my time trying to NOT use Redux?

testing

mount

reactjs

redux