一分钟食用前端测试框架Jest

                                                 

安装

其实食用Jest是很简单的,我们只需要安装Jest即可

npm install --save-dev jestyarn add --dev jestpnpm add --save-dev jest

ESmodule

本身来说,Jest是不支持Esmodule的,他支持CommonJS,我们需要Babel改一下

npm i --save-dev babel-jest @babel/core @babel/preset-env

然后创建.babel.rc或babel.config.js,编写以下代码

module.exports = {// 智能预设,编译ES6语法presets: [["@babel/preset-env",{targets: {"node": "current",}}],],
};

就可以使用ESmodule语法了 

代码

然后,我们就可以编写你需要测试的代码了

例如我们自己编写一个main文件,包含几个函数,两个数的加减乘除等,然后测试看看会不会通过

const add = function (a, b) {return a + b;
}const minus = function (a, b) {return a - b;
}
const multiply = function (a, b) {return a * b
}
const divide = function (a, b) {return a / b
}export {add,minus,multiply,divide,
}

我们写了几个函数,并暴露出了相应的方法

测试

编写文件main.test.js,并编写测试代码

import {add, minus, multiply, divide} from "./main";// 测试加法
test('adds 1 + 2 to equal 3', () => {expect(add(1, 2)).toBe(3);
});// 测试减法
test('minus 2 - 1 to equal 1', () => {expect(minus(2, 1)).toBe(1);
});// 测试乘法
test('multiply 1 * 2 to equal 2', () => {expect(multiply(1, 2)).toBe(2);
});// 测试除法
test('divide 2 / 2 to equal 1', () => {expect(divide(2, 2)).toBe(1);
});

这里说明一下

test是我们的Jest 的测试函数,表明我们要测试了,接收两个参数,一个是desc(说明描述),一个是fn(回调函数)

expect是断言,意思就是,我们认为,觉得。它接收一个fn为参数

toBe是我们的匹配器,表明类似于===号的作用,带类型匹配的相等,他会拿着你的函数的结果去和toBe参数比较呢,其他的会一一解释好多的匹配器呢,请先这样看着一下

最后我们在package.json文件中,编写脚本

  "scripts": {"test": "jest","testw": "jest --watchAll"},

test是表明,我们进行测试

testw 是表明我们要实时监视所有的测试文件,自动运行测试,并给出结果

                                                

结果

运行脚本

npm run test

呐,并没有错误呢

错误

假如我们写一个错误呢?

这里的最后一个divide函数,我们传递的参数是2/2,tobe也就是说,我们期望结果是3,但是函数的返回值会是2/2=1,与3不匹配,所以会报错的

// 测试除法
test('divide 2 / 2 to equal 1', () => {expect(divide(2, 2)).toBe(3);
});

呐,你看,遇到红的了吧,不用急,我们只要一步一步分析,红的再多我也不怕

他的意思是,我们测试了你的最后一个,错误了,期望值是3,但是收到的测试的值却是1,所以不对

我们只需要改回来即可

                                                 

最后

Jest,其实来说,并不困难的,我会天天更新,一起学习吧,加油

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/62299.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL中的ROW_NUMBER窗口函数简单了解下

ROW_NUMBER() 是 MySQL8引入的窗口函数之一,它为查询结果集中的每一行分配一个唯一的顺序号(行号)。这个顺序号是基于窗口函数的 ORDER BY 子句进行排序的,可以根据指定的排序顺序生成连续的整数值。 ROW_NUMBER() 在分页、去重、…

从 App Search 到 Elasticsearch — 挖掘搜索的未来

作者:来自 Elastic Nick Chow App Search 将在 9.0 版本中停用,但 Elasticsearch 拥有你构建强大的 AI 搜索体验所需的一切。以下是你需要了解的内容。 生成式人工智能的最新进展正在改变用户行为,激励开发人员创造更具活力、更直观、更引人入…

CTF之密码学(费纳姆密码)

一、作为二进制替换密码的费纳姆密码 定义:费纳姆密码是一种由二进制产生的替换密码,也被称为弗纳姆密码(Vernam cipher)。它采用二进制表示法,将明文转化为二进制数字,并通过与密钥进行模2加法运算来产生密…

若依框架部署在网站一个子目录下(/admin)问题(

部署在子目录下首先修改vue.config.js文件: 问题一:登陆之后跳转到了404页面问题,解决办法如下: src/router/index.js 把404页面直接变成了首页(大佬有啥优雅的解决办法求告知) 问题二:退出登录…

【贪心算法第六弹——334.递增的三元子序列(easy)】

目录 1.题目解析 题目来源 测试用例 2.算法原理 3.实战代码 代码解析 本题属于最长递增子序列的简化版本,只需要判断能不能组成三位的递增子序列即可,建议先去看博主的另一篇博客可以更好的理解本篇博客:300.最长递增子序列 1.题目解析…

c++(斗罗大陆)

这次&#xff0c;作者编了斗罗大陆的武魂、魂力等级&#xff0c;目前只写到了11级 #include<iostream> #include<conio.h> #include<windows.h> #include<stdlib.h> #include<stdio.h> #include<time.h> #include<strin…

Perl编程语言简介

文章目录 前言基础语法一. 变量1. 标量2. 数组3. 哈希 二. 控制结构1. 条件语句2. 循环语句 三. 自定义函数与作用域四. 文件读写五. 正则表达式1. 模式匹配2. 替换 六. 模块和包七. 面向对象的编程 总结 前言 Perl&#xff08;Practical Extraction and Report Language&…

《TCP/IP网络编程》学习笔记 | Chapter 16:关于 I/O 流分离的其他内容

《TCP/IP网络编程》学习笔记 | Chapter 16&#xff1a;关于 I/O 流分离的其他内容 《TCP/IP网络编程》学习笔记 | Chapter 16&#xff1a;关于 I/O 流分离的其他内容分离 I/O 流2 次 I/O 流分离分离「流」的好处「流」分离带来的 EOF 问题 文件描述符的的复制和半关闭终止「流」…

LeetCode数组题

参考链接 代码随想录 讲解视频链接 数组题 1、(两数之和)给定一个整数数组 nums 和一个整数目标值 target&#xff0c;请你在该数组中找出 和为目标值 target 的那 两个 整数&#xff0c;并返回它们的数组下标。你可以假设每种输入只会对应一个答案&#xff0c;并且你不能使用…

Unity-Lightmap入门篇

&#xff1a;&#xff1a;这是一个实战文章&#xff0c;并没有知识分享&#xff0c;或理论知识&#xff1b;完全没有 关键字&#xff1a; “lightmap","全局光照”&#xff0c;“light Probe" (会混合一些中英文搜索&#xff0c;或者全英文搜索&#xff09; …

海康VsionMaster学习笔记(学习工具+思路)

一、前言 VisionMaster算法平台集成机器视觉多种算法组件&#xff0c;适用多种应用场景&#xff0c;可快速组合算法&#xff0c;实现对工件或被测物的查找测量与缺陷检测等。VM算法平台依托海康威视在图像领域多年的技术积淀&#xff0c;自带强大的视觉分析工具库&#xff0c;可…

Python双向链表、循环链表、栈

一、双向链表 1.作用 双向链表也叫双面链表。 对于单向链表而言。只能通过头节点或者第一个节点出发&#xff0c;单向的访问后继节点&#xff0c;每个节点只能记录其后继节点的信息&#xff08;位置&#xff09;&#xff0c;不能向前遍历。 所以引入双向链表&#xff0c;双…

爬虫技术深度解析:XPath与CSS选择器的结合优势

在现代网络爬虫技术中&#xff0c;数据提取的准确性和效率至关重要。XPath和CSS选择器作为两种主流的元素定位工具&#xff0c;在爬虫领域中扮演着重要角色。本文将深入探讨XPath和CSS选择器在爬虫中的结合优势&#xff0c;并提供详细的代码示例&#xff0c;以帮助开发者更好地…

linux安全管理-防火墙配置

1. 开启系统防火墙 1、检查内容 检查操作系统是否开启防火墙&#xff1b; 2、配置要求 操作系统开启防火墙&#xff1b; 3、配置方法 systemctl status firewalld ##查看系统防火墙运行状态 systemctl start firewalld ##启动防火墙 systemctl restart firewalld ##重启防火墙…

【数据结构笔记】习题

渐进分析 【2010-THU-Mid】f(n) O(g(n))&#xff0c;当且仅当g(n) Ω(f(n))。&#xff08;√&#xff09; 【2010-THU-Mid】若f(n) O(n^2)且g(n) O(n)&#xff0c;则以下结论正确的是&#xff08;AD&#xff09; A. f(n) g(n) O(n^2) B. f(n) / g(n) O(n) C. g(n) O(f(…

Python 中的装饰器是什么?

装饰器是Python中一种非常强大的功能&#xff0c;它允许你在不修改原始函数代码的前提下&#xff0c;增加额外的功能或改变函数的行为。 装饰器本质上是一个接受函数作为参数的函数&#xff0c;并返回一个新的函数。 通过装饰器&#xff0c;我们可以轻松地实现诸如日志记录、…

ES实用面试题

一、es是什么&#xff0c;为什么要用它&#xff1f; ES通常是Elasticsearch的简称&#xff0c;它是一个基于Lucene构建的开源搜索引擎。Elasticsearch以其分布式、高扩展性和实时数据分析能力而闻名&#xff0c;广泛用于全文搜索、日志分析、实时监控等多种场景。 基本特点&am…

适用于学校、医院等低压用电场所的智能安全配电装置

引言 电力&#xff0c;作为一种清洁且高效的能源&#xff0c;极大地促进了现代生活的便捷与舒适。然而&#xff0c;与此同时&#xff0c;因使用不当或维护缺失等问题&#xff0c;漏电、触电事件以及电气火灾频发&#xff0c;对人们的生命安全和财产安全构成了严重威胁&#xf…

Java开发中对List<Map<String, Object>>集合去重并按大小拆分子列表

Java开发中对List< Map< String, Object > >集合去重并按大小拆分子列表 一、使用场景二、实现步骤三、相关知识四、代码示例 一、使用场景 在处理大量List<Map<String, Object>>集合的数据时&#xff0c;为确保数据的唯一性&#xff0c;需要先根据Ma…

智能桥梁安全运行监测系统守护桥梁安全卫士

一、方案背景 桥梁作为交通基础设施中不可或缺的重要组成部分&#xff0c;其安全稳定的运行直接关联到广大人民群众的生命财产安全以及整个社会的稳定与和谐。桥梁不仅是连接两地的通道&#xff0c;更是经济发展和社会进步的重要纽带。为了确保桥梁的安全运行&#xff0c;桥梁安…