Question

    A <- c(1, 2, 3, 4, 5, 6, 7, 8, 9, 10)
    B <- c(10, 9, 8, 7, 6, 5, 4, 3, 2, 1)
    C <- data.frame(A, B)

    ggplot(data = C) + geom_point(mapping = aes(x = A, y = B)) + 
labs(title = "Plot") + theme(plot.title = element_text(hjust = 0.5))

当我在React组件中进行测试时，如果一个组件是全状态的，我需要传递组件的状态以对其进行测试还是仅对道具进行测试？

Answer 1

这一切都取决于您的测试意图。如果您只想通过简单的方法来跟踪组件的外观以及一些简单的逻辑，则可以继续使用当前的浅化渲染方法并测试一些道具组合。

另一种方法是呈现整个应用程序，您可以像在真正的浏览器中一样进行测试，并且可以像最终用户那样做更多的事情。我通常更喜欢这种方式，但是需要花费更多时间。这个也将需要Jsm。您可以参考https://airbnb.io/enzyme/docs/guides/jsdom.html，他们对浅层，渲染和安装之间的所有差异都有很好的记录。

rest方法是挂载，挂载比render稍高，并且比render稍简单，可以在要测试componentdidmount时使用。

Answer 2

我假设是关于在测试期间将状态传递到组件的主要问题。

你能做到吗？是的，但是方式不同。就像您在 plain React中所做的那样，您无法构造通过状态的组件（shallow(<...>)做到这一点）。这里只有道具在起作用。但是有一种方法.setState()，因此您可以在以下位置构造元素和下一行通过状态：

const wrapper = shallow(<ScreensLogin {...props}/>)
wrapper.setState(state);

您需要吗？我相信你不会。我确定您需要与在浏览器中与被测组件完全相同的通信方式：

传递不同的道具
显式地隐式调用道具回调（wrapper.simulate('click', {/*event mock here*/})与wrapper.props().onClick({/*event mocked*/})相同）
检查render()结果

为什么要这样？ 1.如果有可能在野外获得这样的状态，则直接设置state不会说什么（例如，您可能会错过render中使用过的某个状态的属性，但是任何方法都不会更改） 2.很难保持实际的测试：除了组件外部接口（props）的任何更改外，您还需要使其内部（state）保持一致 3.最后，很容易陷入不一致状态，您无法通过props

进行交互

我该如何测试玩笑？

2 个答案: