vue中jest单元测试使用功能初探

最新推荐文章于 2024-04-12 09:59:24 发布
最新推荐文章于 2024-04-12 09:59:24 发布
阅读量502 收藏 1
点赞数
分类专栏： Vue 文章标签： 单元测试 vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45745641/article/details/125805327
版权

安装jest

在使用脚手架创建vue项目的时候，我们可以选择使用jest单元测试

  1. 勾选使用单元测试
    在这里插入图片描述
    2.目录中会生成 example.spec.js 文件，也就是jest单元测试的文件

在这里插入图片描述

使用实例

这里循环出来了三个a标签

在这里插入图片描述
下面在jest单元测试中进行测试

在这里插入图片描述
如图这里是在jest配置文件中，这段单元测试的代码意思是找到a标签，看它是否有三个
使用 yarn jest 命令进行启动单元测试
在这里插入图片描述
如图所示运行的测试结果没有问题

我现在把a标签删除再来测试

在这里插入图片描述
可以看到测试不通过，并且反馈了比较详细直观的错误提示

今天给大家介绍了jest单元测试简单的功能使用方法，后面还会给大家继续带来相关的内容

Beiyux
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
vue-自动化测试框架JEST和CYRPESS
weixin_42855188的博客
07-25 1790
大部分企业为了追求开发效率，所以并没有去强制要求员工写前端自动化测试的代码。将已测试过的单元测试函数进行组合集成暴露出的高层函数或类的封装，对这些函数或类进行的测试。单元测试是指对程序中最小可测试单元进行的测试，例如测试一个函数、一个模块、一个组件…（1）根目录/src/component/ZTest/index.vue。（2）根目录/tests/unit/ZTest.spec.js。强迫开发者编写更容易被测试的代码，提高代码质量。编写的测试有文档的作用，方便维护。不方便迭代，代码重构困难。........
前端自动化测试（二）Vue Test Utils + Jest
JarryNeverGiveup的博客
03-03 2860
单元测试（unit testing），是指对软件中的最小可测试单元进行检查和验证，通常是针对函数、模块、对象进行测试，但在前端应用中组件也是被测单元，对于代码中多个组件共用的工具类库、多个组件共用的子组件应尽可能提高覆盖率。
vue-jest vue3
vue+iview 动态渲染表格（vue.js结合iview插件）
11-24 875
vue3 jest
探索 Vue.js 的测试利器: Vue-Jest
最新发布
gitblog_00018的博客
04-12 377
探索 Vue.js 的测试利器: Vue-Jest 项目地址:https://gitcode.com/vuejs/vue-jest 在前端开发领域，测试是确保代码质量与应用稳定性的关键步骤。Vue.js，作为一款流行的渐进式JavaScript框架，提供了丰富的生态以支持各种开发需求，其中包括Vue-Jest，它是针对Vue组件进行单元测试的强大工具。本文将深入探讨Vue-Jest的功能、技术特性...
vue项目整合jest单元测试
A_bad_boy_hahaha的博客
10-20 641
【代码】vue项目整合jest单元测试。
前端自动化测试（一）Vue Test Utils + Jest
JarryNeverGiveup的博客
10-31 1763
Vue Test Utils：vue+jest前端单元测试，已有项目集成jest，包含jest.config.js文件的详细配置。
详解使用jest对vue项目进行单元测试
10-18
主要介绍了详解使用jest对vue项目进行单元测试，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue项目使用Jest测试入门.docx
12-24
"Vue 项目使用 Jest 测试入门" 本文将为您介绍如何使用 Jest 进行 Vue 项目测试。Jest 是一个由 Facebook ...Jest 的优势在于其快照测试功能、安装配置简单、测试覆盖率工具和断言库，非常适合 Vue 项目的单元测试。
如何为vue的项目添加单元测试
10-17
主要介绍了如何为vue的项目添加单元测试，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
使用Karma做vue组件单元测试的实现
10-15
在开发Vue应用时，进行...通过这样的流程，我们可以有效地进行Vue组件的单元测试，确保每个组件的功能都能正常工作，并且在修改代码后能及时发现潜在问题。这不仅可以提高代码质量，也有助于团队协作和项目的长期维护。
vue+jest 单元测试配置+用例
weixin_42459543的博客
03-02 1938
前端vue项目工程单元测试jest
Vue Test Utils/Jest单元测试
qq_37214137的博客
03-14 2351
Jest是Facebook开源的一套JavaScript测试框架， 它集成了断言、JSDom、覆盖率报告等开发者所需要的所有测试工具。
vue单元测试vue test utils使用初探
weixin_34008933的博客
04-04 5528
简介 最近在做一个项目的重构，技术选型为vue-cli 3.0 + typescript + vue-router + sass.因为我负责的模块比较少比较简单，所以老大让我先把负责部分的测试代码写好。至此我才第一次接触到测试代码，我们项目使用的测试工具是jest，与vue官方出的单元测试工具库vue-test-utils配合使用。第一次接触测试代码，开始的时候还是一脸懵逼，有种学习一门新语言的赶...
VUE+jtest的组件单元测试
weixin_34395205的博客
01-18 2033
会议讨论结构 代码测试用于基础组件库，类似于element 业务层的测试可以对部分需要长期维护的代码进行测试 VUE的脚手架本身自带单元测试功能，可以选择karma和jtest两种，本文主要是测试了两种方式的不同。在讲到前端测试的时候我们需要区分以下两种测试概念： e2e测试：测试一个应用从头到尾的流程是否和设计时候所想的一样。简而言之，它从一个用户的角度出发，认为整个系统都是一个黑箱，只有...
JS（Vue）数据处理实战（二）
张兴华的博客
07-12 354
有如下需求： 将数据通过表格展示。 数据： result: { BIOS: { Passed: 16, Failed: 2, Not Run: 61, In Progress: 3, No checkpoint: 1 }, BMC: { Not Run: 30, Passed: 27, In Progress: 1, No checkpoint: 1 ...
Day156/200 Vue3+AntDesign+Jest 安装一直报错，记录下
xinghuowuzhao的博客
09-27 499
前言 在项目中，各种资料查了好多，搞了3天，最终解决了，记录一些踩过的坑，希望对后来人有所启发。 （一）正确配置 1、jest.config.js module.exports = { preset: '@vue/cli-plugin-unit-jest', transform: { ".*\\.(vue)$": "<rootDir>/node_modules/vue-jest" }, } 2、babel.config.js module.exports
vue2项目，踩坑Jest单元测试
「 虚幻私塾」
03-02 2406
Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/course/detail/35475 目前的项目已经维护了挺久，由于客户要求，我们要为项目加上单元测试，挑选一番后选择了Jest（配置简便，开箱即用），下面记录了此次为项目添加Jest作为单元测试的经历。 安装Jest 在项目目录下，执行命令vue add @vue/cli-plugin-unit-jest，这个
前端单元测试入门（Jest）
多啦的博客
05-04 4589
开始 Jest是由Facebook发布的开源的、基于Jasmine的Javascript的单元测试框架。官方文档在这里。 安装： npm install --save-dev jest 然后创建一个sum.js文件，输出一个方法： function sum(a, b) { return a + b; } module.exports = sum; 然后，创建一个名为sum....
使用jest测试vue+elementUI项目
twmay006的博客
01-23 6326
使用jest测试vue+elementUI项目 因为在网上都没有完整的流程，资料也很少，开始的时候踩过很多坑，所以写一些东西记录一下，有问题也可以提出来一起讨论。下面的内容是本人做单元测试时学到的以及遇到的问题，测试还没做完，后面会不定时更新。 参考资料 Vue Test Utils 是 Vue.js 官方的单元测试实用工具库。 jest 使用文档 安装需要的依赖 npm instal...
vue jest单元测试Demo
01-23
以下是一个Vue.js项目中使用Jest进行单元测试的示例： 首先，确保你已经安装了Vue CLI和Jest。然后，按照以下步骤进行操作： 1. 在项目根目录下创建一个名为`tests`的文件夹。 2. 在`tests`文件夹中创建一个名为`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Beiyux

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值