问题标签 [vue-test-utils]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
142 浏览

javascript - 无法在子组件上触发请求

我正在尝试添加一个可以检查从vue-upload-component发送的请求的测试。

单击“上传文件”按钮时发送请求,问题是我模拟它时没有触发它。

通常我会这样做(使用Jestand vue-test-utils):

当我有一个绑定到 @click 事件的 axios 调用时,它适用于一个简单的情况,但是 vue-upload-component 的内部逻辑更复杂,可能因为这种方法不起作用:

0 投票
5 回答
6896 浏览

unit-testing - 如何使用 Vue Test Utils 测试全局事件总线?

我正在尝试学习如何测试通过全局事件总线发出的事件。这是代码,在我不知道该怎么做的地方有一些注释。

所以,我的疑问是如何测试全局事件总线是否在使用该事件总线的组件内部发出和监听事件。

那么,是否可以使用 Vue Test Utils 测试全局事件总线,或者我应该使用另一种方法?

0 投票
2 回答
721 浏览

d3.js - 挂载方法中的 DOM 修改不在 JEST 快照中

我有一个 Vue 组件和内部mounted方法我有这个:

我正在使用jestand测试这个组件vue-test-util

我的测试如下所示:

当它第一次运行时,正如预期的那样,它会创建快照。在这个快照中,我有svg正确设置所有属性(宽度、高度、视图框、样式)的父元素。但是,该g.chart元素不包含任何属性(它应该包含transform)。之后,mounted 方法使用 D3 语法创建了一堆其他元素(我没有在这里粘贴它们)......这些都没有进入快照。

所以我的问题是会发生什么this.svg = this.el.select('svg')...阻止正确创建快照以及如何解决这个问题。

我试过了nextTick,安装jest.useFakeTimers()shallow没有什么能满足我的需求。

谢谢

0 投票
2 回答
12098 浏览

javascript - Vue-test-utils:在单个测试中多次使用 $nextTick

我正在编写单元测试以vuelidate在我的组件中进行验证。我发现该$touch()方法是异步调用的,所以我需要$nextTick()使用expect(). 当我需要两个nextTick()s两个时出现问题expect()s

如何在不将其拆分为两个单独的测试的情况下运行此测试?我认为嵌套$nextTick()可能会起作用,但对于更多的测试来说它并不灵活。

0 投票
1 回答
4924 浏览

unit-testing - 如何开玩笑地模拟 i18next 模块

我正在为现有的 Vue 项目设置测试环境,我决定用 vue-test-utils 开玩笑。

一切都已安装并到位,但是当我导入组件时,我希望在 .test.js 文件中进行测试,并将组件添加到测试工具中,如下所示:

let wrapper = shallow(Home)

测试套件因错误而崩溃:TypeError: Cannot read property 'i18next' of undefined.

我决定模拟 i18next 模块,但我在模拟时遇到了问题。我的模拟看起来像这样:

但我总是得到错误:

可以以某种方式解释模拟 i18next 模块的正确方法,以便我的包装器对象可以初始化吗?另外,如果我做错了什么,请指出我正确的方向。下面是完整的测试用例:

谢谢。

0 投票
4 回答
18140 浏览

vue.js - VueJS - 使用 vue-test-utils 进行单元测试会出错 - TypeError: _vm.$t is not a function

相对较新的 Vuejs 和测试它的组件。使用 vue-test-utils 和 jest 进行测试。获取以下错误 测试日志

.vue 文件由模板、组件和样式组成。以下是出现错误的 SignupLayout.vue 部分 -

测试文件 -

对 $t 与 sass 有什么关系感到困惑。任何帮助,将不胜感激。现在在这里卡了一段时间。如果需要更多详细信息,请告诉我。提前致谢

0 投票
3 回答
3526 浏览

vue.js - 使用 element-ui 组件测试 Vue 组件

我有一个使用element-ui组件的组件。

树.vue

我想测试与组件的交互性(例如,能够单击其中一个el-treehtml 元素),但是当我vue-test-utils mount用来挂载Tree组件时,它不会呈现它的子组件,就像它shallow一样组件代替。

树.test.js

输出:

知道如何完全渲染Tree组件,包括它的子组件吗?

0 投票
1 回答
776 浏览

vuejs2 - 使用 Vue-Router 进行快照测试

我正在尝试在使用 Vue-cli 应用程序创建的 Vue 应用程序中运行 jest-snapshot 测试。当我测试其中包含路由器链接的组件时,我收到以下警告。

按照此处使用 View Router 进行单元测试的文档,我可以删除路由器链接,但这没有通过我的快照测试。有没有人遇到过这个问题?

0 投票
3 回答
19036 浏览

vue.js - 在调用 mount 之前,如何使用 Vue-Test-Utils 设置组件中的数据值?

我将 Jest 与 Vue-Test-Utils 一起使用。我一直在使用的代码如下所示:

在这个例子中,我想在调用挂载的生命周期之前设置 pageSize 值。上面代码的问题是我在测试运行时开始收到以下警告:

当我删除上面的数据属性时,警告消失了。

我是否正确设置数据?如果是这样,我应该如何处理警告?

我应该以另一种方式设置数据吗?

0 投票
0 回答
142 浏览

unit-testing - 如何在 vuex-loading 中使用单元测试

我想用使用 vuetify、vuex、vuex-loading 的异步操作编写单元测试,例如: File Navigation.vue:

文件导航.spec.js

此测试的结果: [Vue 警告]:config.errorHandler 中的错误:“TypeError:无法读取未定义的属性 'isLoading'”

请帮我解决这个问题。感谢您提供的任何帮助