I'm trying to unit test a click behavior in a component that is binding its updateState from a parent component, but I am unable to figure out how this is done.
var ParentComponent = React.createClass({
getInitialState: function() {
return {clicked:false;}
}
updateState: function(newState) {
this.setState(newState);
},
render: function() {
<ChildComponent appState={this.state} updateState={this.updateState} />
}
});
var ChildComponent = React.createClass({
updateState: function() {
this.props.updateState({clicked:true})
}
render: function() {
<a ref="clicky" onClick={this.updateState}>Update the parent state</a>
}
});
and in my mocha test:
var appState = {clicked:false};
var updateState= function(newState) {this.setState(newState)};
var component = ReactTestUtils.renderIntoDocument(<ChildComponent appState={appSstate} updateState={updateState} />);
console.log("BEFORE:",component.props.appState);
// click the simple layout preset in the dropdown
var clicky = component.refs.clicky;
ReactTestUtils.Simulate.click(clicky);
console.log("AFTER:",component.props.appState);
I get the following error when the unit test runs:
TypeError: this.setState is not a function
How can i use the same function that exists in the ParentComponent?
Edit: forgot to mention that ParentComponent and ChildComponent are defined as separate modules.
Aucun commentaire:
Enregistrer un commentaire