Javascript 如何在redux表单字段中测试onChange事件

我想在redux表单字段中测试onChange方法，当调用onChange方法时，它应该设置本地状态。这是我要测试的容器代码

constructor(props) {
    super(props);
    this.state = {
      username: '',
      password: ''
    };
    this.handleUserNameChange = this.handleUserNameChange.bind(this);
    this.handlePasswordChange = this.handlePasswordChange.bind(this);
    this.onSubmit = this.onSubmit.bind(this);
  }

  handleUserNameChange(event) {
    this.setState({
      username: event.target.value
    });
  }

  handlePasswordChange(event) {
    this.setState({
      password: event.target.value
    });
  }

这是将触发onChange方法的登录组件

const LoginForm = ({username, password, handleLogin, handleUserNameChange, handlePasswordChange, user_error, loading, loading_color}) => {
      return (
      <form name="form" onSubmit={handleLogin}>
        <h1> Login Form </h1>
          <Field
            name="user_name"
            type="text"
            label="User Name"
            component={renderUserComponent}
            onChange={handleUserNameChange}
            value={username}
          /><br />
          <Field
            name="password"
            type="password"
            label="Password"
            component={renderUserComponent}
            onChange={handlePasswordChange}
            value={password}
          /><br />
          {renderSubmit({user_error, loading, handleLogin, loading_color})}
          <br />
      </form>
    );
}

const LoginForm=（{用户名、密码、handleLogin、handleUserNameChange、handlePasswordChange、用户错误、加载、加载颜色}）=>{
返回(
登录表单




{renderSubmit（{user_error，loading，handleLogin，loading_color}}


);
}

现在，我可以使用以下测试代码测试onsubmit函数，但不能使用handleOnchange方法。这是我当前的测试代码

describe("LoginForm", () => {
  let state={
    username: '',
    password: ''
  }
  const defaultProps = {
      username: '',
      password: '',
      handleLogin: () => {},
      handleUserNameChange: (event) => {
        state.setState({
          username: event.target.value
        })
      },
      handlePasswordChange: (event) => {
        state.setState({
          password: event.target.value
        })
      }
  };
  const handleLogin = sinon.spy();
  const handleUserNameChange = sinon.spy();
  const handlePasswordChange = sinon.spy();
  let loginForm = mount(
       <MuiThemeProvider muiTheme={getMuiTheme()}>
         <Provider store={store}>
         <LoginForm {...defaultProps} handleLogin={handleLogin} handleUserNameChange={handleUserNameChange} handlePasswordChange={handlePasswordChange}/>
         </Provider>
       </MuiThemeProvider>
  );

  describe("when the redux form was submitted", () => {
    it("the handleLogin function would be called once", () => {
        const button = loginForm.find("FlatButton");
        button.simulate('submit');
        expect(handleLogin.called).toBe(true);
    });
  });

  describe("when the username was changed", () => {
    it("the handleUserNameChange function would be called once, and the state would be changed", () => {
        const username_field = loginForm.find("Field").first();
        username_field.simulate('keyDown', { keyCode: 40});
        username_field.simulate('change', { keyCode: 40});
        expect(handleUserNameChange.called).toBe(true);
    });
  });
});

description（“LoginForm”，（）=>{
陈述={
用户名：“”，
密码：“”
}
const defaultProps={
用户名：“”，
密码：“”，
handleLogin:（）=>{}，
handleUserNameChange：（事件）=>{
state.setState({
用户名：event.target.value
})
},
handlePasswordChange:（事件）=>{
state.setState({
密码：event.target.value
})
}
};
const handleLogin=sinon.spy（）；
const handleUserNameChange=sinon.spy（）；
const handlePasswordChange=sinon.spy（）；
让loginForm=mount(
);
描述（“提交redux表单时”，（）=>{
它（“handleLogin函数将被调用一次”，（）=>{
const button=loginForm.find（“FlatButton”）；
按钮。模拟（'submit'）；
expect（handleLogin.called）.toBe（true）；
});
});
描述（“用户名更改时”，（）=>{
它（“handleUserNameChange函数将被调用一次，并且状态将被更改”，（）=>{
const username_field=loginForm.find（“field”）.first（）；
username_field.simulate（'keyDown'，{keyCode:40}）；
username_field.simulate（'change'，{keyCode:40}）；
expect（handleUserNameChange.called）.toBe（true）；
});
});
});

那么，如何正确触发onChange方法，以及如何评估状态值呢