unit-testing - 无法读取未定义的属性 'getters' - 使用 Jest 进行 VueJS 单元测试

Question

我正在为 VueJS 组件编写单元测试并引用了 Vue Test Utils Common Tips 的“应用全局插件和混合”部分.我有一个依赖于 Vuex 存储的组件，因此出于我的目的，我将在该部分下转换示例是有道理的。

这是我为该组件的特定 .spec.js 文件编写的代码:

import { createLocalVue, mount } from '@vue/test-utils'
import AppFooter from '@/components/AppFooter/AppFooter'
import store from '@/store'

describe('AppFooter component', () => {
    const localVue = createLocalVue()
    localVue.use(store)

    it('AppFooter should have header slot', () => {
        const AppFooterComponent = mount(AppFooter, {
            localVue
        })

        /* TODO: Replace with a more appropriate assertion */
        expect(true).toEqual(true)
    })
})

这非常忠实于上面链接中提供的示例。但是，我在运行测试套件时收到的错误如下:

我应该以不同的方式安装 Vue 商店吗？

Answer 1

为了详细说明我的评论，我认为它应该如下所示，您在调用 mount() 时传入商店。

import { createLocalVue, mount } from '@vue/test-utils'
import AppFooter from '@/components/AppFooter/AppFooter'
import Vuex from 'vuex'
import store from '@/store' //you could also mock this out.

describe('AppFooter component', () => {
    const localVue = createLocalVue()
    localVue.use(Vuex)

    it('AppFooter should have header slot', () => {
        const AppFooterComponent = mount(AppFooter, {
            store,
            localVue
        })

        /* TODO: Replace with a more appropriate assertion */
        expect(true).toEqual(true)
    })
})