前情提要

在上一篇文章《【Mocha.js 101】Mocha 入门指南》中,我们提到了如何用 Mocha.js 进行前端自动化测试,并做了几个简单的例子来体验 Mocha.js 给我们带来的便利。

在本篇文章中,我们将了解到 Mocha.js 的同步/异步测试,以及如何测试 Promise。

同步代码测试

在上一篇文章中,其实我们已经学会了如何测试同步代码。今天,我们 BDD 风格编写一个测试:

var should     = require( 'should' );
var Calculator = require( '../../src/chapter0/Calculator' ); // 描述 Calculator 的行为
describe( 'Calculator', function () { // 描述 Calculator.add 方法的行为
describe( '#add', function () { // 1 + 2 = 3 的行为
it( '1 + 2 = 3', function () {
Calculator.add( 1, 2 ).should.equal( 3 );
} ); // 2 - 1 = 1 的行为
it( '2 - 1 = 1', function () {
Calculator.minus( 2, 1 ).should.equal( 1 );
} );
} );
} );

在上一篇文章中,我们已经介绍过常用的断言库,Should.js 就是其中之一。上述代码中,便使用 Should.js 实现了 BDD 风格的断言。

接下来,我们执行测试:

$ mocha test/chapter1/synchronous.js

我们将会看到如下输出:

  Calculator
#add
✓ 1 + 2 = 3
✓ 2 - 1 = 1 2 passing (9ms)

异步代码(回调)测试

说道 JavaScript,必然少不了回调函数。从前端 Ajax 通信,到 Node.js 异步数据访问,回调函数贯穿了整个 JavaScript 生命周期。

那么,我们如何对回调式的方法进行测试呢?首先,我们先编写一个模拟业务逻辑类。创建 src/chapter1/Ajax.js ,并填入一些桩代码:

var Ajax = {
load: function ( url, callback ) {
callback.call( this, url );
}
}; module.exports = Ajax;

上述代码模拟了 Ajax 异步调用。调用 load 函数,传入请求 URL 和成功回调函数,来模拟 Ajax 的异步请求。

接下来,我们来为上面的代码编写测试。Mocha.js 能够很轻松的实现异步方法的测试,我们只需要在 it  方法中加上 done 形参即可。

我们创建 test/chapter1/asynchronous.js 文件,并加入测试代码:

var should = require( 'should' );
var Ajax = require( '../../src/chapter1/Ajax' ); // 描述 'Ajax' 的行为
describe( 'Ajax', function () { // 描述 'Ajax.load()' 方法的行为.
describe( '#load()', function () { // 加载成功后执行回调函数, 获取结果.
it( 'should return the load result.', function ( done ) {
Ajax.load( 'url', function ( result ) {
result.should.equal( 'url' );
done();
} );
} );
} )
} );

代码 11 行定义了形式参数 done ,Mocha.js 将会检测是否定义了形参,如果定义了形参,则将会等待形参调用。

代码 14 行调用了 done() ,即表示测试执行成功,Mocha.js 将会输出成功结果。

下面,我们执行这个测试来看看:

mocha test/chapter1/asynchronous.js

将会得到如下输出结果:

  Ajax
#load()
✓ should return the load result. 1 passing (9ms)

Promise 测试

由于 ES 2015 的推行,Promise 成为了各大框架不可或缺的一部分。Promise 的出现让一个个嵌套的回调函数变得竟然有序,为 JavaScript 扛起了异步处理的新旗帜。(本文并不主要介绍 Promise,所以相关内容可以去查看阅读扩展部分)

就像回调函数测试一样,Mocha.js 对 Promise 测试支持非常简单:只需要返回一个 Promise 对象即可。

同样,我们先来创建业务逻辑代码:

var DB = {
save: function ( object ) {
return new Promise( function ( resolve, reject ) {
resolve();
} );
}
}; module.exports = DB;

上述代码模拟了数据库操作,在保存方法中,返回一个 Promise,来实现异步存储。

接下来,我们创建 test/chapter1/promise.js 文件,来编写测试代码:

var should = require( 'should' );
var DB = require( '../../src/chapter1/DB' ); // 描述 'DB' 的行为
describe( 'DB', function () { // 描述 'DB.save()' 方法的行为.
describe( '#save()', function () { // 保存成功后执行 Promise.then
it( 'save without error.', function () {
return DB.save( 'test' );
} );
} )
} );

12 行直接将 save 方法返回的 Promise 对象返回给 Mocha.js。Mocha.js 将会根据 Promise 的结果,来裁决测试是否成功。

如果 Promise resolve:

  DB
#save()
✓ save without error. 1 passing (8ms)

如果 Promise reject:

  DB
#save()
1) save without error. 0 passing (10ms)
1 failing 1) DB #save() save without error.:
Error: Promise rejected with no or falsy reason

总结

本文介绍了 Mocha.js 同步、异步,以及 Promise 的测试方法。Mocha.js 是一个非常优秀的框架,其对回调函数、Promise 的支持,让我们能够很轻松的实现异步代码的自动化测试。

下一篇文章中,我们将会对 Mocha.js 的 Hooks(钩子) 进行介绍,欢迎大家继续关注~


本文以 CC BY-NC-SA 3.0 CN 协议共享,转载、共享及二次创作时请保留原文出处及链接,请勿用于商业用途。

本文链接:http://litecodes.com/dev/frontend/mocha-101-sync-async-and-promise/

Cnblogs 同步更新我的原始博客。

【Mocha.js 101】同步、异步与 Promise的更多相关文章

  1. 【Mocha.js 101】钩子函数

    前情提要 在上一篇文章<[Mocha.js 101]同步.异步与 Promise>中,我们学会了如何对同步方法.异步回调方法以及 Promise 进行测试. 在本篇文章中,我们将了解到 M ...

  2. 【Mocha.js 101】Mocha 入门指南

    序 说到质量控制,不得不提起测试驱动开发(TDD)和行为驱动开发(BDD).随着敏捷软件开发的推行,软件质量控制的重担也逐渐从测试工程师转向了研发工程师.测试驱动也随之悄然而生,成为了敏捷开发中重要的 ...

  3. js的同步异步

    由于js没有多线程,所以处理多任务的时候,可以用异步回调来解决.js中setTimeout.setInterval.ajax(jq中可以选择同步或异步)均会开启异步.遇到异步模块,会将其推入值任务队列 ...

  4. Node.js 101(2): Promise and async

    --原文地址:http://blog.chrisyip.im/nodejs-101-package-promise-and-async 先回想一下 Sagase 的项目结构: lib/ cli.js ...

  5. js的线程和同步异步以及console.log机制

    项目上线了,闲下来就写写东西吧.积累了好多东西都没有做笔记~挑几个印象深刻的记录一下吧. js的同步异步以及单线程问题: 都知道单线程是js的一大特性.但是通常io(ajax获取服务器数据).用户/浏 ...

  6. js中的异步与同步,解决由异步引起的问题

    之前在项目中遇到过好多次因为异步引起的变量没有值,所以意识到了认识js中同步与异步机制的重要性 在单线程的js中,异步代码会被放入一个事件队列,等到所有其他代码执行后再执行,而不会阻塞线程. 下面是j ...

  7. JS中的同步异步编程

    首先我们先看看同步与异步的定义,及浏览器的执行机制,方便我们更好地理解同步异步编程. 浏览器是多线程的,JS是单线程的(浏览器只分配一个线程来执行JS)   进程大线程小:一个进程中包含多个线程,例如 ...

  8. JS中同步和异步

    首先,我们要知道,JavaScript的本质是一门浏览器脚本语言,在执行的时候是一行一行的执行,只有前面的代码执行完了才会执行后面的代码.JS是单线程语言指的就是这个意思. 同步和异步其实在进行任务执 ...

  9. JS 异步与 Promise

    JS 异步与 Promise 本文写于 2020 年 6 月 8 日 1. 同步与异步与回调函数 Promise 现在是前端面试必考题呀,但是先不急着看 Promise,我们首先来看看什么是异步. - ...

随机推荐

  1. HTML 列表 <ol><ul><li><dl><dt><dd>

    <ol>标签-有序列表 定义和用法: <ol>标签定义有序列表. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,ol 元素的 "compact&q ...

  2. Bootstrap网格系统

    一.网格系统 响应式网格系统随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. 二.基本结构 <div class="container"> &l ...

  3. angularJs,ionic字符串操作

    1.首先我们需要把一段"文本或字符串"中的我们想进行操作的"字符串","字"筛选出来,代码如下: app.filter('replaceCo ...

  4. opencv 基础语法

    1.关于图像:显示图象 //在指定窗口显示图像cvShowImage void cvShowImage( const char* name, const CvArr* image ); name:窗口 ...

  5. java selenium (四) 使用浏览器调试工具

    在基于UI元素的自动化测试中, 无论是桌面的UI自动化测试,还是Web的UI自动化测试.   首先我们需要查找和识别UI元素. 在基于Web UI 自动化测试中, 测试人员需要了解HTML, CSS和 ...

  6. F2工作流引擎这工作流引擎体系架构(二)

    F2工作流体系架构概览图 为了能更好的了解F2工作流引擎的架构体系,花了些时间画了整个架构的体系图.F2工作流引擎遵循参考WFCM规范,目标是实现轻量级的工作流引擎,支持多种数据库及快速应用到任何基于 ...

  7. 错误 java.lang.ClassCastException: com.ylpw.sms.YZZYSenderUtil cannot be cast to ResourceBundle

    出现错误: java.lang.ClassCastException: com.ylpw.sms.YZZYSenderUtil cannot be cast to ResourceBundle 百度搜 ...

  8. OC语言中BOOL 和 bool 区别

    1.类型不同 BOOL为int型: bool为布尔型: 2.长度不同 bool只有一个字节: BOOL长度视实际环境来定,一般可认为是4个字节: 3.取值不同 bool取值false和true,是0和 ...

  9. jquery tab 插件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. PHP初步(中)

    一.文件载入 文件载入:将目标文件的代码载入到当前的位置上,有时候也叫流程控制. 文件载入的目的是实现网站的分层设计,因为不同的页面可能有很多相同的区域(相同的代码),这些相同的代码只需要写一次,有需 ...