doc: add browser-testing.md and code-coverage.md translate

zhaozhiming · zhaozhiming · commit 6751d5e11ba2 · 2016-03-20T17:16:29.000+08:00
diff --git a/zh_CN/docs/recipes/browser-testing.md b/zh_CN/docs/recipes/browser-testing.md
@@ -0,0 +1,81 @@
+___
+**备注**
+
+这是[browser-testing.md](https://github.com/sindresorhus/ava/blob/master/docs/recipes/browser-testing.md)的简体中文翻译。这个[链接](https://github.com/sindresorhus/ava/compare/master...zhaozhiming:master)用来查看本翻译与AVA的master分支是否有差别（如果你没有看到`browser-testing`发生变化，那就意味着这份翻译文档是最新的）。
+___
+
+# 设置AVA做浏览器测试
+
+翻译: [Français](https://github.com/sindresorhus/ava-docs/blob/master/fr_FR/docs/recipes/browser-testing.md), [Русский](https://github.com/sindresorhus/ava-docs/blob/master/ru_RU/docs/recipes/browser-testing.md), [简体中文](https://github.com/sindresorhus/ava-docs/blob/master/zh_CN/docs/recipes/browser-testing.md)
+
+
+
+AVA[还](https://github.com/sindresorhus/ava/issues/24)不支持在浏览器中运行测试。一些库要求浏览器指定全局变量（`window`, `document`, `navigator`等等）。
+React就是其中的一个例子，最低要求如果你想用ReactDOM.render和用ReactTestUTils模拟事件。
+
+这个秘方让需要模拟浏览器环境的库可以工作。
+
+## 安装jsdom
+
+安装[jsdom](https://github.com/tmpvar/jsdom)。
+
+> 一个WHATWG DOM和HTML标准的JavaScript实现，给node.js使用的。
+
+```
+$ npm install --save-dev jsdom
+```
+
+## 设置jsdom
+
+创建一个helper文件并放在`test/helpers`文件夹中，这样确保AVA不会把它当成测试来处理。
+
+`test/helpers/setup-browser-env.js`:
+
+```js
+global.document = require('jsdom').jsdom('<body></body>');
+global.window = document.defaultView;
+global.navigator = window.navigator;
+```
+
+## 配置测试使用jsdom
+
+配置AVA，将`require`设置为helper文件，这样每个测试运行前都会先加载它。
+
+`package.json`:
+
+```json
+{
+  "ava": {
+    "require": [
+      "./test/helpers/setup-browser-env.js"
+    ]
+  }
+}
+```
+
+## 享受!
+
+编写你的测试并享受一个模拟的window对象吧。
+
+`test/my.react.test.js`:
+
+```js
+import test from 'ava';
+import React from 'react';
+import {render} from 'react-dom';
+import {Simulate} from 'react-addons-test-utils';
+import sinon from 'sinon';
+import CustomInput from './components/custom-input.jsx';
+
+test('Input calls onBlur', t => {
+    const onUserBlur = sinon.spy();
+    const input = render(
+        React.createElement(CustomInput, {onUserBlur),
+        div
+    )
+
+    Simulate.blur(input);
+
+    t.true(onUserBlur.calledOnce);
+});
+```
diff --git a/zh_CN/docs/recipes/code-coverage.md b/zh_CN/docs/recipes/code-coverage.md
@@ -0,0 +1,188 @@
+___
+**备注**
+
+这是[code-coverage.md](https://github.com/sindresorhus/ava/blob/master/docs/recipes/code-coverage.md)的简体中文翻译。这个[链接](https://github.com/sindresorhus/ava/compare/master...zhaozhiming:master)用来查看本翻译与AVA的master分支是否有差别（如果你没有看到`code-coverage`发生变化，那就意味着这份翻译文档是最新的）。
+___
+
+# 代码覆盖率
+
+翻译: [Español](https://github.com/sindresorhus/ava-docs/blob/master/es_ES/docs/recipes/code-coverage.md), [Français](https://github.com/sindresorhus/ava-docs/blob/master/fr_FR/docs/recipes/code-coverage.md), [日本語](https://github.com/sindresorhus/ava-docs/blob/master/ja_JP/docs/recipes/code-coverage.md), [Português](https://github.com/sindresorhus/ava-docs/blob/master/pt_BR/docs/recipes/code-coverage.md), [Русский](https://github.com/sindresorhus/ava-docs/blob/master/ru_RU/docs/recipes/code-coverage.md), [简体中文](https://github.com/sindresorhus/ava-docs/blob/master/zh_CN/docs/recipes/code-coverage.md)
+
+
+因为AVA[重新处理了测试文件][process-isolation]，所以你不能使用[`istanbul`]来做代码覆盖率，但你可以使用[`nyc`]来完成，它是支持子进程的[`istanbul`]。
+
+## 设置
+
+首先安装NYC：
+
+```
+$ npm install nyc --save-dev
+```
+
+然后添加`.nyc_output`和`coverage`文件夹到你的`.gitignore`文件。
+
+`.gitignore`:
+
+```
+node_modules
+coverage
+.nyc_output
+```
+
+## ES5覆盖率
+
+使用NYC很简单就可以提供使用ES5来写的生产代码的覆盖率，只需要在测试脚本前面加上`nyc`：
+
+```json
+{
+  "scripts": {
+    "test": "nyc ava"
+  }
+}
+```
+
+就是这样！
+
+如果你想要创建HTML覆盖率报告，或者上传覆盖率数据到Coveralls，你应该跳过下面的那些章节。
+
+## ES2015覆盖率
+
+使用Babel来转换生产代码有点复杂，这里我们把它分成几个步骤。
+
+### 配置Babel
+
+首先，我们需要一个Babel配置，下面是一个例子，你可以修改它以适应你的需要。
+
+`package.json`:
+```json
+{
+    "babel": {
+        "presets": ["es2015"],
+        "plugins": ["transform-runtime"],
+        "ignore": "test.js",
+        "env": {
+            "development": {
+                "sourceMaps": "inline"
+            }
+        }
+    }
+}
+```
+
+例子中这里有2点比较重要。
+
+1. 我们忽略测试文件，因为AVA已经为你做了转换处理了。
+
+2. 我们为开发环境指定`inline`（内联）原生映射，为了正确的生成覆盖率这个很重要，使用Babel配置中的`env`属性可以让我们在生产构建中取消原生映射。
+
+
+### 创建一个构建脚本
+
+因为你可能不希望在生产代码中`inline`原生映射，你需要在构建脚本中指定一个可代替的环境变量：
+
+`package.json`
+
+```json
+{
+    "scripts": {
+        "build": "BABEL_ENV=production babel --out-dir=dist index.js"
+    }
+}
+```
+
+> 警告：`BABEL_ENV=production`在Windows中不可用，你必须使用`set`关键字（`set BABEL_ENV=production`），如果是跨平台构建，请检查[`cross-env`]。
+
+注意，构建脚本中AVA的部分真的很少，它只是一个如何使用Babel的`env`配置来操作你的配置以兼容AVA的示例。
+
+### 使用Babel require钩子
+
+要使用Babel require钩子，请在`package.json`中的AVA配置里将`require`属性设置为`babel-core/register`。
+
+```json
+{
+    "ava": {
+        "require": ["babel-core/register"]
+    }
+}
+```
+
+*注意*：你也可以在命令行里设置require钩子：`ava --require=babel-core/register`。尽管如此，配置在`package.json`里面可以让你不用重复地写标志。
+
+### 把所有东西放在一起
+
+结合上面的步骤，你的`package.json`最后可能是这个样子：
+
+```json
+{
+    "scripts": {
+        "test": "nyc ava",
+        "build": "BABEL_ENV=production babel --out-dir=dist index.js"
+    },
+    "babel": {
+        "presets": ["es2015"],
+        "plugins": ["transform-runtime"],
+        "ignore": "test.js",
+        "env": {
+            "development": {
+                "sourceMaps": "inline"
+            }
+        }
+    },
+    "ava": {
+        "require": ["babel-core/register"]
+    }
+}
+```
+
+
+## HTML报告
+
+NYC创建在`.nyc_ouput`文件夹中为每个进程创建一个`json`的覆盖率文件。
+
+把这些文件组合成一个可阅读的HTML报告，可以通过下面的方法来做：
+
+```
+$ ./node_modules/.bin/nyc report --reporter=html
+```
+
+或者，使用npm脚本来代替打印命令行：
+
+```json
+{
+    "scripts": {
+        "report": "nyc report --reporter=html"
+    }
+}
+```
+
+这样会在`coverage`文件夹中输出一个HTML文件。
+
+
+## 托管覆盖率报告
+
+### Travis CI & Coveralls
+
+首先，你需要登录[coveralls.io]并激活你的项目库。
+
+一旦完成，添加[`coveralls`]到开发依赖库：
+
+```
+$ npm install coveralls --save-dev
+```
+
+然后添加下面的代码到你的`.travis.yml`：
+
+```yaml
+after_success:
+    - './node_modules/.bin/nyc report --reporter=text-lcov | ./node_modules/.bin/coveralls'
+```
+
+你的覆盖率报告将在你的Travis完成后很快地出现在coveralls上面。
+
+[`babel`]:      https://github.com/babel/babel
+[coveralls.io]: https://coveralls.io
+[`coveralls`]:  https://github.com/nickmerwin/node-coveralls
+[`cross-env`]:  https://github.com/kentcdodds/cross-env
+[process-isolation]: https://github.com/sindresorhus/ava#process-isolation
+[`istanbul`]:   https://github.com/gotwarlost/istanbul
+[`nyc`]:        https://github.com/bcoe/nyc
diff --git a/zh_CN/readme.md b/zh_CN/readme.md
@@ -903,11 +903,11 @@ AVA，不是Ava，也不是ava，发音[`/ˈeɪvə/` ay-və](https://github.com/
 
 ## 秘方 
 
-- [代码覆盖率](https://github.com/sindresorhus/ava/blob/master/docs/recipes/code-coverage.md)
+- [代码覆盖率](docs/recipes/code-coverage.md)
 - [观察模式](https://github.com/sindresorhus/ava/blob/master/docs/recipes/watch-mode.md)
 - [端到端测试](https://github.com/sindresorhus/ava/blob/master/docs/recipes/endpoint-testing.md)
 - [什么时候使用`t.plan()`](https://github.com/sindresorhus/ava/blob/master/docs/recipes/when-to-use-plan.md)
-- [浏览器测试](https://github.com/sindresorhus/ava/blob/master/docs/recipes/browser-testing.md)
+- [浏览器测试](docs/recipes/browser-testing.md)
 - [TypeScript](https://github.com/sindresorhus/ava/blob/master/docs/recipes/typescript.md)
 
 ## 支持 
