对TypeScript库进行单元测试的方法


Posted in Javascript onJuly 18, 2019
原文发布于2017年7月,为保证能正常运行,其中部分命令进行了调整。

当时TypeScript版本为2.x,但依旧具有借鉴意义。

单元测试能限制你库中Bug的「生长」。随着编写的库越来越大,你不能总是手工测试每个特性。但你可以使用单元测试来测试每个特性,并且编写起来并不难。下面展示如何在Typescript中设置单元测试!

步骤1:安装用于单元测试的包

单元测试assert(推断)代码中一些属性。例如你有一个方法add(x,y),其应该正确地将xy相加,通过单元测试你可以进行如下测试assert(add(3,4)).equals(7)

一些用于单元测试的库提供了好用的assert方法来执行测试。我们这里使用了Mocha和Chai,通过如下命令进行安装:

npm i mocha @types/mocha chai @types/chai ts-node typescript --save-dev

步骤2:编写第一个单元测试

假设你有以下单元:

typescript-library/src/math.ts

export function add(x: number, y: number) {
 return x + y;
}

那对应的单元测试可能是这样的:

typescript-library/src/math.test.ts

import { add } from './math';

import * as mocha from 'mocha';
import * as chai from 'chai';

const expect = chai.expect;
describe('My math library', () => {

 it('should be able to add things correctly' , () => {
  expect(add(3,4)).to.equal(7);
 });

});

步骤3:运行单元测试

您可以使用以下命令运行测试:

./node_modules/mocha/bin/mocha --reporter spec --require ts-node/register src/**/*.test.ts

然后应该会在控制台中看到一个输出,如下所示:

对TypeScript库进行单元测试的方法

您可以将这个长命令放入package.json中转换成"scripts:{"test":"…"}"然后用npm test运行测试。也就是说此时的package.json应该是:

{
 "devDependencies": {
  "@types/chai": "^4.1.7",
  "@types/mocha": "^5.2.7",
  "chai": "^4.2.0",
  "ts-node": "^8.3.0",
  "mocha": "^6.1.4"
 },
 "scripts": {
  "test": "./node_modules/mocha/bin/mocha --reporter spec --require ts-node/register src/**/*.test.ts"
 }
}

如果您想运行单独的某个单元测试,可以用./node_modules/mocha/bin/mocha --reporter spec --grep "TestName" --require ts-node/register src/**/*.test.ts。“TestName”可以是任何的describe值,在本例中就如./node_modules/mocha/bin/mocha --reporter spec --grep "My math library" --require ts-node/register test/**/*.test.ts

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 按回车键相应按钮提交事件
Nov 02 Javascript
javascript中字符串替换函数replace()方法与c# 、vb 替换有一点不同
Jun 25 Javascript
jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果
Jun 27 Javascript
js实现div拖动动画运行轨迹效果代码分享
Aug 27 Javascript
jQuery实现鼠标滑过图片移动特效
Dec 08 Javascript
Bootstrap栅格系统的使用和理解2
Dec 14 Javascript
原生js实现水平方向无缝滚动
Jan 10 Javascript
js 实现获取name 相同的页面元素并循环遍历的方法
Feb 14 Javascript
几种响应式文字详解
May 19 Javascript
让你彻底掌握es6 Promise的八段代码
Jul 26 Javascript
js防刷新的倒计时代码 js倒计时代码
Sep 06 Javascript
在移动端使用vue-router和keep-alive的方法示例
Dec 02 Javascript
基于JS实现数字动态变化显示效果附源码
Jul 18 #Javascript
微信小程序实现拍照画布指定区域生成图片
Jul 18 #Javascript
vue使用video.js进行视频播放功能
Jul 18 #Javascript
百度小程序之间的页面通信过程详解
Jul 18 #Javascript
微信小程序如何获取群聊的openGid以及名称详解
Jul 17 #Javascript
vue+django实现一对一聊天功能的实例代码
Jul 17 #Javascript
微信小程序从注册账号到上架(图文详解)
Jul 17 #Javascript
You might like
2014过年倒计时示例
2014/01/31 PHP
图文详解phpstorm配置Xdebug进行调试PHP教程
2016/06/13 PHP
php使用json_decode后数字对象转换成了科学计数法的解决方法
2017/02/20 PHP
Thinkphp页面跳转设置跳转等待时间的操作
2019/10/16 PHP
javascript基础的动画教程,直观易懂
2007/01/10 Javascript
jQuery表格列宽可拖拽改变且兼容firfox
2014/09/03 Javascript
深入浅析JavaScript函数前面的加号和叹号
2016/07/09 Javascript
Three.js学习之文字形状及自定义形状
2016/08/01 Javascript
微信扫码支付零云插件版实例详解
2017/04/26 Javascript
详解Vue学习笔记进阶篇之列表过渡及其他
2017/07/17 Javascript
使用store来优化React组件的方法
2017/10/23 Javascript
解析Angular 2+ 样式绑定方式
2018/01/15 Javascript
vue.js+element 默认提示中英文操作
2020/11/11 Javascript
[06:25]第二届DOTA2亚洲邀请赛主赛事第二天比赛集锦.mp4
2017/04/03 DOTA
[38:32]完美世界DOTA2联赛循环赛 Forest vs DM 第二场 11.06
2020/11/06 DOTA
分享一下如何编写高效且优雅的 Python 代码
2017/09/07 Python
Python学习之用pygal画世界地图实例
2017/12/07 Python
python微信跳一跳游戏辅助代码解析
2018/01/29 Python
Python3之不使用第三方变量,实现交换两个变量的值
2019/06/26 Python
Tensorflow之MNIST CNN实现并保存、加载模型
2020/06/17 Python
python怎么对数字进行过滤
2020/07/05 Python
PyTorch 导数应用的使用教程
2020/08/31 Python
介绍CSS3使用技巧5个
2009/04/02 HTML / CSS
一款纯css3实现的非常实用的鼠标悬停特效演示
2014/11/05 HTML / CSS
纯CSS3实现自定义Tooltip边框涂鸦风格的教程
2014/11/05 HTML / CSS
中国最大的潮流商品购物网站:YOHO!BUY有货
2017/01/07 全球购物
英国赛车、汽车改装和摩托车零件购物网站:Demon Tweeks
2018/10/29 全球购物
岗位职责的含义
2013/11/17 职场文书
求职信范文怎么写
2014/01/29 职场文书
收银员的岗位职责范本
2014/02/04 职场文书
责任胜于能力演讲稿
2014/05/20 职场文书
教师学习八项规定六项禁令思想汇报
2014/09/27 职场文书
用人单位聘用意向书
2015/05/11 职场文书
婚礼必备主持词范本!
2019/07/23 职场文书
python之np.argmax()及对axis=0或者1的理解
2021/06/02 Python
SQL IDENTITY_INSERT作用案例详解
2021/08/23 MySQL