时间戳

首页 > 解决方案 > [vue-test-utils]: wrapper.setChecked() 必须传递一个布尔值

javascript - [vue-test-utils]: wrapper.setChecked() 必须传递一个布尔值

问题描述

使用 Vue，我有一些无线电输入：

  <label>
    <input
      v-model="myProperty"
      v-bind:value="true"
      name="myProperty"
      type="radio"
    > True
  </label>

  <label>
    <input
      v-model="myProperty"
      v-validate="input.rules ? input.rules : ''"
      v-bind:value="false"
      name="myProperty"
      type="radio"
    > False
  </label>

我正在使用vue-test-utilsand测试它们jest，我在其中选择并为我的字段分配一个值：

let myProperty = wrapper.find('[name="myProperty"]')
myProperty.setChecked(false)

根据文档，它似乎应该是这样工作的。但我得到这个错误：

[vue-test-utils]: wrapper.setChecked() must be passed a boolean

但是，当我将值设置为true而不是false. 作为实验，我尝试将值设置为字符串'false'：

myProperty.setChecked('false')

然后我得到了这个错误：

[vue-test-utils]: wrapper.setChecked() must be passed a boolean

vue-test-utils那么当值为时我应该如何选择我想要的无线电输入false？如果我的无线电输入有值字符串怎么办？

标签： javascripttestingvue.jsradio-buttonvue-test-utils

解决方案

您需要调用setChecked组中的另一个无线电输入。这将取消选中组中的所有其他单选按钮，因为一次只能选中一个：

wrapper.find('[name="other property"]').setChecked(true)

在 Vue Test Utils 中，我们不允许将单选按钮设置checked为 false，因为这使您可以将单选按钮置于不检查任何选项的状态，尽管这对于用户来说是不可能的。

也许我们应该重新考虑这个设计决定。如果您有用例，请在 Vue Test Utils GitHub 存储库中创建功能请求。

推荐阅读