Vue Test Utils 中的异步生命周期函数

Question

当我尝试测试已安装方法的组件时，如下所示：

mounted(){
this.search()
}

methods:{
  async search(){
     try{
       await axios.something
       console.log("not executed only when shallowMount")
      }catch{}
  }
}

我检查它返回 Promise<pending> 没有等待。
我这样写了测试：

    wrapper = await shallowMount(Component, {
      localVue
    });
    await wrapper.vm.search()// this works perfectly

然而，只有shallowMount 显然跳过了等待的函数，而下一行则完美地工作。
我对这种行为一无所知。
我该如何修复它？

编辑：

我还使用 Mirage.js 进行模拟响应。

function deviceServer() {
  return createServer({
    environment: "test",
    serializers: {
      device: deviceListSerializer()
    },
    models: {
      device: Model
    },
    fixtures: {
      devices: devices
    },
    routes() {
      this.namespace = "/api/v1/";
      this.resource("device");
    },
    seeds(server) {
      server.loadFixtures("devices");
    }
  });
}

Answer 1

shallowMount不会回来Promise，这就是为什么没有什么可等待的。要在测试中等待承诺，请尝试使用flush-promises库。您的测试flushPromises将如下所示：

import flushPromises from 'flush-promises'

wrapper = shallowMount(Component, {
      localVue
    });
await flushPromises(); // we wait until all promises in created() hook are resolved
// expect...