Javascript 测试调用外部api的Vuex操作

在我的Vue.js项目中，我有以下Vuex操作：

import { HTTP } from '@/services/http'

export const actions = {
  loginUser ({ commit }, params) {
    HTTP.post(
      'v1/login',
      { email: params.email, password: params.password }
    ).then(response => {
      localStorage.setItem('access_token', response.data.token)
      commit('SET_USER', response.data)
    }).catch(error => {
      commit('SET_LOGIN_ERROR', error.response.data.error)
    })
  }
}

---

我正在使用Mocha+Karma进行单元测试。如何测试该操作？

模拟/存根任何依赖项非常重要。您的第一个挑战是模拟HTTP服务，因为正如所写的，除非您有到后端服务器的Internet连接，否则您的测试不会通过。调查以解决这个问题

为了测试行动，我借用了他的想法。创建一个提交函数的存根，该存根接受操作调用的每个变异的类型和负载，然后将其与预期进行比较。如果预期的突变列表与执行操作时提交存根调用的突变列表匹配，则该操作通过测试

这是一个我不会在生产中使用的小例子，但它有助于说明这个想法：

let count = 0
let errors = []
let mutations = [
  { type: 'SET_USER', payload: 'whatever response.data is expected to be' }
]

function commit(type, payload) {
  const mutation = mutations[count]

  try {
    expect(mutation.type).to.equal(type)
    if (payload) { expect(mutation.payload).to.deep.equal(payload) }
  } catch (error) {
    errors.push(error)
  }

  count++
}

actions.loginUser({ commit }, { email: 'fake@email.com', password: '12345' })

---

在我们进入这个话题之前，为什么还要费心这么做呢？如果您依赖于外部API调用，您可能会质疑您的测试到底有多可靠和自包含。嘲笑你在电话里需要的东西不是更好吗？