Merge pull request #53 from hweeTan/master

translate shallow renderer and test renderer

Author: ltmylinh

content/docs/addons-shallow-renderer.md

@@ -15,22 +15,22 @@ var ShallowRenderer = require('react-test-renderer/shallow'); // ES5 with npm
 
 ## Overview {#overview}
 
-When writing unit tests for React, shallow rendering can be helpful. Shallow rendering lets you render a component "one level deep" and assert facts about what its render method returns, without worrying about the behavior of child components, which are not instantiated or rendered. This does not require a DOM.
+Khi viết Unit Test cho React, render cạn có thể là cách hữu dụng. Việc render cạn cho phép bạn render một component "sâu một lớp" và xác nhận được sự trung thực của kết quả trả về từ hàm render, mà không cần quan tâm về cách hoạt động của những component con, khi mà chúng không được khởi tạo và render. Việc này không cần dùng DOM.
 
-For example, if you have the following component:
+Ví dụ, nếu bạn cần render component sau:
 
 ```javascript
 function MyComponent() {
   return (
     <div>
-      <span className="heading">Title</span>
+      <span className="heading">Tiêu đề</span>
       <Subcomponent foo="bar" />
     </div>
   );
 }
 ```
 
-Then you can assert:
+Rồi bạn có thể xác nhận rằng:
 
 ```javascript
 import ShallowRenderer from 'react-test-renderer/shallow';
@@ -47,22 +47,22 @@ expect(result.props.children).toEqual([
 ]);
 ```
 
-Shallow testing currently has some limitations, namely not supporting refs.
+Kiểm tra cạn hiện tại vẫn có một vài hạn chế, có thể kể tên là việc chưa hỗ trợ refs.
 
-> Note:
+> Lưu ý:
 >
-> We also recommend checking out Enzyme's [Shallow Rendering API](https://airbnb.io/enzyme/docs/api/shallow.html). It provides a nicer higher-level API over the same functionality.
+> Chúng tôi cũng khuyến khích bạn xem thêm về [API Render cạn](https://airbnb.io/enzyme/docs/api/shallow.html) của Enzyme. Nó cung cấp API cấp cao hơn và tốt hơn cho cùng chức năng.
 
-## Reference {#reference}
+## Tài liệu tham khảo {#reference}
 
 ### `shallowRenderer.render()` {#shallowrendererrender}
 
-You can think of the shallowRenderer as a "place" to render the component you're testing, and from which you can extract the component's output.
+Bạn có thể tưởng tượng shallowRenderer như là một "nơi" để render component bạn muốn kiểm tra, và từ đó bạn có thể tách đầu ra của component đó.
 
-`shallowRenderer.render()` is similar to [`ReactDOM.render()`](/docs/react-dom.html#render) but it doesn't require DOM and only renders a single level deep. This means you can test components isolated from how their children are implemented.
+`shallowRenderer.render()` gần giống với [`ReactDOM.render()`](/docs/react-dom.html#render), nhưng nó không cần dùng DOM và chỉ render sâu một lớp. Việc này nghĩa là bạn có thể kiểm tra những component mà không phụ thuộc vào cách những component con được triển khai.
 
 ### `shallowRenderer.getRenderOutput()` {#shallowrenderergetrenderoutput}
 
-After `shallowRenderer.render()` has been called, you can use `shallowRenderer.getRenderOutput()` to get the shallowly rendered output.
+Sau khi gọi hàm `shallowRenderer.render()`, bạn có thể dùng `shallowRenderer.getRenderOutput()` để lấy đầu ra của việc render cạn.
 
-You can then begin to assert facts about the output.
+Rồi bạn có thể bắt đầu việc xác nhận sự trung thực của đầu ra.

content/docs/reference-test-renderer.md

@@ -10,16 +10,16 @@ category: Reference
 
 ```javascript
 import TestRenderer from 'react-test-renderer'; // ES6
-const TestRenderer = require('react-test-renderer'); // ES5 with npm
+const TestRenderer = require('react-test-renderer'); // ES5 với npm
 ```
 
-## Overview {#overview}
+## Sơ lược {#overview}
 
-This package provides a React renderer that can be used to render React components to pure JavaScript objects, without depending on the DOM or a native mobile environment.
+Gói này cung cấp một React Renderer để sử dụng cho việc render những React component thành những Javascript object, mà không cần dựa trên DOM hay một môi trường native mobile nào.
 
-Essentially, this package makes it easy to grab a snapshot of the platform view hierarchy (similar to a DOM tree) rendered by a React DOM or React Native component without using a browser or [jsdom](https://github.com/tmpvar/jsdom).
+Về bản chất, gói này giúp cho việc chụp một bức tranh toàn cảnh của cấu trúc view (tương tự như cây DOM) được render bởi một component React DOM hay React Native mà không cần tới một trình duyệt hay [jsdom](https://github.com/tmpvar/jsdom).
 
-Example:
+Ví dụ:
 
 ```javascript
 import TestRenderer from 'react-test-renderer';
@@ -38,9 +38,9 @@ console.log(testRenderer.toJSON());
 //   children: [ 'Facebook' ] }
 ```
 
-You can use Jest's snapshot testing feature to automatically save a copy of the JSON tree to a file and check in your tests that it hasn't changed: [Learn more about it](https://jestjs.io/docs/en/snapshot-testing).
+Bạn có thể sử dụng chức năng chụp snapshot của Jest để tự động lưu một bản sao của cây JSON vào 1 tập tin và kiểm tra trong những bản thử của bạn rằng nó không thay đổi: [Xem thêm về nó](https://jestjs.io/docs/en/snapshot-testing).
 
-You can also traverse the output to find specific nodes and make assertions about them.
+Bạn cũng có thể đi qua đầu ra để tìm những node nhất định và kiểm tra độ chính xác của chúng.
 
 ```javascript
 import TestRenderer from 'react-test-renderer';
@@ -95,15 +95,15 @@ expect(testInstance.findByProps({className: "sub"}).children).toEqual(['Sub']);
 * [`testInstance.parent`](#testinstanceparent)
 * [`testInstance.children`](#testinstancechildren)
 
-## Reference {#reference}
+## Tài liệu tham khảo {#reference}
 
 ### `TestRenderer.create()` {#testrenderercreate}
 
 ```javascript
 TestRenderer.create(element, options);
 ```
 
-Create a `TestRenderer` instance with the passed React element. It doesn't use the real DOM, but it still fully renders the component tree into memory so you can make assertions about it. The returned instance has the following methods and properties.
+Tạo một instance `TestRenderer` với một element React trong tham số. No kh6ong sử dụng DOM thật, nhưng nó vẫn render cây component một cách đầy đủ vào trong bộ nhớ để bạn có thể kiểm định. Instance được trả về có những hàm và thuộc tính sau đây.
 
 ### `TestRenderer.act()` {#testrendereract}
 
@@ -141,141 +141,141 @@ expect(root.toJSON()).toMatchSnapshot();
 testRenderer.toJSON()
 ```
 
-Return an object representing the rendered tree. This tree only contains the platform-specific nodes like `<div>` or `<View>` and their props, but doesn't contain any user-written components. This is handy for [snapshot testing](https://facebook.github.io/jest/docs/en/snapshot-testing.html#snapshot-testing-with-jest).
+Trả về một object thể hiện cậy được render. Cây này chỉ bao gồm các node riêng cho các nền tảng như `<div>` hay `<View>` và thuộc tính (prop) của chúng, nhưng không bao gồm bất kỳ component do người dùng viết. Việc này tiện cho [thử snapshot](https://facebook.github.io/jest/docs/en/snapshot-testing.html#snapshot-testing-with-jest).
 
 ### `testRenderer.toTree()` {#testrenderertotree}
 
 ```javascript
 testRenderer.toTree()
 ```
 
-Return an object representing the rendered tree. Unlike `toJSON()`, the representation is more detailed than the one provided by `toJSON()`, and includes the user-written components. You probably don't need this method unless you're writing your own assertion library on top of the test renderer.
+Trả về một object thể hiện cậy được render. Không như `toJSON()`, sự thể hiện này chi tiết hơn kết quả được cung cấp bởi `toJSON()`, và nó bao gồm cả những component do người dùng viết. Bạn cỏ thể không cần hàm này trừ khi bạn đang viết thư viện kiểm định trên test renderer.
 
 ### `testRenderer.update()` {#testrendererupdate}
 
 ```javascript
 testRenderer.update(element)
 ```
 
-Re-render the in-memory tree with a new root element. This simulates a React update at the root. If the new element has the same type and key as the previous element, the tree will be updated; otherwise, it will re-mount a new tree.
+Render lại cây trong bộ nhớ với một element gốc mới. Việc này giả lập một sự cập nhật của React tại gốc. Nếu element mới có cùng loại (type) và key (khoá) với element trước, cây sẽ được cập nhật; nếu không, nó sẽ mount lại một cây mới.
 
 ### `testRenderer.unmount()` {#testrendererunmount}
 
 ```javascript
 testRenderer.unmount()
 ```
 
-Unmount the in-memory tree, triggering the appropriate lifecycle events.
+Gỡ (unmount) cây trong bộ nhớ, phát ra các sự kiện vòng đời (lifecycle events) tương ứng.
 
 ### `testRenderer.getInstance()` {#testrenderergetinstance}
 
 ```javascript
 testRenderer.getInstance()
 ```
 
-Return the instance corresponding to the root element, if available. This will not work if the root element is a function component because they don't have instances.
+Trả về một instance tương ứng với element gốc, nếu có. Việc này sẽ không hoạt động nếu element gốc là một function component vì nó không có intance.
 
 ### `testRenderer.root` {#testrendererroot}
 
 ```javascript
 testRenderer.root
 ```
 
-Returns the root "test instance" object that is useful for making assertions about specific nodes in the tree. You can use it to find other "test instances" deeper below.
+Trả về object "test instance" gốc hữu dụng cho việc kiểm định những node nhất định trong cây. Bạn có thể dùng nó để tìm những test instance" khác sâu bên dưới.
 
 ### `testInstance.find()` {#testinstancefind}
 
 ```javascript
 testInstance.find(test)
 ```
 
-Find a single descendant test instance for which `test(testInstance)` returns `true`. If `test(testInstance)` does not return `true` for exactly one test instance, it will throw an error.
+Tìm một test instance ngay bên dưới khi `test(testInstance)` trả về `true`. Nếu `test(testInstance)` không trả về `true` cho đúng một test instance, một lỗi sẽ được ném ra.
 
 ### `testInstance.findByType()` {#testinstancefindbytype}
 
 ```javascript
 testInstance.findByType(type)
 ```
 
-Find a single descendant test instance with the provided `type`. If there is not exactly one test instance with the provided `type`, it will throw an error.
+Tìm một test instance ngay bên dưới với `type` được cung cấp. Nếu không có chính xác một test instance với `type` được cung cấp, nó sẽ ném ra một lỗi.
 
 ### `testInstance.findByProps()` {#testinstancefindbyprops}
 
 ```javascript
 testInstance.findByProps(props)
 ```
 
-Find a single descendant test instance with the provided `props`. If there is not exactly one test instance with the provided `props`, it will throw an error.
+Tìm một test instance ngay bên dưới với `props` được cung cấp. Nếu không có chính xác một test instance với `props` được cung cấp, nó sẽ ném ra một lỗi.
 
 ### `testInstance.findAll()` {#testinstancefindall}
 
 ```javascript
 testInstance.findAll(test)
 ```
 
-Find all descendant test instances for which `test(testInstance)` returns `true`.
+Tìm tất cả test instance ngay bên dưới khi `test(testInstance)` trả về `true`.
 
 ### `testInstance.findAllByType()` {#testinstancefindallbytype}
 
 ```javascript
 testInstance.findAllByType(type)
 ```
 
-Find all descendant test instances with the provided `type`.
+Tìm tất cả test instance với `type` được cung cấp.
 
 ### `testInstance.findAllByProps()` {#testinstancefindallbyprops}
 
 ```javascript
 testInstance.findAllByProps(props)
 ```
 
-Find all descendant test instances with the provided `props`.
+Tìm tất cả test instance với `props` được cung cấp.
 
 ### `testInstance.instance` {#testinstanceinstance}
 
 ```javascript
 testInstance.instance
 ```
 
-The component instance corresponding to this test instance. It is only available for class components, as function components don't have instances. It matches the `this` value inside the given component.
+Component instance tương ứng với test instance này. Nó chỉ khả dụng cho những class component, vì những function component không có instance. Nó tương đương với giá trị của `this` trong component.
 
 ### `testInstance.type` {#testinstancetype}
 
 ```javascript
 testInstance.type
 ```
 
-The component type corresponding to this test instance. For example, a `<Button />` component has a type of `Button`.
+Loại compoennt tương ứng với test instance này. Vi dụ, một component `<Button />` có loại là `Button`.
 
 ### `testInstance.props` {#testinstanceprops}
 
 ```javascript
 testInstance.props
 ```
 
-The props corresponding to this test instance. For example, a `<Button size="small" />` component has `{size: 'small'}` as props.
+Thuộc tính (props) tương ứng với test instance này. Ví dụ, một component `<Button size="small" />` thì có props là `{size: 'small'}`
 
 ### `testInstance.parent` {#testinstanceparent}
 
 ```javascript
 testInstance.parent
 ```
 
-The parent test instance of this test instance.
+Test instance cha của test instance này.
 
 ### `testInstance.children` {#testinstancechildren}
 
 ```javascript
 testInstance.children
 ```
 
-The children test instances of this test instance.
+Những test instance con của test instance này.
 
-## Ideas {#ideas}
+## Ý tưởng {#ideas}
 
-You can pass `createNodeMock` function to `TestRenderer.create` as the option, which allows for custom mock refs.
-`createNodeMock` accepts the current element and should return a mock ref object.
-This is useful when you test a component that relies on refs.
+Bạn có thể truyền hàm `createNodeMock` vào `TestRenderer.create` như một tuỳ chọn, nó cho phép tuỳ chỉnh mock refs.
+`createNodeMock` nhận vào element hiện tại và sẽ trả về mốt object mock ref.
+Việc này hữu dụng cho việc thử một component phụ thuộc vào refs.
 
 ```javascript
 import TestRenderer from 'react-test-renderer';