Javascript ReactJs表单单元测试-.update（）无法在功能组件内的输入标记上模拟onChange事件（使用Ezyme的JEST）

我试图学习单元测试，在功能组件内部的输入表单上模拟onChange事件时遇到问题

以下是我当前的组件代码：

....import codes hidden...

  const TodoMenu = (props) => {
  const [newTodo, setNewTodo] = useState("");
  const [todoDetails, setTodoDetails] = useState({});
  const { todoList } = props;
  const { getAllTodos, addTodo } = props;

  useEffect(() => {
    getAllTodos();
  }, []);

  const handleChange = (e) => {
    setNewTodo(e.target.value);
  };


  const TodoListMarkup =
    todoList.length > 0 ? (
      todoList.map((todo, index) => (
        <Todo
          key={index}
          todoDetails={todo}
        />
      ))
    ) : (
      <em>You have no task todo.</em>
    );


  return (
    <div className="todo-menu">
      <div className="todo-menu__header">
        <h1 className="todo-menu__heading">Todo List</h1>

        <form className="todo-menu__todo-form" onSubmit={handleSubmit}>
          <TextField
            name="newTodo"
            className="todo-menu__todo-input"
            value={newTodo}
            placeholder="Add New Task here"
            onChange={handleChange}
          />
          <button className="todo-menu__submit-button">
            <CornerDownLeft />
          </button>
        </form>

      </div>

      <div className="todo-menu__items">{TodoListMarkup}</div>


    </div>
  );
};

const mapStateToProps = (state) => {
  return { todoList: state.TodoList };
};

const mapActionsToProps = { getAllTodos, addTodo };

export default connect(mapStateToProps, mapActionsToProps)(TodoMenu);

…导入隐藏的代码。。。
const TodoMenu=（道具）=>{
常数[newTodo，setNewTodo]=使用状态（“”）；
const[todoDetails，settodetails]=useState（{}）；
const{todoList}=props；
const{getalltodo，addTodo}=props；
useffect（（）=>{
getAllTodos（）；
}, []);
常数handleChange=（e）=>{
setNewTodo（即目标值）；
};
伦敦警察局=
todoList.length>0(
todoList.map（（todo，index）=>(
))
) : (
你没有任务要做。
);
返回(
事項清單
{TodoListMarkup}
);
};
常量mapStateToProps=（状态）=>{
返回{todoList:state.todoList}；
};
常量mapActionsToProps={getAllTodos，addTodo}；
导出默认连接（MapStateTrops、mapActionsToProps）（TodoMenu）；

这是我的测试文件：

let wrappedComponent;

beforeEach(() => {
  wrappedComponent = mount(
    <Provider>
      <TodoMenu />
    </Provider>
  );
});

afterEach(() => {
  wrappedComponent.unmount();
});

describe("New Todo form behavior", () => {
  let todoFormInput;

  beforeEach(() => {
    todoFormInput = wrappedComponent.find(
      ".todo-menu__todo-form > .todo-menu__todo-input"
    );
  });

  it("handle input changes", () => {
    todoFormInput
      .simulate("change", {
        target: { value: "New Todo 123" },
      });

    // wrappedComponent.setProps({});

    expect(
      todoFormInput
        .prop("value")
    ).toBe("New Todo 123");
  });
});

让wrappedComponent；
在每个之前（（）=>{
wrappedComponent=装载(
);
});
之后（（）=>{
wrappedComponent.unmount（）；
});
描述（“新待办事项表单行为”，（）=>{
让Todoformitt；
在每个之前（（）=>{
TODOFORMIUT=wrappedComponent.find(
“.todo-menu\uu-todo-form>.todo-menu\uu-todo-input”
);
});
它（“处理输入更改”，（）=>{
TODOFORMIUT
.模拟（“改变”{
目标：{value:“新Todo 123”}，
});
//wrappedComponent.setProps（{}）；
期待(
TODOFORMIUT
.道具（“价值”）
).toBe（“新Todo 123”）；
});
});

预期行为： Todo输出值为“新Todo 123”

实际行为： TODOFORMIUT的值为“”

我尝试过使用.setProps（{}），因为根据，setProps强制组件重新渲染

在使用基于类的组件之前，我已经成功地使用了.update（），但在功能组件中实现它失败