reactjs - 通过 React 测试库 (RTL) 触发 react-ace onChange

Question

在我的代码中，我有使用 react-ace 的组件。
在我的渲染函数中，我有这一行:

<CodeEditor onChange={onCodeChanged} value={code} />

回调函数:

const onCodeBodyChanged = (newCode) => {
      // some code ...
      dispatch(setResource({ newCode }));
}

我要测试 onCodeChanged通过 RTL，所以我试图找到更改值的文本区域，但没有任何成功
(不工作)测试的例子:

      const { container } = render(<ResourceEditorPanel />, createMockStore());
      const ace = container.querySelectorAll('.ace_text-input');
      fireEvent.change(ace, { target: { value: 'someText' } });
      await waitFor(() => {
        expect(dispatch).toHaveBeenCalled();
      });

问题是 fireEvent.change(ace, { target: { value: 'someText' } });不会触发我的功能 - onCodeChanged。
你知道我该如何测试吗？

Answer 1

Ace 编辑器等待输入事件，因此您还需要触发类似 fireEvent(ace, new Event('input')) 的事件。