问题标签 [vue-test-utils]

当我在使用vee-validate的组件上运行测试时，我遇到了这个奇怪的错误。更奇怪的是，当我实际在该组件中使用时，它并没有发生this.errors（即使 putconsole.log(this.errors)正在使它消失）。

测试代码：

输出yarn test:unit：

它来自node_modules/vue/dist/vue.runtime.common.js第 1739 行和第 589 行。

添加到测试组件后：

错误消失了！为什么会出现错误？如果不使用，Vue 是否会清除 vee-validate？（this.errors是 vee-validate 添加的 ErrorBag）。{{ errors }}不过，如果我添加到模板中也无济于事。

我像这样注入 vee-validate：

我目前正忙于用 jest 对 vue 组件的路由行为进行单元测试。离开组件时，Vue-router 的 'beforeRouteLeave' 导航守卫会运行一些逻辑。这个守卫在我的生产中运行的应用程序中被调用，但是当我尝试测试它时不会被调用。

我使用 jest 作为测试框架和 vue-test-utils 来挂载我的组件并使用 vue-router 设置本地 Vue 实例。

在这里您可以找到一个最小的工作示例（在 'src/components/HelloWorld.spec' 中测试）：

https://codesandbox.io/s/72536ojvp6?module=%2Fsrc%2Fcomponents%2FHelloWorld.spec.js

为什么没有调用路由器挂钩，我怎样才能让它工作？提前致谢！

问题

我正在使用带有 Mocha 和 Chai 的 Vue 2.4 进行单元测试。在执行组件测试时，每个测试的执行时间都比之前的测试长。

期待

即每次调用shallow/shallowMount耗时不超过 200ms。

文件

package.json

为了尽可能轻松地设置组件测试，我们使用了一个夹具类 ( VueComponentTestFixture)：

测试文件示例：

这是执行测试时的输出（夹具中的时间测量）：

可以看出buildWrapper每次测试“叠加”所消耗的时间。我用beta-14of vue-test-utilsas 也试过了beta-20，结果相同。

我认为组件本身并不重要。当仅单独执行每个组件的测试时也会发生这种情况。但如果有必要，请告诉我。

我有一个包含以下内容的模板

登录功能很长，但由

我尝试在设置后测试单击登录按钮

但最终变得不确定。我使用 vuejs 测试工具来查找（'#allogin'），但结果仍然相同。卡住

我在使用 jest 进行网络应用单元测试，但遇到了一个棘手的问题。我在一个test.spec.js文件中导入了一个组件，这个组件从另一个文件中导入了一个http请求函数，这个http请求函数使用了我在vuex状态中定义的var，而这个状态数据使用了window对象，导致测试文件错误。这是一些代码。

test.spec.js：导入一个名为 Info.vue 的组件

Info.vue:requestData导入一个 http 请求函数get-api-data.js

get-api-data.js:导入 store(vuex) 数据 import store from '@/store'

商店有那些涉及窗口对象的变量：

并且测试套件无法运行。这是错误：

介绍：

我想测试一下，如果我点击提交按钮，就会调用 onSubmit 函数。根据我阅读文档时的理解，我认为这是可能的：

1. https://sinonjs.org/releases/v6.1.5/spies/
2. https://vue-test-utils.vuejs.org/guides/#testing-key-mouse-and-other-dom-events

预期输出：

• 让测试运行并告诉我通过或失败

实际输出：

• 没有，我目前陷入以下困境：

语境：

在我的测试中：

import NavBar from '@/components/layout/NavBar.vue'

在该组件中，我有一个（此处为简化版本）表单：

<b-nav-form @submit="onSubmit"> <b-form-input /> <b-button type="submit">Search</b-button> </b-nav-form>

我想测试一下，如果我点击提交按钮，就会调用 onSubmit 函数。

我的设置是 Vue、BootstrapVue 和 Sinon。我知道我必须设置一个监听被调用函数的间谍。

如果有帮助，这是我组件中的实际脚本：

我理解的例子：

但这与例如单击表单中的按钮无关。

请指教

方法一：

和方法二：

这两种方法都不适合我。我收到一个错误：在开发环境和 CodeSandbox 上无法读取未定义的属性 'props'。 https://codesandbox.io/s/4031x2r769

如何正确模拟生命周期钩子？

零件：

如何访问 div.in-slot 并测试他的文本？

我的单元测试有一个有趣的问题。我的单元测试是为了单击组件内的按钮而编写的。这个按钮调用一个组件方法，该方法包含一个类的实例Service（axios 的包装类）。这个组件方法唯一做的就是调用Service.requestPasswordReset(). 我的单元测试需要验证是否Service.requestPasswordReset被调用。

我知道我正确地模拟了我的服务类，因为这通过了我的单元测试：

而且我知道我在单击时正确调用了该方法，因为这通过了我的单元测试：

我只是无法让我的测试注册该Service方法被调用。有任何想法吗？

零件

服务.js

Service.js 中__mock__

单元测试

使用 vue-cli 3 ，我开始学习用 Jest 进行单元测试

我为我的初始标题组件编写了我的第一个规范

但我在 y 组件 (??,) 中遇到语法错误

无效或意外的令牌

我不明白为什么......（我正在关注octo 谈话中的小 tut

这是我的组件

更新

这是完整的 console.log 错误输出