对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 相关文章推荐
ECMAScript 基础知识
Jun 29 Javascript
JavaScript开发规范要求(规范化代码)
Aug 16 Javascript
JavaScript 函数replace深入了解
Mar 14 Javascript
jQuery实现可拖动的浮动层完整代码
May 27 Javascript
深入理解javascript中的 “this”
Jan 17 Javascript
ReactNative短信验证码倒计时控件的实现代码
Jul 20 Javascript
详解Vue如何支持JSX语法
Nov 10 Javascript
webpack打包node.js后端项目的方法
Mar 10 Javascript
vue生成文件本地打开查看效果的实例
Sep 06 Javascript
原生JS实现的放大镜特效示例【测试可用】
Dec 08 Javascript
vue-router两种模式区别及使用注意事项详解
Aug 01 Javascript
JavaScript enum枚举类型定义及使用方法
May 15 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
用缓存实现静态页面的测试
2006/12/06 PHP
实用函数9
2007/11/08 PHP
php单一接口的实现方法
2015/06/20 PHP
基于CakePHP实现的简单博客系统实例
2015/06/28 PHP
thinkPHP多域名情况下使用memcache方式共享session数据的实现方法
2016/07/21 PHP
thinkPHP多语言切换设置方法详解
2016/11/11 PHP
Thinkphp3.2实用篇之计算型验证码示例
2017/02/09 PHP
PHP递归的三种常用方式
2019/02/28 PHP
2012年开发人员的16款新鲜的jquery插件体验分享
2012/12/28 Javascript
Extjs NumberField后面加单位实现思路
2013/07/30 Javascript
jquery+javascript编写国籍控件
2015/02/12 Javascript
jquery 全选、全不选、反选效果的实现代码【推荐】
2016/05/05 Javascript
jQuery序列化表单成对象的简单实现
2016/11/29 Javascript
Vue.js添加组件操作示例
2018/06/13 Javascript
详解离线安装npm包的几种方法
2018/11/25 Javascript
js模拟F11页面全屏显示
2019/09/17 Javascript
JS简单表单验证功能完整示例
2020/01/26 Javascript
[46:50]Liquid vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python实现带验证码网站的自动登陆实现代码
2015/01/12 Python
利用Python查看目录中的文件示例详解
2017/08/28 Python
Python实现处理逆波兰表达式示例
2018/07/30 Python
使用django的ORM框架按月统计近一年内的数据方法
2019/07/18 Python
关于阿里云oss获取sts凭证 app直传 python的实例
2019/08/20 Python
python rsa实现数据加密和解密、签名加密和验签功能
2019/09/18 Python
css3 中translate和transition的使用方法
2020/03/26 HTML / CSS
解决HTML5中的audio在手机端和微信端的不能自动播放问题
2019/11/04 HTML / CSS
英国人最爱的饰品网站:Accessorize
2016/08/22 全球购物
美国指甲油品牌:Deco Miami
2017/01/30 全球购物
世界上第一个创建了罩杯系统的美国内衣品牌:Maidenform
2019/03/23 全球购物
公司薪酬管理制度
2014/01/31 职场文书
大学新生入学感想
2015/08/07 职场文书
人民调解协议书
2016/03/21 职场文书
MYSQL(电话号码,身份证)数据脱敏的实现
2021/05/28 MySQL
解析目标检测之IoU
2021/06/26 Python
关于springboot配置druid数据源不生效问题(踩坑记)
2021/09/25 Java/Android
Navicat Premium自定义 sql 标签的创建方式
2022/09/23 数据库