translated cookbook/unit-testing-vue-components.md #691

Jinjiang · 2018-03-19T20:25:19Z

No description provided.

Justineo · 2018-04-10T05:52:30Z

src/v2/cookbook/unit-testing-vue-components.md


-Unit testing is a fundamental part of software development. Unit tests execute the smallest units of code in isolation, in order to increase ease of adding new features and track down bugs. Vue's [single-file components](./single-file-components.html) make it straight forward to write unit tests for components in isolation. This lets you develop new features with confidence you are not breaking existing ones, and helps other developers understand what your component does.
+单元测试是软件开发非常基础的一部分。单元测试会封闭执行最小化单元的代码，使得添加新功能和追踪问题更容易。Vue 的[单文件组件](../guide/single-file-components.html)使得为组件撰写隔离的单元测试这件事更加直接。它会让你带着更强的信心开发新特性而不会打破现有的设计，并帮助其他开发者理解你的组件的工作。


让你更有信心地开发新特性而不破坏现有的实现？

理解你的组件的作用？

Justineo · 2018-04-10T05:53:54Z

src/v2/cookbook/unit-testing-vue-components.md

  wrapper.setData({ username: ' '.repeat(7) })

-  // assert the error is rendered
+  // 断言错误信息被渲染了


确认？断言好像不太用作动词？

Justineo · 2018-04-10T05:56:21Z

src/v2/cookbook/unit-testing-vue-components.md

  expect(wrapper.find('.error').exists()).toBe(false)
 })
 ```

-The above code snippet shows how to test whether an error message is rendered based on the length of the username. It demonstrates the general idea of unit testing Vue components: render the component, and assert that the markup matches the state of the component.
+上述代码片段展示了如何基于 `username` 的长度测试一个错误信息是否被渲染。它展示了 Vue 组件的单元测试的一般思路：渲染这个组件，然后断言这些标签是否匹配组件的状态。


Vue 组件的单元测试的一般思路？

Justineo · 2018-04-13T15:53:21Z

src/v2/cookbook/unit-testing-vue-components.md


-## Real-World Example
+[Vue Test Units](https://github.com/vuejs/vue-test-utils) 是 Vue 组件单元测试的官方库。[Vue CLI](https://github.com/vuejs/vue-cli) 的 `webpack` 模板对 Karma 和 Jest 这两个测试运行器都支持，并且在 Vue Test Utils 的文档中有一些[引导](https://vue-test-utils.vuejs.org/zh-cn/guides/)。


Units → Utils

Justineo · 2018-04-13T15:56:53Z

src/v2/cookbook/unit-testing-vue-components.md


-Let's take a look at the component code first:
+我们在上一个示例的基础上继续构建，同时引入一个<a href="https://en.wikipedia.org/wiki/Factory_(object-oriented_programming)">工厂函数 (factory function)</a>使得我们的测试更简洁更易读。这个组件应该：


链接到对应的中文文档？

https://zh.wikipedia.org/wiki/%E5%B7%A5%E5%8E%82%E6%96%B9%E6%B3%95#%E5%B7%A5%E5%8E%82

Justineo · 2018-04-14T15:53:18Z

src/v2/cookbook/unit-testing-vue-components.md


-Snapshot tests save the markup of your Vue component, and compare to the new one generated each time the test runs. If something changes, the developer is notified, and can decide if the change was intentional (the component was updated) or accidentally (the component is behaving incorrectly).
+快照比对测试会保存你的 Vue 组件的标记，然后比较每次新生成的测试运行结果。如果有些东西改变了，开发者就会被注意到，并决定这个改变是有意识的 (组件是否被更新) 还是意外的 (组件的行为并不正常)。


开发者就会得到通知

并决定这个改变是刻意为之（组件更新时）还是意外发生的（组件行为不正确）

Justineo · 2018-04-14T15:57:02Z

src/v2/cookbook/unit-testing-vue-components.md


-End to end tests involve ensure a number of components interact together well. They are more high level. Some examples might be testing if a user can sign up, log in, and update their username. These are slowly to run than unit tests or snapshot tests.
+端到端测试致力于确保组件的一系列交互是正确的。它们是更高级别的测试，可能会测试用户是否注册、登录以及更新他们的用户名。这种测试运行起来会比单元测试和快照比对测试慢一些。


例如可能会测试用户是否能注册、登录……

Justineo · 2018-04-14T16:01:36Z

src/v2/cookbook/unit-testing-vue-components.md


-Unit tests are most useful during development, either to help a developer think about how to design a component, or refactor an existing component, and are often run every time code is changed.
+单元测试中开发的时候是最有用的，即帮助开发者思考如何设计一个组件，又提炼了一个现有的组件。每次代码发生变化的时候它们都会被运行。


既能帮助开发者思考如何设计一个组件或重构一个现有组件。

通常每次代码……

即和既意思不同吧？如果后面把又改成了或，我觉得这里是即

either...or 在这里应该是“既能……又能”，或者“可以……也可以……”

明白。换成“即”之后，其实我就把它当过渡词了 (xxx 很重要，即 xxx)。跟 either ... or 没有直接关系了。
也可以把这个“即”去掉，或换成“它”。

Justineo · 2018-04-14T16:02:08Z

src/v2/cookbook/unit-testing-vue-components.md


-Higher level tests, such as end to end tests, run much slower. These usually run pre-deploy, to ensure each part of the system is working together correctly.
+高级别的测试，诸如端到端测试，运行起来会更慢一些。这些测试通常会在预部署的时候运行，来确保系统的每个部分都能够正常的协同工作。


运行起来会慢很多

通常只在部署前运行？感觉要和前面的每次都运行对应

Justineo · 2018-04-14T16:04:12Z

src/v2/cookbook/unit-testing-vue-components.md


-Unit testing is an important part of any serious application. At first, when the vision of an application is not clear, unit testing might slow down development, but once a vision is established and real users will be interacting with the application, unit tests (and other types of automated tests) are absolutely essential to ensure the codebase is maintainable and scalable.
+单元测试是任何严肃的应用的重要部分。首先，当你对一个应用的愿景还不够清晰的时候，单元测试可能会拖慢开发进度，但是一旦你的愿景建立起来并且有真实的用户对这个应用产生兴趣，那么单元测试 (以及其它类型的自动化测试) 就是绝对有必要的了，它们会确保基础代码的可维护性和可扩展性。


正经的应用？

首先 → 开始时

translated cookbook/unit-testing-vue-components.md

e865a2d

Jinjiang requested a review from Justineo March 19, 2018 20:25

Justineo reviewed Apr 14, 2018

View reviewed changes

Jinjiang added 2 commits April 15, 2018 12:45

Update unit-testing-vue-components.md

e7ac924

Update unit-testing-vue-components.md

dfc7c9b

Justineo approved these changes Apr 15, 2018

View reviewed changes

Jinjiang merged commit a189eda into master Apr 15, 2018

Jinjiang deleted the cookbook-test branch April 15, 2018 06:46

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

translated cookbook/unit-testing-vue-components.md #691

translated cookbook/unit-testing-vue-components.md #691

Jinjiang commented Mar 19, 2018

Justineo Apr 10, 2018

Justineo Apr 10, 2018

Justineo Apr 10, 2018

Justineo Apr 10, 2018

Justineo Apr 13, 2018

Justineo Apr 13, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018

Jinjiang Apr 15, 2018

Justineo Apr 16, 2018

Jinjiang Apr 16, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018

Justineo Apr 14, 2018


		Unit testing is a fundamental part of software development. Unit tests execute the smallest units of code in isolation, in order to increase ease of adding new features and track down bugs. Vue's [single-file components](./single-file-components.html) make it straight forward to write unit tests for components in isolation. This lets you develop new features with confidence you are not breaking existing ones, and helps other developers understand what your component does.
		单元测试是软件开发非常基础的一部分。单元测试会封闭执行最小化单元的代码，使得添加新功能和追踪问题更容易。Vue 的[单文件组件](../guide/single-file-components.html)使得为组件撰写隔离的单元测试这件事更加直接。它会让你带着更强的信心开发新特性而不会打破现有的设计，并帮助其他开发者理解你的组件的工作。


		## Real-World Example
		[Vue Test Units](https://github.com/vuejs/vue-test-utils) 是 Vue 组件单元测试的官方库。[Vue CLI](https://github.com/vuejs/vue-cli) 的 `webpack` 模板对 Karma 和 Jest 这两个测试运行器都支持，并且在 Vue Test Utils 的文档中有一些[引导](https://vue-test-utils.vuejs.org/zh-cn/guides/)。


		Let's take a look at the component code first:
		我们在上一个示例的基础上继续构建，同时引入一个<a href="https://en.wikipedia.org/wiki/Factory_(object-oriented_programming)">工厂函数 (factory function)</a>使得我们的测试更简洁更易读。这个组件应该：


		Snapshot tests save the markup of your Vue component, and compare to the new one generated each time the test runs. If something changes, the developer is notified, and can decide if the change was intentional (the component was updated) or accidentally (the component is behaving incorrectly).
		快照比对测试会保存你的 Vue 组件的标记，然后比较每次新生成的测试运行结果。如果有些东西改变了，开发者就会被注意到，并决定这个改变是有意识的 (组件是否被更新) 还是意外的 (组件的行为并不正常)。


		End to end tests involve ensure a number of components interact together well. They are more high level. Some examples might be testing if a user can sign up, log in, and update their username. These are slowly to run than unit tests or snapshot tests.
		端到端测试致力于确保组件的一系列交互是正确的。它们是更高级别的测试，可能会测试用户是否注册、登录以及更新他们的用户名。这种测试运行起来会比单元测试和快照比对测试慢一些。


		Unit tests are most useful during development, either to help a developer think about how to design a component, or refactor an existing component, and are often run every time code is changed.
		单元测试中开发的时候是最有用的，即帮助开发者思考如何设计一个组件，又提炼了一个现有的组件。每次代码发生变化的时候它们都会被运行。


		Higher level tests, such as end to end tests, run much slower. These usually run pre-deploy, to ensure each part of the system is working together correctly.
		高级别的测试，诸如端到端测试，运行起来会更慢一些。这些测试通常会在预部署的时候运行，来确保系统的每个部分都能够正常的协同工作。


		Unit testing is an important part of any serious application. At first, when the vision of an application is not clear, unit testing might slow down development, but once a vision is established and real users will be interacting with the application, unit tests (and other types of automated tests) are absolutely essential to ensure the codebase is maintainable and scalable.
		单元测试是任何严肃的应用的重要部分。首先，当你对一个应用的愿景还不够清晰的时候，单元测试可能会拖慢开发进度，但是一旦你的愿景建立起来并且有真实的用户对这个应用产生兴趣，那么单元测试 (以及其它类型的自动化测试) 就是绝对有必要的了，它们会确保基础代码的可维护性和可扩展性。

translated cookbook/unit-testing-vue-components.md #691

translated cookbook/unit-testing-vue-components.md #691

Conversation

Jinjiang commented Mar 19, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment