React コンポーネントの [追加] ボタンがクリックされたかどうかを確認するためのテストを実行しようとしています。これにより、適切なメソッドが呼び出されていることをスパイがキャッチしてテストに合格できるようになります。
ただし、 ReactTestUtils.Simulate.click() でエラーが発生し、 undefined が返され、スパイはメソッドがヒットしたことを認識しません。
反応、シノンチャイ、カルマを使用しています。
import React from 'react';
import ReactTestUtils from 'react-addons-test-utils';
import { expect } from 'chai';
import AddItem from '../AddItem';
describe('<AddItem />', () => {
let component;
beforeEach(function() {
buildAddItem();
});
function buildAddItem(displayError = false) {
let props = {
displayError: displayError,
text: 'test'
};
component = ReactTestUtils.renderIntoDocument(<AddItem {...props}/>);
return component;
}
it('submits a new item to the database', () => {
let callback = sinon.spy(component, 'handleSubmit');
let input = ReactTestUtils.findRenderedDOMComponentWithTag(component, 'input');
let btn = ReactTestUtils.findRenderedDOMComponentWithTag(component, 'button');
input.value = "test";
component.setState({ text: 'test ' });
ReactTestUtils.Simulate.change(input);
ReactTestUtils.Simulate.click(btn);
expect(component.handleSubmit.CalledOnce).to.be.true;
});
});
btn で .findDOMNode() と .getDOMNode() を実行するなど、複数のことを試しましたが、オブジェクトではないというエラーが表示されます。
この問題を解決するために他に何をすべきかわかりません。