Jest + Nuxt + Nuxt-Fire 在测试套件中失败

Posted 2023-02-16

【中文标题】Jest + Nuxt + Nuxt-Fire 在测试套件中失败

【英文标题】：Jest + Nuxt + Nuxt-Fire is failing in test suite

【发布时间】：2019-05-21 22:46:51

【问题描述】：

我正在使用 Nuxt 和 Nuxt-Fire (https://github.com/lupas/nuxt-fire)

当我启动测试时，我收到此错误[Vue warn]: Error in config.errorHandler: "TypeError: Cannot read property 'ref' of undefined"

发生这种情况是因为我的应用程序中的这个部分

mounted() 
    this.initiate(window.instaroomId)

    let connected = this.$fireDb.ref(".info/connected")
    this.getConnection(connected)
,

看起来 this.$fireDb 没有被调用。该模块通常加载在 nuxt.config.js 中。我怎样才能做到这一点？

【问题讨论】：

能否也提供您的测试用例的内容？

我之所以关注，是因为我有另一个库 (@nuxt/axios) 没有在测试套件中加载的问题

【参考方案1】：

如果你想测试，this.$fireDb.ref(".info/connected") 被调用，你可以像这样模拟它：

import  shallowMount  from '@vue/test-utils'
import SomeComponent from '@/components/SomeComponent/SomeComponent.vue'

let wrapper

describe('SomeComponent.vue Test', () => 
  beforeEach(() => 
    wrapper = shallowMount(SomeComponent, 
      mocks: 
        $fireDb: 
          ref: jest.fn()
        
      
    )
  )
  it('$fireDb.ref was called', () => 
    expect(wrapper.vm.$fireDb.ref).toBeCalled()
    expect(wrapper.vm.$fireDb.ref).toBeCalledWith('.info/connected')
  )
)

或者，如果您希望测试只是通过 created() 挂钩并测试另一个功能，您可以模拟 $fireDb.ref 而无需测试它是否被调用。