对Vue插件进行单元测试

时间:2019-08-20 17:19:21

标签: javascript vue.js vue-test-utils

我有一个console.logs数据的插件。

logData.spec.js

import Vue from 'vue'
import { createLocalVue } from '@vue/test-utils'
import logData from './logData'

describe('logData plugin', () => {
  const localVue = createLocalVue()
  it('adds a $logData method to the Vue prototype', () => {
    expect(Vue.prototype.$logData).toBeUndefined()
    localVue.use(logData)
    expect(typeof localVue.prototype.$logData).toBe('function')
  })
  it('console.logs data passed to it', () => {
    const data = 'data to be logged'
    const localVue = createLocalVue()
    localVue.use(logData)
    expect(localVue.prototype.$logData(data)).toBe('data to be logged')
  })
})

logData.js

export function logData (dataToLog) {
  const isLoggingData = localStorage.getItem('isLoggingData')
  if (isLoggingData) {
    console.log(dataToLog)
  }
}

export default {
  install: function (Vue) {
    Vue.prototype.$logData = logData
  }
}

我在单元测试中遇到的错误是预期的:“要记录的数据”,收到:未定义。为什么第二个测试被读取为未定义?

1 个答案:

答案 0 :(得分:1)

console.log()返回undefined以来,这是预期的行为。为了获得理想的结果,您应该将以下代码行添加到lodData函数中:

return dataToLog
export function logData (dataToLog) {
  const isLoggingData = localStorage.getItem('isLoggingData')
  if (isLoggingData) {
    console.log(dataToLog)
    return dataToLog
  }
}

注意:另外,您的测试环境中没有localStorage

相关问题