使用vue-test-utils为单元测试设置Vue计算属性

Question

vue-test-utils提供了一个setComputed方法，允许您设置计算属性的状态。

import { mount } from '@vue/test-utils'
const wrapper = mount(Home)
wrapper.setComputed({loaded: true})

vue-test-utils版本1.1.0.beta正在为读取setComputed() has been deprecated and will be removed in version 1.0.0. You can overwrite computed properties by passing a computed object in the mounting options的setComputed方法抛出弃用警告

mounting options in the docs没有提及任何计算对象。我去了

const wrapper = mount(Home, { computed: {loaded: true} })

和

const wrapper = mount(Home, {context: { computed: {loaded: true} }  })

但是那些爆炸了。

为vue-test-utils设置计算属性的方法是什么？

Answer 1

您可以在装载组件时覆盖计算选项：

const wrapper = mount(Home, {
  computed: {
    loaded() {
      return true
    }
  }
})

但是模拟计算是危险的。您可能会将组件置于生产过程中无法进入的状态。