Karma-Jasmin-Webpack 单元测试

Photo by Gabor Koszegi on Unsplash

为了确保 fast-recorder 能够在实际浏览器环境下如预期的执行,在单元测试阶段,就要在浏览器环境下进行测试。Karma 测试框架帮我很好地解决了这个问题。

Karma 本身可以提供浏览器环境,并在其中利用单元测试框架(jasmin)等来做单元测试。同时强大的是,它有一个 preprocessor(预处理器)模块,可以在浏览器加载脚本时,根据你的需要对程序进行预处理。

搭建过程

首先还是安装 karma 以及 jasmin 和 webpack 相关插件。

这里 jasmin 为单元测试框架、webpack 用来预处理单元测试脚本。这样我们在 Karma 中也可以使用 ES6 的 import 语法。我们可以在全局安装 karma-cli 来简化配置操作。

输入 karma init karma.conf.js 可以帮助我们快速生成一个配置文件。只需要按照提示,选择 jasmin 和 chrome 分别作为单元测试框架和浏览器环境即可。但为了兼容 karma-webpack 插件,还需要做如下改造。

这里我在 preprocessor 配置文件中加入了 webpack 选项,并在 webpack 配置部分加入了 resolve.modules 用来解析模块所在地址 ./dist,否则会报无法解析模块的错误。

由于 webpack 原生支持 ES6 的模块语法,在单元测试脚本中,我们就可以通过 import 导入需要测试的库文件。

(完)

发表评论

电子邮件地址不会被公开。 必填项已用*标注