React酵素のシミュレートされた変更イベントの後に更新された値をチェックする方法は？

Question

私は、シミュレートされた変更イベントの後に入力フィールドの更新された値をチェックしようとしています。

const wrapper = mount(<input type="number" value="hello" onChange="onChangeFunc"/>); 
wrapper.simulate('change', {target: {value: "2"}}); 
expect(wrapper.props().value).to.equal('3'); 

なぜこれが機能しないのでしょうか？私はsetStateが非同期であり、テストが戻った後に起こるかもしれないと思っています。

Answer 1

まず入力タイプ= "番号"があり、テキストを入力しています.2番目はonChangeイベントを処理していません。これは入力値を更新する場所です。コード

import React, { Component } from 'react'; 

class Test extends Component { 

    constructor(props) { 
    super(props); 

    this.state = { 
     value: '' 
    }; 
    } 

    handleInputChange(e) { 
    this.setState({value: e.target.value}); 
    } 

    render() { 
    return (
     <input type="text" value={this.state.value} onChange={this.handleInputChange.bind(this)} /> 
    ); 
    } 
} 

export default Test; 

以下を見て、その後のテストでその

describe("Test",() => { 

    const wrapper = mount(
     <Test /> 
    ); 

    it("should enter valid value",() => { 
     wrapper.find('input').simulate('change', {target: {value: "hello!"}}); 
     expect(wrapper.find('input').props().value).to.equal('hello!'); 
     console.log(wrapper.find('input').props().value); 
    }); 


    });