vue.js - Vue Test Utils 中的异步生命周期函数

Question

当我尝试测试已安装方法的组件时:

mounted(){
this.search()
}

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

我检查了它没有等待就返回了 Promise 。
我写了这样的测试:

    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这就是为什么没有什么可等待的。要在测试中等待 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...