diff --git a/translated/tech/20170815 Automated testing with Headless Chrome.md b/published/20170815 Automated testing with Headless Chrome.md similarity index 77% rename from translated/tech/20170815 Automated testing with Headless Chrome.md rename to published/20170815 Automated testing with Headless Chrome.md index c751e55e3e..cca6f6f052 100644 --- a/translated/tech/20170815 Automated testing with Headless Chrome.md +++ b/published/20170815 Automated testing with Headless Chrome.md @@ -1,22 +1,21 @@ 使用 Headless Chrome 进行自动化测试 ============================================================ - -如果你想使用 Headless Chrome 进行自动化测试,就看下去吧!这篇文章将让你完全使用 Karma 作为 runner,并且使用 Mocha+Chai 进行 authoring 测试。 +如果你想使用 Headless Chrome 进行自动化测试,那么就往下!这篇文章将让你完全使用 Karma 作为运行器runner,并且使用 Mocha+Chai 来编撰测试。 **这些东西是什么?** -Karma, Mocha, Chai, Headless Chrome, oh my! +Karma、Mocha、Chai、Headless Chrome,哦,我的天哪! -[Karma][2] 是一个测试工具,可以和所有最流行的测试框架([Jasmine][3], [Mocha][4], [QUnit][5])配合使用。 +[Karma][2] 是一个测试工具,可以和所有最流行的测试框架([Jasmine][3]、[Mocha][4]、 [QUnit][5])配合使用。 [Chai][6] 是一个断言库,可以与 Node 和浏览器一起使用。这里我们需要后者。 -[Headless Chrome][7] 是一种在没有浏览器用户界面的 headless 环境中运行 Chrome 浏览器的方法。使用 Headless Chrome(而不是直接在 Node 中测试) 的一个好处是 JavaScript 测试将在与你的网站用户相同的环境中执行。Headless Chrome 为你提供了真正的浏览器环境,却没有运行完整版本的 Chrome 一样的内存开销。 +[Headless Chrome][7] 是一种在没有浏览器用户界面的无需显示环境中运行 Chrome 浏览器的方法。使用 Headless Chrome(而不是直接在 Node 中测试) 的一个好处是 JavaScript 测试将在与你的网站用户相同的环境中执行。Headless Chrome 为你提供了真正的浏览器环境,却没有运行完整版本的 Chrome 一样的内存开销。 -### Setup +### 设置 -### 安装 +#### 安装 使用 `yarn` 安装 Karma、相关插件和测试用例: @@ -34,11 +33,11 @@ npm i --save-dev mocha chai 在这篇文章中我使用 [Mocha][8] 和 [Chai][9],但是你也可以选择自己最喜欢的在浏览器中工作的断言库。 -### 配置 Karma +#### 配置 Karma 创建一个使用 `ChromeHeadless` 启动器的 `karma.config.js` 文件。 -**karma.conf.js** +**karma.conf.js**: ``` module.exports = function(config) { @@ -57,13 +56,13 @@ module.exports = function(config) { } ``` - +> **注意:** 运行 `./node_modules/karma/bin/karma init karma.conf.js` 生成 Karma 的配置文件。 ### 写一个测试 在 `/test/test.js` 中写一个测试: -**/test/test.js** +**/test/test.js**: ``` describe('Array', () => { @@ -79,7 +78,7 @@ describe('Array', () => { 在我们设置好用于运行 Karma 的 `package.json` 中添加一个测试脚本。 -**package.json** +**package.json**: ``` "scripts": { @@ -97,7 +96,7 @@ describe('Array', () => { 但是,有时你可能希望将自定义的标志传递给 Chrome 或更改启动器使用的远程调试端口。要做到这一点,可以通过创建一个 `customLaunchers` 字段来扩展基础的 `ChromeHeadless` 启动器: -**karma.conf.js** +**karma.conf.js**: ``` module.exports = function(config) { @@ -116,13 +115,13 @@ module.exports = function(config) { }; ``` -### 在 Travis CI 上运行它 +### 完全在 Travis CI 上运行它 -在 Headless Chrome 中配置 Karma 运行测试是很困难的。而在 Travis 中持续整合就只有几种! +在 Headless Chrome 中配置 Karma 运行测试是很困难的。而在 Travis 中持续集成就只有几种! 要在 Travis 中运行测试,请使用 `dist: trusty` 并安装稳定版 Chrome 插件: -**.travis.yml** +**.travis.yml**: ``` language: node_js @@ -152,9 +151,9 @@ script: via: https://developers.google.com/web/updates/2017/06/headless-karma-mocha-chai -作者:[ Eric Bidelman][a] +作者:[Eric Bidelman][a] 译者:[firmianay](https://github.com/firmianay) -校对:[校对者ID](https://github.com/校对者ID) +校对:[wxy](https://github.com/wxy) 本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译,[Linux中国](https://linux.cn/) 荣誉推出