如何在输入字段jest测试中模仿打字行为

eni9jsuy  于 2023-11-15  发布在  Jest
关注(0)|答案(1)|浏览(183)

我有一个组件,当用户在文本字段中输入时,前面会出现一个类型,即来自包含用户输入的服务器的数据。我想测试这种行为。所以当用户输入“some data"时,我想在我的react测试类中模仿这种行为,但现在知道如何做了。

useEffect(() => {
    if (inputValue) {
      if (inputValue.length > 2) {
        getTypeahead();
      }
    }
}, [inputValue]);

const getTypeahead = () => {
    service
      .getData(inputValue)
      .then((response) => {
        const slicedData = response.data.slice(0, 10);
        if (inputValue.toLowerCase().includes('some data')) {
          slicedData.push({name: 'test something'});
        }
      })
      .catch((error) => {
        console.log(error);
      });
};

<FormField>
    <input value = {inputValue || ''} data-testid="test-id" />
</FormField>

个字符

l7mqbcuq

l7mqbcuq1#

你可以使用你已经导入的userEvent。用户事件通常会触发多个事件。例如,userEvent.type()将处理输入元素的焦点,触发键盘事件,并在“user”类型时操作输入元素的选择和值字段。

describe('Testing...', () => {
  test('Testing...', async () => {
    render(<Typeahead />);
    const input = screen.getByTestId('test-id');
    userEvent.type(input, 'something 2')
  });
});

字符串

相关问题