安装
安装依赖库
安装 Karma 已经相关的插件，可以使用 yarn:
yarn add --dev karma karma-chrome-launcher karma-mocha karma-chai yarn add --dev mocha chai
或者使用 npm：
npm i --save-dev karma karma-chrome-launcher karma-mocha karma-chai npm i --save-dev mocha chai
在这篇文章中，我使用 Mocha 和 Chai，如果你不喜欢这两个库，你可以选择你喜欢的任何一个库，只要它能在浏览器中运行就可以。
配置 Karma
创建 karma.config.js 文件， ChromeHeadless 启动器会使用这个文件。
karma.conf.js
module.exports = function(config) {
config.set({
frameworks: ['mocha', 'chai'],
files: ['test/**/*.js'],
reporters: ['progress'],
port: 9876, // karma web server port
colors: true,
logLevel: config.LOG_INFO,
browsers: ['ChromeHeadless'],
autoWatch: false,
// singleRun: false, // Karma captures browsers, runs the tests and exits
concurrency: Infinity
})
}注意: 运行
./node_modules/karma/bin/init karma.conf.js以生成 Karma 配置文件。
写一个测试
新建文件 /test/test.js.
/test/test.js
describe('Array', () => {
describe('#indexOf()', () => {
it('should return -1 when the value is not present', () => {
assert.equal(-1, [1,2,3].indexOf(4));
});
});
});运行你的测试
在 package.json 中添加一个 test 脚本，通过前面我们的配置文件运行 Karma。
package.json
"scripts": {
"test": "karma start --single-run --browsers ChromeHeadless karma.conf.js"
}当您运行测试（ yarn test）时，Headless Chrome 会启动并将结果输出到终端：
创建自定义的 Headless Chrome 启动器
ChromeHeadless 启动器非常重要，因为它为我们提供了开箱即用的 Headless Chrome 测试。它包含适合您的 Chrome flag，并启动 Chrome 的远程调试功能，监听 9222 端口。
有时您可能希望将自定义的 flag 传递给 Chrome 或更改启动器使用的远程调试端口。我们创建一个 customLaunchers 来扩展 ChromeHeadless 启动器的默认字段：
karma.conf.js
module.exports = function(config) {
...
config.set({
browsers: ['Chrome', 'ChromeHeadless', 'MyHeadlessChrome'],
customLaunchers: {
MyHeadlessChrome: {
base: 'ChromeHeadless',
flags: ['--disable-translate', '--disable-extensions', '--remote-debugging-port=9223']
}
},
}
};在 Travis CI 上运行测试
配置 Karma 并在 Headless Chrome 中运行测试虽然不十分简单。不过在 Travis 中做持续集成只需要几行代码！
To run your tests in Travis, use dist:trusty and install the Chrome stable addon:
要在 Travis 中运行测试，使用 dist:trusty 并安装 Chrome stable 插件：
.travis.yml
language: node_js node_js: - "7" dist: trusty # needs Ubuntu Trusty sudo: false # no need for virtualization. addons: chrome: stable # have Travis install chrome stable. cache: yarn: true directories: - node_modules install: - yarn script: - yarn test
注: 这个仓库（example repo）有可供参考的代码。
