反应测试，我浪费时间试图不使用Redux？

我试图让我的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设为“无效信息”时的凭据是空白。我应该可以挂载组件并访问其实例（）。onHandleClick（） - 我想？

除了它不会让我直接装载它，因为我需要将它包装在MemoryRouter中，因为LoginForm根据凭证是否正确重定向。

当然，我可以

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

...但我不能访问包装的实例（）。onHandleClick（）了，因为MemoryRouter没有的方法，这是一个孩子之内。

如果我的所有组件都不知道他们的方法做了什么，那么测试看起来会更容易100倍，它全部通过道具，我的测试嘲弄了每个功能......但是，如果我使用模拟方法测试所有组件，我是否会知道ACTUAL方法有效？

你已经足够了，Redux似乎是唯一的选择......但我有一个非常非常简单的CRUD应用程序，我不想过度复杂化它，我只是想能够测试我的组件！

请帮忙。

来源

2017-09-19 Quarty

我想加入终极版到组合将是这个逻辑可以进入减速机，它可以更容易地测试的优点，但也付出了代价。如果你发现你的组件太耦合在一起，也许他们需要重新组织一下。也许你可以添加'ref'到内部组件并从那里访问它？ –

恕我直言，你应该使用Sinonhttp://sinonjs.org/ 来测试这种事情，这里是一篇关于它的文章。 http://engineering.pivotal.io/post/stub-dont-shallow-render-your-child-components/

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

如果你想测试得到北斗来测试检查JEST这是一个伟大的测试工具，基于snapshoots，所以你只需比较呈现的代码和假设的代码。它也是由Facebook推荐的。

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

来源

2017-09-19 15:24:40 MTo

感谢您的链接，它似乎指向了我正确的方向！我已经在使用Jest和Enzyme，对我的服务很满意，并且任何组件都是通过道具传递的......但正如我所说的，这是我把头撞在墙上的“组件方法”。 – Quarty

你检查过了吗？ '测试组件方法'问题： https://github.com/airbnb/enzyme/issues/208 – MTo

是的，我确实已经看到了。我的问题来自mount（MemoryRouter> Quarty

反应测试，我浪费时间试图不使用Redux？

回答

相关问题