反应测试：更改输入字段的值

Question

我无法设置输入字段的值。我究竟做错了什么？ 如果需要更多信息，请告诉我。谢谢。

describe('SignUpComp', () => {
    let signUpComp, node;

    beforeEach(() => {
        signUpComp = TestUtils.renderIntoDocument(<SignUp />);
        node = ReactDOM.findDOMNode(signUpComp);
    });

    // First name
    it('it should trigger error `min chars` if input firstName is too short', () => {
        let elements = selectElements('firstName');

        TestUtils.Simulate.change(elements.input, { target: { value: 'abc' } });
        console.log(elements.input); // I can not see the change
        console.log(node); // I can not see the change

        expect(elements.error.textContent).to.equal(errorMsg.tooShort('First name', 2));
    });

    function selectElements(element) {
        let input = node.querySelector('#' + element);
        let error = node.querySelector('#' + element + '+ p');

        return { input, error };
    }

Answer 1

我建议你看看enzyme，它大大简化了测试反应组件。

使用酵素，您可以做的很简单：

const form = mount(<MyComponent />);
const input = form.find('input').get(0);
input.value = 'Blah blah';