0
単体テストケース作成に新しくなりました。コードカバレッジは、テスト中の反応コードのためにイスタンブールを使用してブランチで50％です - MOCHA + CHAI + ENZYME。コードに何が欠けているのか分からない。イスタンブールを使用したモカのテストでは、テストコードのカバレッジは50％です。それを100％にする方法は？
subscription.js：
import React from 'react';
export default class Subscription extends React.Component {
constructor(props) {
super(props);
this.state = {
input:'',
}
this.handleSubmit = this.handleSubmit.bind(this);
this.handleChange = this.handleChange.bind(this);
}
handleSubmit(e){
e.preventDefault();
this.setState({
input: ''
})
}
handleChange(e) {
this.setState({
input:e.target.value
})
}
render() {
//Setting up className here
//let inputSel = this.state.isChecked?"active":"";
return (
<div>
<form onSubmit={this.handleSubmit}>
<input type="email" onChange={this.handleChange} value={this.state.input} />
<button className="buttonStyle">Subscribe</button>
</form>
</div>
);
}
} //end of class
app.js：
import React from 'react';
import {render} from 'react-dom';
import Subscription from './Subscription'
class App extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>
<Subscription />
</div>
);
}
}
render(<App />,document.getElementById('app'));
test.js
import React from 'react';
import sinon from 'sinon';
import {mount,shallow} from 'enzyme';
import { expect } from 'chai';
import Subscription from '../src/client/app/Subscription'
describe('<Subscription />', function() {
before(function() {
it('should have subscription component',function(){
expect(shallow (<Subscription />)).to.have.length(1);
});
});
it('should have a form ',function(){
const wrapper = shallow (<Subscription />);
expect(wrapper.find('form')).to.have.length(1);
});
it('should have an input box with type email', function() {
const wrapper = shallow (<Subscription />);
expect(wrapper.find('input[type="email"]')).to.have.length(1);
// expect(wrapper.find('.subscribeinput')).to.equal(true);
});
it('should have a button', function() {
const wrapper = shallow(<Subscription />);
expect(wrapper.find('button')).to.have.length(1);
});
it('input and button should be child of form',function(){
const wrapper = shallow (<Subscription />);
expect(wrapper.find('input').parent().is('form')).to.equal(true);
expect(wrapper.find('button').parent().is('form')).to.equal(true);
});
it('should have an initial email state', function() {
const wrapper = mount(<Subscription/>);
expect(wrapper.state().input).to.equal('');
});
it('should update the src state on changing input', function() {
const wrapper = mount(<Subscription/>);
wrapper.find('input').simulate('change', {target: {value: '[email protected]'}});
//wrapper.setState({ input: (wrapper.find('input[type="email"]').value()) });
expect(wrapper.state().input).to.equal('[email protected]');
});
it('should update the input box on subscribe', function() {
const handleSubmit = sinon.spy();
const wrapper = mount(<Subscription/>);
wrapper.find('button').simulate('submit', { preventDefault() {} });
expect(handleSubmit).to.have.been.called;
expect(wrapper.state('input')).to.equal('');
});
});
**カバレッジの結果イスタンブール**
カバレッジ要約 ステートメントを使用して要約：100％（9/9） 支店：50％（1/2） 機能：100％（1/1） 行：100％（9/9）
なぜブランチだけで50％ですか？それを100％にするために何をすべきか？
そこにはあなたが提供するコードでは全く分岐がありませんので、私はあなたが一つでも支店のカバレッジを得ることができたかどうかはわかりません。テストしていないファイルにある唯一の分岐ロジックはコメントアウトされています。 – idbehold
なぜ私はそのような結果を持っているのかわからない。 –