如何在Jest React测试中单击向上/向下数字输入微调按钮

aydmsdu9 于 2023-02-14 发布在 Jest

关注(0)|答案(1)|浏览(129)

我尝试使用@testing-library/react&@testing-library/jest-dom测试一个数字输入组件，但我还没有弄清楚如何测试单击输入的上/下旋转按钮。

test("renders and updates NumberInput", () => {
   let value = "5";
   const setValue = (e) => value = e.value;

   render(<NumberInput
     label="Quantity"
     name="quantity"
     value={value}
     onChange={setValue}
     step={0.5}
     min={0.05}
   />);

   let element = screen.getByRole('spinbutton');
   expect(element).toBeInTheDocument();

   fireEvent.change(element, { target: { value: "10" }});

   expect(value).toEqual("10");
});

如何测试单击向上/向下旋转按钮？

jestjs

来源：https://stackoverflow.com/questions/75438135/how-to-click-up-down-number-input-spin-buttons-in-jest-react-testing

1条答案

按热度按时间

q3aa05251#

我不知道如何模拟单击按钮，但我知道如何测试step和min prop 与userEvent.keyboard的配合使用。

userEvent.click(element).then(() => {
   expect(element).toHaveFocus();

   userEvent.keyboard('[ArrowDown]').then(() => {
      expect(value).toEqual("9.5");
   });
});

赞(0）回复(0）举报 2023-02-14

我来回答

如何在Jest React测试中单击向上/向下数字输入微调按钮

1条答案

相关问题

热门标签

最新问答