开发指南-测试 初译中……

This commit is contained in:
Zhicheng Wang 2016-05-30 08:54:35 +08:00
parent 8676cef5af
commit 61cb39cc0a
4 changed files with 107 additions and 92 deletions

View File

@ -4,6 +4,7 @@ include ../_util-fns
Well need an Angular application to test, one as simple as possible while having most of the angular features we want to test. Well need an Angular application to test, one as simple as possible while having most of the angular features we want to test.
我们将需要一个Angular应用程序来测试一个尽量简单但几乎拥有所有我们想要测试angular特性的应用程序。 我们将需要一个Angular应用程序来测试一个尽量简单但几乎拥有所有我们想要测试angular特性的应用程序。
What better app than our own [The Tour of Heroes](../tutorial/toh-pt5.html)? We're already quite familiar with it and it fits our criteria, so let's try to test what we've done there. What better app than our own [The Tour of Heroes](../tutorial/toh-pt5.html)? We're already quite familiar with it and it fits our criteria, so let's try to test what we've done there.
什么应用程序比我们自己的[英雄指南](../tutorial/toh-pt5.html)更合适?我们已经很熟悉它了,它也适合我们的需求,所以让我们来测试一下我们已经完成了的功能。 什么应用程序比我们自己的[英雄指南](../tutorial/toh-pt5.html)更合适?我们已经很熟悉它了,它也适合我们的需求,所以让我们来测试一下我们已经完成了的功能。

View File

@ -6,6 +6,7 @@ include ../_util-fns
在这个章节我们将为我们的样本应用程序设置测试环境针对应用程序的最简单的部分编写几个简单的Jasmine测试。 在这个章节我们将为我们的样本应用程序设置测试环境针对应用程序的最简单的部分编写几个简单的Jasmine测试。
We'll learn: We'll learn:
我们会学到: 我们会学到:
- to test one of our application files - to test one of our application files
- 测试我们应用程序的一个文件 - 测试我们应用程序的一个文件
@ -51,6 +52,7 @@ include ../_util-fns
.l-main-section .l-main-section
:marked :marked
## Update `package.json` for testing ## Update `package.json` for testing
## 为测试更新`package.json` ## 为测试更新`package.json`
We must install the Jasmine package as well: We must install the Jasmine package as well:
@ -60,7 +62,9 @@ include ../_util-fns
pre.prettyprint.lang-bash pre.prettyprint.lang-bash
code npm install jasmine-core --save-dev --save-exact code npm install jasmine-core --save-dev --save-exact
.alert.is-important Be sure to install <code>jasmine-core</code> , not <code>jasmine</code>! 请注意,安装<code>jasmine-core</code>,而不是<code>jasmine</code>! .alert.is-important Be sure to install <code>jasmine-core</code> , not <code>jasmine</code>!
.alert.is-important 请注意,安装<code>jasmine-core</code>,而不是<code>jasmine</code>!
:marked :marked
Let's make one more change to the `package.json` script commands. Let's make one more change to the `package.json` script commands.
@ -82,6 +86,7 @@ code-example(format="").
.l-main-section .l-main-section
:marked :marked
## First app tests ## First app tests
## 第一个应用程序测试 ## 第一个应用程序测试
We can start testing *some* of our app right away. For example, we can test the `Hero` interface: We can start testing *some* of our app right away. For example, we can test the `Hero` interface:

View File

@ -6,9 +6,11 @@
1. They **guard** against breaking existing code (“regressions”) when we make changes. 1. They **guard** against breaking existing code (“regressions”) when we make changes.
1. 当我们改变代码时,它们**守护**已有代码,以防被破坏。 1. 当我们改变代码时,它们**守护**已有代码,以防被破坏。
1. They **clarify** what the code does both when used as intended and when faced with deviant conditions. 1. They **clarify** what the code does both when used as intended and when faced with deviant conditions.
1. 在我们正确使用代码和面对异常情况时,它们**澄清**代码做什么。 1. 在我们正确使用代码和面对异常情况时,它们**澄清**代码做什么。
1. They **reveal** mistakes in design and implementation. Tests force us to look at our code from many angles. When a part of our application seems hard to test, 1. They **reveal** mistakes in design and implementation. Tests force us to look at our code from many angles. When a part of our application seems hard to test,
we may have discovered a design flaw, something we can cure now rather than later when it becomes expensive to fix. we may have discovered a design flaw, something we can cure now rather than later when it becomes expensive to fix.

View File

@ -22,6 +22,7 @@ include ../_util-fns
**Create a new project folder** perhaps called `angular2-unit-testing`. **Create a new project folder** perhaps called `angular2-unit-testing`.
**新建一个项目目录**,起名为`angular2-unit-testing`。 **新建一个项目目录**,起名为`angular2-unit-testing`。
.l-main-section .l-main-section
:marked :marked
## Install npm packages locally ## Install npm packages locally
@ -257,7 +258,9 @@ figure.image-display
.l-main-section .l-main-section
:marked :marked
## Debug the test ## Debug the test
## 调试测试 ## 调试测试
Suppose we didnt know what was going on. We can debug it in the browser. Suppose we didnt know what was going on. We can debug it in the browser.
假设我们不知道是怎么回事。我们都能在浏览器里面调试它。 假设我们不知道是怎么回事。我们都能在浏览器里面调试它。
@ -282,10 +285,14 @@ figure.image-display
:marked :marked
How about that! They really arent equal. How about that! They really arent equal.
你觉得怎么样?它们真的不相等。 你觉得怎么样?它们真的不相等。
- remove the breakpoint (right-click in the “Breakpoints” section and chose “Remove breakpoint”) - remove the breakpoint (right-click in the “Breakpoints” section and chose “Remove breakpoint”)
- 移除断点在“Breakpoints”区域右键点击“Remove breakpoint”) - 移除断点在“Breakpoints”区域右键点击“Remove breakpoint”)
- Click the “play” icon to resume the test (or F8) - Click the “play” icon to resume the test (or F8)
- 点击“play”图标来继续运行测试或F8 - 点击“play”图标来继续运行测试或F8
And the test finishes. Close the browser tools (click the close box or press F12 or Ctrl-Shift-I) And the test finishes. Close the browser tools (click the close box or press F12 or Ctrl-Shift-I)