javascript - 如何测试提供上下文变量的 HOC 组件
问题描述
我为我的表单组件创建了一个 HOC ,它公开了几个函数作为context
变量。这是代码:
// React 15
import React, { Component } from "react";
import PropTypes from "prop-types";
export default class FormContainer extends Component {
constructor(props) {
super(props);
this.state = {
shouldValidateForm: false
};
}
getChildContext() {
return {
setFieldValue: (event, field) => {
const fieldName = field.id;
this.setState(prevState => ({
[fieldName]: {
...prevState[fieldName],
value: event.currentTarget.value
}
}));
},
addField: data => {
this.setState({
[data.id]: data
});
},
formData: this.state
};
}
/**
* React Lifecycle Method: Renders the data
*
* @return {DOM} Main container DOM.
*/
render() {
return <form action="">{this.props.children}</form>;
}
static childContextTypes = {
addField: PropTypes.func,
setFieldValue: PropTypes.func,
formData: PropTypes.object
};
}
我想在单元测试addField
中setFieldValue
进行单元测试。我尝试了几件事,但我无法弄清楚。有人可以指出我如何测试它的正确方向吗?