[转] Flex框架下的RIA开发现场--第6回 Flex测试和质量改善的5个工具

[url]http://bbs.9ria.com/thread-76622-1-1.html[/url]

一直以来，在Flex应用程序开发中主要是采用手动测试，而不是利用工具做自动测试。原因是没有这样的工具。 因此，即使想实施ActionScript类的单体测试或是强制编码规范等，却因Flex开发工具上没有这个环境而只得作罢。
在常用于Flex应用程序服务端开发的Java中，积累着各种各样的测试工具。在Eclipse开发工具中原本就整合了单体测试用的JUnit和代码格式化等工具。开发者在开发阶段能够实施多种改善质量的策略。
打破这种状况的是，最新的Flex开发工具Flash Builder 4。从版本4开始在工具中集成了最新的单体测试工具FlexUnit4。在本连载的第2回《让Flex开发更轻松的FB4的11个功能》中叶介绍了FlexUnit。另外，Flash Builder还具备了性能分析功能。
更值得一提的是，在Flash Builder 4发布前后，还有一个测试工具也发布了。那就是HP QuickTest Professional（QTP）。比起以往基于WinForms、HTML网页应用程序等技术的自动结合测试来说，QTP可谓是个终极武器，它支持Flex。下面会介绍这个QTP。
本文将向大家介绍在Flex开发，特别是大规模业务应用程序开发中，对测试和质量改善非常有用的5个必备工具。并简单说明一下它们的使用方法。 （按以下顺序说明）
1. 单体测试工具「FlexUnit」
2. 遵循编码规范「Flex Formatter」
3. 静态分析代码「FlexPMD」
4. 自动执行基于用例的测试「QTP」
5. Flash Builder的の「性能分析」 功能

【1】单体测试工具「FlexUnit」

首先登场的是动态单体测试工具FlexUnit。因为是动态的，所以能用于测试运行中的ActionScript类。

[img]http://dl.iteye.com/upload/attachment/451795/1049459a-ccea-3dc1-b751-f0fb9076032f.jpg[/img]

FlexUnit via kwout


基本上Flash Builder已经内置了FlexUnit，不需要从别处下载。

□ 特点
Flex中使用的基于ActionScript 3的类的单体测试工具
继承了Java的JUnit思想，从建立测试用例到自由使用工具，几乎一模一样
Test Runner中熟悉的绿色状态条
Flash Builder内置


[img]http://dl.iteye.com/upload/attachment/451797/196ee5a5-963a-3401-9d66-7c9f10cc9232.gif[/img]

图1　测试用例的建立和运行

[img]http://dl.iteye.com/upload/attachment/451798/8f78c969-9042-36ab-9638-959b14cf7456.gif[/img]


图2　FlexUnit结果视图中熟悉的绿色状态条

□单体测试的步骤

类单体测试的步骤如下，和Java完全相同。
建立测试用的Flex工程
建立测试用例
建立测试套件
测试套件：测试用例的集合
运行测试
□ 测试类的例子
在Flex工程中，以与待测类1对1的形式建立测试用例。由于不需要继承TestCase等特定类，因此能方便地建立测试用例。测试用例的类名如下：
テストされるクラス：jp.atmarkit.sample.HelloWorld.as
テストケースクラス：jp.atmarkit.sample.HelloWorldTest.as

在建立测试用例方面，还能沿用以前做JUnit单体测试方面的知识。
下面是一个简单的测试方法的例子。这里对自己编写的HelloUtil做1＋2的加法测试。
/**
* 测试用例01：1+2
*/
[Test]
public function testAdd01():void {
// 准备测试用例和预期值
a = 1;
b = 2;
expected = 3;
// 运行测试用例
actual = HelloUtil.add(a, b)
// 断言
assertEquals(expected, actual);
}
复制代码


单体测试类的方法可任意取名，不过建议以test开头简单易懂为好。在测试方法上打上[Test]的元数据标签，使它成为测试对象。
接下来，可以同样方便地建立包含测试用例类的测试套件。本例代码如下：
package jp.bizria.flex4.flexunit4.hello {

import jp.bizria.flex4.flexunit4.hello.HelloUtilTest;

/**
* HelloUtil测试套件。
*/
[Suite]
[RunWith("org.flexunit.runners.Suite")]
public class HelloUtilTestSuite {
//--------------------------------------
// Test Cases
//--------------------------------------

public var test1:HelloUtilTest;
}
}
复制代码


编写测试套件十分简单，只要在这个类中读入待测的测试用例类就OK了。如上面的代码中，给测试用例类取个简单易懂的变量名，就能对它进行控制了不是吗？
剩下的就只需在测试套件上右击鼠标选择运行就行了。
□ 注意点

使用FlexUnit时要注意的是，在测试类库工程时，不能直接在类库工程里面建立测试用例和测试套件类。必须要建立Flex工程，然后在其中建立测试类和测试套件类。
Flash Builder会在测试套件运行时，自动生成并运行测试用的应用程序。

【2】遵循编码规范「Flex Formatter」
Flex Formatter用来格式化ActionScript和MXML文件，是遵循编码规范用的工具。

[img]http://dl.iteye.com/upload/attachment/451801/2339e56c-634c-395b-b429-daf0d0507ee1.jpg[/img]


Flex Formatter | Download Flex Formatter software for free at SourceForge.net via kwout

在大规模项目中，交付符合编码规范格式的代码是理所当然的事情。但是在先前的Flex应用程序开发中，即使建立了适用于Flex的编码规范，也只能通过肉眼来进行代码审查。
由此，演变成了完全不做严格的代码审查，不遵守编码规范，开发人员之间的代码格式变得参差不齐。
而Flex Formatter让这些格式化代码成为可能。它是在SourceForge.net上发布的插件工具。将它安装在Flash Builder上就可以方便地进行代码格式化。
□ 特点
通过丰富的设置实现超详细的格式化策略
通过快捷方式（［Ctrl］＋［Shift］＋［F］）格式化（和Eclipse中Java格式化一样）
通过提高代码可读性带来生产率的提高

□ 格式化的设定
下图是格式化设定界面。

[img]http://dl.iteye.com/upload/attachment/451803/51f8bd8d-ecf6-33f7-87b9-9417e03c37c2.gif[/img]

图3　Flex Formatter的设定界面

具体设定类别如下：
General（一般）
ActionScript
Blank lines/spaces（空行、空格）
Newlines/wrapping（换行）
Tweaks（微调）
AS Rearranging（ActionScript重新排版）
Modifiers（修饰符）
Elements（元素）
Span/Headers（代码内分段）
Copyright
MXML

各类别都有详尽的设定，根据需要灵活应用吧。
【3】静态分析代码「FlexPMD」
FlexPMD是静态分析代码的工具，它静态地检查代码本身的质量。在Java领域，以FindBugs和PMD最为有名。
FlexPMD在提高代码质量上效果显著。通过使用FlexPMD，开发者本人、或其他开发者、甚至是其他公司的质量管理者也能方便地进行代码检查。在收到交付的代码时，也能进行检查。
□ 特点
全部82种规则实现彻底检查
可发现潜在Bug
可发现不推荐的编码方式
可发现可能影响性能的代码
可发现性能低下的代码
可通过Ant运行

不仅能检查编码规范和发现潜在的Bug，也能在一定程度上查出可能影响性能的代码。

□ 导入方法
　下面介绍一下FlexPMD工具的导入步骤：
从更新站点安装插件
FlexPMD工具的下载（JAR文件）
FlexPMD的设定
注册PMD和CPD的command-line-1.0.jar
路径中不能有半角空格
WorkSpace中不能有半角空格
□ 使用方法
导入FlexPMD后，从以下站点下载FlexPMD用的配置文件。

[img]http://dl.iteye.com/upload/attachment/451805/6b6a29a5-3d5e-3fd6-a8cc-6f35c01cb65c.gif[/img]

图4　FlexPMD设定站点

在上面的站点，可设置优先级（Error、Warning、Info），也可设置“忽略设置”。而且可导出XML格式的配置文件，因此也可以用文本编辑器修改默认的配置文件。另外，错误消息默认是英语的，也可通过修改配置文件修改成其他语言。
在包资源管理器中，右击项目，选择“Run FlexPMD”便能运行FlexPMD了。在FlexPMD视图中会显示检查到的错误信息。

[img]http://dl.iteye.com/upload/attachment/451807/110d5b3f-9e2b-3ad6-82c2-baf9a67c69a3.gif[/img]

图5　FlexPMD的运行

　下图为FlexPMD的运行情况。

[img]http://dl.iteye.com/upload/attachment/451808/a308b336-ff8f-385d-a20b-56bc4c3ba51a.gif[/img]

图 6 FlexPMD（结果）视图

通过查看这个运行结果不难发现FlexPMD的特点之一，即在FlexPMD配置中设定了“违反规则则报Error错误”的时候，会出现红色的Error警告，表明应用程序不能运行。这也意味着不修正这个警告，程序便不能进行测试。由此可见，通过FlexPMD达到了让开发者强制进行静态分析的要求。

□ 注意点
基本上若从项目开始阶段便导入FlexPMD，由于警告数量不多，开发者可以从容应付。但若从收尾阶段导入，则需要对所有现存的代码做静态分析，会出现大量的警告，这点需要注意。

【4】自动执行基于用例的测试「QTP」

基于用例动态地测试应用程序的实际行为是测试阶段最重要的任务。QTP就是这么一个能自动执行基于用例测试的工具。

[img]http://dl.iteye.com/upload/attachment/451811/5505cc66-9619-3def-9839-d0cf832caf21.jpg[/img]

日本HP HP Software HP QuickTest Professional 10.0 software via kwout


　“用例测试的自动化”是其特点之一。在测试中最费时费力的就是用例测试。对于应用程序来说，不管服务端和客户端进行了多大程度的单体测试和静态测试，页面之间不能正确转移就是毫无意义的。QTP能让用例测试自动化。

[img]http://dl.iteye.com/upload/attachment/451813/e1df5ff7-84b2-343d-849a-230b70853fa5.gif[/img]

图7　QTP的运行界面

□ 注意点
实际上QTP在Flex2时便支持了Flex的自动化测试，但却未受到注意。其中最大的原因是QTP的License费用。但若考虑到大规模项目的测试工时，就并非那么高价了。
虽有FlexMonkey等免费用例测试工具，但真正要用于基干业务应用程序开发项目等时，在功能上稍显不足。在实际中几乎不怎么使用它们。
在使用QTP时需要做些准备工作。在开发自定义组件时，需要做QTP对应。这点很重要，有必要在项目计划阶段就将开发工时增加10%~20%。当然，开发工时虽然增加了，测试工时却获得了大幅消减，这是使用QTP的好处。
　下面是使用QTP测试Flex时，非常有参考价值的URL：
使用QuickTest Professional测试ADOBE FLEX 4应用程序
Flex 4测试自动化插件

在开发Flex时，请务必参考Adobe公司提供的开发指南。（由于非常重要，这里再次强调）
□ 使用方法
一旦完成自定义组件的QTP对应之后，就能非常简单的用QTP做自动化测试了。
启动QTP，点击录制按钮。
像往常一样，使用鼠标键盘操作应用程序
结束一个用例后，点击QTP的结束按钮
根据需要在QTP上添加检查点
修改测试用例以检查画面上的值等

由此，以后只要运行所建立的脚本，就能随心所欲地进行多遍用例测试（回归测试）了。


【5】Flash Builder的「性能分析」功能

　Flash Builder具有性能分析功能。可以对Flex应用程序进行性能和内存泄露检查。

[img]http://dl.iteye.com/upload/attachment/451815/46019158-f65c-3426-a8b3-e7a7fb5f229e.jpg[/img]

内存使用量视图

请注意只有Premium Edition版本的Flash Builder才具有性能分析功能。