javascript - 如何使用 Jest / Enzyme 模拟 onKeyDown 事件？

Question

我正在使用 Javascript/ReactHooks 创建一个简单的计算器，它有一个带有 onKeyDown 属性的输入框：

// from Calculator.js, in the return statement
<input id="input" value={inputLine} type="text" onKeyDown={(i) => setInputLineFromKeydown(i)} readOnly></input>

setInputLineFromKeydown 函数处理显示在输入框中键入的内容并查找重要的键，例如“Enter”或“=”（以了解何时开始计算）。这是我尝试使用 Jest/Enzyme 对其进行测试的地方：

// from Calculator.test.js
const wrapper = shallow(<Calculator />);
it('should be able to call setInputLineFromKeydown', () => {
    wrapper.find('input').simulate('keypress', {key: '1'});
    wrapper.find('input').simulate('keypress', {key: '+'});
    wrapper.find('input').simulate('keypress', {key: '2'});
    wrapper.find('input').simulate('keypress', {key: 'Enter'});
});    

虽然这个测试“通过”，但我可以从我的代码覆盖率中看到键没有被按下（下面是我的 Calculator.js 文件中的代码，测试覆盖率显示包含“i.key === 'Enter '" 不包括在内）

// from Calculator.js
const setInputLineFromKeydown = (i) => {
        let screen = document.getElementById("input");
        i.persist();

        if (isFinite(i.key) ||
            (i.key === "+" || i.key === "-" || i.key === "*" || i.key === "/"
           || i.key === "=" || i.key === "Enter" || i.key === "c")) {

            setInputLine(inputLine + i.key);
...
}

为什么模拟按键不能正常工作？

标签： javascriptreactjsjestjsreact-hooksenzyme