Jest.js 向上和向下箭头不适用于userEvent

ljsrvy3e  于 2023-04-27  发布在  Jest
关注(0)|答案(1)|浏览(158)

我正在处理一个输入类型number的测试,我希望在键盘上分别键入向上和向下箭头时增加和减少值。问题是什么都没有发生,输入值保持不变。有人可以查看我的代码并查看发生了什么。我相信userEvent和input在这个特定事件中没有相互通信

it('renders current year', () => {
  render(
    <input
      type="number"
      step="1"
      name="number"
      placeholder="number"
      aria-label="number"
      defaultValue={0}
    />
  );
  const input = screen.getByPlaceholderText(/number/i);
  user.type(input, '{arrowup}');
  console.log(input);
  expect(input).toHaveValue(1);
});

产品编号:https://codesandbox.io/s/late-http-ff27ln?file=/src/App.test.tsx

erhoui1w

erhoui1w1#

而不是

user.type(input, '{arrowup}');

尝试

await user.keyboard('[ArrowUp]')

另外,建议尽可能按角色访问元素,以确保可访问性。因此,而不是:

const input = screen.getByPlaceholderText(/number/i);

尝试

const input = screen.getByRole('textbox');

相关问题