javascript - 如何测试接收事件的函数？

Question

创建测试对我来说是新鲜事。我正在尝试为接收事件的函数创建测试。如果重要的话，这是一个 onChange 调用，而且我正在使用 chai。

我的功能:

export function handleChange(event) {
  if (isNaN(event.target.value)) {
    event.preventDefault();
    alert('input can only be a number');

  } else if (event.target.value > 5) {
    event.preventDefault();
    alert('Rating can not be over 5 stars, please try again');

  } else {
    this.setState({starRate: event.target.value});
  }

Answer 1

首先，您将 event.preventDefault() 应用于输入。在这种情况下，没有要阻止的“事件”，因此该代码本质上是无用的。

其次，当只有 event 传递给您的函数时，您正在使用 event.target.value。在本例中，您只需查找 event.value。

要传递当前输入，只需传递 this 作为 JavaScript 函数的参数。 this 始终引用当前元素。

这是一个工作示例:

function handleChange(event) {
  if (isNaN(event.value)) {
    alert('The input can only be a number.');
  } else if (event.value > 5) {
    alert('Rating can not be over 5 stars, please try again.');
  } else {
    alert('The input was OK.');
  }
}

<input onchange="handleChange(this)">

当您输入一个输入(然后尝试单击该输入)时，将引发 alert()。

希望这有帮助! :)