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

Question

使用 Vue，我有一些 radio 输入:

  <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-utils 和 jest 测试它们，我在其中选择并为我的字段分配一个值:

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

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

[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

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

Answer 1

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

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

在 Vue Test Utils 中，我们不允许将单选按钮 checked 设置为 false，因为这使您能够将单选按钮组置于未选中的状态，尽管这对于用户来说是不可能的.

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