您的位置:首页 > Web前端 > React

React-用Jest测试

2015-12-21 22:45 585 查看
一、

1.目录结构



二、代码

1.CheckboxWithLabel.jsx

var React = require('react/addons');
var CheckboxWithLabel = React.createClass({
getInitialState: function() {
return {
isChecked: false
};
},
onChange: function() {
this.setState({
isChecked: !this.state.isChecked
});
},
render: function() {
return ( < label > < input type = "checkbox"
checked = {
this.state.isChecked
}
onChange = {
this.onChange
}
/> {this.state.isChecked ? this.props.labelOn : this.props.labelOff} </label > );
}
});

module.exports = CheckboxWithLabel;


2.__test__/checkboxwithlabel.js

var jest = require('jest');

jest.dontMock('../CheckboxWithLabel.js');
describe('CheckboxWithLabel', function() {
it('changes the text after click', function() {
var React = require('react/addons');
var CheckboxWithLabel = require('../CheckboxWithLabel.js');
var TestUtils = React.addons.TestUtils;
var checkbox = TestUtils.renderIntoDocument( < CheckboxWithLabel labelOn = "On"
labelOff = "Off" / > );
var label = TestUtils.findRenderedDOMComponentWithTag(checkbox, 'label');
expect(label.getDOMNode().textContent).toEqual('Off');
var input = TestUtils.findRenderedDOMComponentWithTag(checkbox, 'input');
TestUtils.Simulate.change(input);
expect(label.getDOMNode().textContent).toEqual('On');
});
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: