Enzymejsで入力の変化をシミュレートするときのバグ：誤って更新された状態

フォームの入力フィールドをテストしようとしています。ただし、 Enzyme.js を使用する場合 simulate へ入力フィールドの変更、 state ログから simulate 関数は undefined という名前の状態で新しいレコードを作成しました 助けてくれて本当にうれしいです。

よろしく

コンポーネントの初期状態は次のようになります。

this.state = {
    submission: {
        firstName: '',
        lastName: '',
        email: '',
        date: new Date(),
        validation: {
            email : {isInvalid: false, message: ""},
            firstName : {isInvalid: false, message: ""},
            isValid : true,
            lastName : {isInvalid: false, message: ""}
        }
    }
}

これはテスト機能です：

it('should respond to change event and change the state of the Component', () =>{
    const wrapper = shallow(<ApplicationForm/>);
    console.log(wrapper.find('#firstName').debug());
    wrapper.find('#firstName').simulate(
        'change', {
            target: {
                name: 'firstName',
                value: 'John'
            }
        }
    )
    expect(wrapper.state().submission.firstName).to.equal('John');
})

これは私が状態になることを期待するものです：

submission: {
    firstName: 'John',
    ...
}

そして、これは結果を debug で検査したときに得られるものです

submission: {
    firstName: '',
    lastName: '',
    email: '',
    date: new Date(),
    validation: {
        email : {isInvalid: false, message: ""},
        firstName : {isInvalid: false, message: ""},
        isValid : true,
        lastName : {isInvalid: false, message: ""}
    },
    undefined: 'John'
}

以下に、レンダリングされたフォームのコードを示します。

<input type="text"
    id="firstName"
    className="form-control form-control-sm"
    placeholder="First name"
    onChange={this.updateSubmission.bind(this)}
/>

updateSubmission関数は次のようになります。

updateSubmission(event) {
    let updatedSubmission = Object.assign({}, this.state.submission);
    updatedSubmission[event.target.id] = event.target.value;
    this.setState({
        submission: updatedSubmission
    });
}