本页中描述的测试源码可以在 找到。

我们考虑一个用两个 getters 操作一个 store 的案例,看起来是这样的:

对于 getters 我们将测试:

  1. : 取得所有 poodles
  2. poodlesByAge: 取得所有 poodles,并接受一个年龄参数

并没有什么特别令人兴奋的 — 记住 getter 可以接受其他的 getters 作为第二个参数。因为我们已经有一个 poodles getter 了,可以在 poodlesByAge 中复用它。通过在 poodlesByAge 返回一个接受参数的函数,我们可以向 getters 中传入参数。poodlesByAge getter 用法是这样的:

让我们从测试 开始吧。

鉴于一个 getter 只是一个接收一个 state 对象作为首个参数的 JavaScript 函数,所以测试起来非常简单。我将把测试写在 getters.spec.js 文件中,代码如下:

poodlesByAge 则更有趣一点了。传入一个 getter 的第二个参数是其他 getters。我们正在测试的是 poodlesByAge,所以我们不想将 的实现牵扯进来。我们通过 stub 掉 getters.poodles 取而代之。这将给我们对测试更细粒度的控制。

不同于向 getter 传入真实的 poodles(译注:刚刚测试过的另一个 getter),我们传入的是一个它可能返回的结果。因为之前写过一个测试了,所以我们知道它是工作正常的。这使得我们把测试逻辑单独聚焦于 poodlesByAge

async 的 getters 也是可能的。它们可以通过和测试 async actions 的相同技术被测试,参见 这里Vuex - Getters - 图1

  • 当单独地测试 getters 时,你需要手动传入 state
  • 如果一个 getter 使用了其他 getters,你应该用符合期望的返回结果 stub 掉后者。这将给我们对测试更细粒度的控制,并让你聚焦于测试中的 getter。