如何测试 bootstrap-vue 吐司答案

【问题标题】：How do I test bootstrap-vue toasts如何测试 bootstrap-vue 吐司
【发布时间】：2021-08-09 11:08:15
【问题描述】：

我被指示断言我们的错误已在 bootstrap-vue toasts 中浮出水面。我怎么能断言我的测试已经成功了。我希望模拟出“this.$bvToast.toast”，但到目前为止我一直找不到任何显着的东西。

【问题讨论】：

【解决方案1】：

我偶然发现了同样的问题，我解决它的方法是将 this.$bvToast.toast() 包裹在组件方法 showToast() 周围：

// component

{
   ...
   showToast(title: string, content: string) {
      this.$bvToast.toast(
         content,
         {
            title,
            ...
         }
      }
  }
}

然后，在我的 jest 文件中，我只使用一个 spy 并确保参数是我所期望的

// component.spec

const mySpy = jest.spyOn(myComponent, 'showToast');
...
your code here
...
expect(mySpy).toHaveBeenCalledWith(expectedTitle, expectedContent)

当然，这不会测试 bootstrap-vue toast 组件中的实际文本，但这也违背了单元测试的目的：您假设 toast 可以正常工作:)

【讨论】：