React コンポーネント:
import React, { Component, PropTypes } from 'react';
export default class Simple extends Component {
render() {
return <div className="Simple">
Result: {this.props.value * 4}
</div>
}
}
Simple.propTypes = {
value: PropTypes.number,
};
テスト:
describe('<Simple />', _ => {
it('should display', done => {
const wrapper = shallow(<Simple />);
expect(wrapper.find('div.Simple')).to.have.length(1);
done();
});
it('should quadruple a value passed into it', done => {
const wrapper = shallow(<Simple value={3} />);
expect(wrapper.contains(<div className="Simple">Result: 12</div>)).to.equal(true);
done();
})
});
最初のテストは成功し、2 番目 (値の 4 倍) は失敗します。ここで何が間違っているのかわかりません。
編集:
これを返すようにコンポーネントを変更すると、次のようになります。
return <div className="Simple">
Result:
</div>
そして次のようなテスト:
expect(wrapper.contains(
<div className="Simple">
Result:
</div>
)).to.equal(true);
その後、それは通過します。したがって、テストが失敗するのは計算小道具を導入するときです。理由はよくわかりません。