mocha.js - enzyme - 如何测试内部组件的初始状态？

Question

我正在安装一个组件，其中包含另一个组件，如下所示:

const wrapper = mount(<IntlProvider><SignUpForm /></IntlProvider>);

组件<SignUpForm />初始状态应为 {errors: {}} .我正在使用以下断言:

expect(wrapper.find(SignUpForm).state('errors')).to.equal({});

但是我在运行测试时收到以下错误:

Error: ReactWrapper::state() can only be called on the root

那么，我该如何访问 <SignUpForm /> 的状态呢？组件？

Answer 1

好吧，您不能使用 enzyme 来做到这一点(据我所知)，但这样做有一个很好的理由 - 单元测试应该测试应用程序的某些独立部分(永远不要在一个测试中测试两个部分)。这个Provider真的是一个组件，所以你试试子组件挂载父组件...

同样的问题是，当你有连接到 redux store 的组件时，你可以将它们包装在 Provider 中，但事实并非如此。您应该将组件与包装版本分开，然后仅测试与第三方/ parent / sibling 隔离的组件。

我从一个文件中导出组件和连接组件(两个导出，一个命名，一个默认)并且在测试中我只导入命名(未连接)组件。我真的不想测试 redux provider ;)

//component.jsx
export function MyComp() {}
export default connect()(MyComp)

//component.test.js
import {MyComp} from "./component"

//another component
import MyComp from "./component"