Vue.js 如何用笑话模拟回调

我有一个确认模式组件，它通过回调返回true/false，但我无法使它工作。尝试了各种方法，如

jest.fn（）.mockReturnValue（true）

。 为了测试通过事件总线返回回调的组件，有什么提示/建议吗

组件/confirmModal.vue

<template lang="pug">
transition(name='fade')
  #swConfirm.confirm-modal-overlay(v-if='isShow', @click='handleClickOverlay')
    transition(name='zoom')
      .confirm-modal-container(v-if='isShow')
        span.confirm-modal-text-grid(@click.stop='')
          h5.confirm-modal-title(v-if='dialog.title') {{ dialog.title }}
          p.confirm-modal-text(v-if='dialog.message') {{ dialog.message }}
        .confirm-modal-btn-grid(:class='{ isMono: dialog.isMono }')
          button.confirm-modal-btn.left(v-if='!dialog.isMono', @click.stop='e => handleClickButton(false)')
            | {{ dialog.button.no || "Cancel"  }}
          button.confirm-modal-btn(@click.stop='e => handleClickButton(true)')
            | {{ dialog.button.yes || "OK"  }}
</template>

<script>
import Vue from 'vue'
import { events } from '../plugins/confirm-modal'

Vue.directive('focus', {
  inserted: function(el) {
    el.focus()
  }
})

const Component = {
  name: 'confirmModal',
  data() {
    return {
      isShow: false,
      dialog: {
        title: '',
        message: '',
        button: {},
        isMono: false
      },
      params: {}
    }
  },
  methods: {
    resetState() {
      this.dialog = {
        title: '',
        message: '',
        button: {},
        isMono: false,
        callback: () => {}
      }
    },
    handleClickButton(confirm) {
      this.isShow = false
      if (this.params.callback) {
        this.params.callback(confirm)
      }
    },
    handleClickOverlay() {
      this.isShow = false
    },
    open(params) {
      this.resetState()
      this.params = params
      this.isShow = true
      Object.entries(params).forEach(param => {
        if (typeof param[1] == typeof this.dialog[param[0]]) {
          this.dialog[param[0]] = param[1]
        }
      })
    }
  },
  mounted() {
    events.$on('open', this.open)
  }
}
export default Component
</script>

我在组件上调用它的方式如下

reset() {
      this.$confirm({
        message: "Reset the form ?",
        callback: async (confirm) => {
          if (confirm) {
            localStorage.removeItem("formWorks")
          }
        }
      })
    },

我试着像下面这样测试它，但没有运气

beforeEach(async () => {
  wrapper = shallowMount(New, { 
    mocks: {
      $confirm: jest.fn().mockReturnValue(true)
    } 
  })
})

it("resets formWorks)", async () => {
  wrapper.vm.reset()
})

您将要使用：

beforeach（异步（）=>{
包装器=浅装（新，{
模拟：{
$confirm:jest.fn（）.mockImplementation（（{callback}）=>callback（true））
} 
})
})

我预计您会遇到一些回调异步的问题，所以这是需要注意的

beforeEach(async () => {
  wrapper = shallowMount(New, { 
    mocks: {
      $confirm: jest.fn().mockReturnValue(true)
    } 
  })
})

it("resets formWorks)", async () => {
  wrapper.vm.reset()
})