0
Новые для написания блок-тестов. Кодовый охват составляет 50% в ветке с использованием istanbul для реакции кода с тестированием - MOCHA + CHAI + ENZYME. Не удалось выяснить, чего не хватает в коде.Покрытие тестового кода составляет 50% при использовании Стамбула для теста Mocha. Как сделать это на 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('');
});
});
** результат Covera Резюме GE с помощью Стамбул **
Охват суммарные заявления: 100% (9/9) Отрасли: 50% (1/2) Функции: 100% (1/1) линии: 100% (9/9)
Почему только ветви 50%? что нужно сделать, чтобы сделать это на 100%?
Существует нет ветвления вообще в коде, при условии, поэтому я не знаю, как вам удалось даже получить покрытие для одной отрасли. Прокомментирована единственная ветвящаяся логика, которую вы используете в своих не-тестовых файлах. – idbehold
не знаю, почему у меня такие результаты .. –