Silverlight/aspx/ajax/mvc的UI自动化测试

简介: web前端的自动化测试,一般要能实现模拟鼠标点击、键盘录入、浏览器页面自动导航等功能,而且关键的是要对整个测试过程能自动录制并回放。 vs2010的SP2已经集成了内置功能,但是目前尚未正式发布,所以本文就不介绍了。

web前端的自动化测试,一般要能实现模拟鼠标点击、键盘录入、浏览器页面自动导航等功能,而且关键的是要对整个测试过程能自动录制并回放。

vs2010的SP2已经集成了内置功能,但是目前尚未正式发布,所以本文就不介绍了。有兴趣的同学可参考以下文章:

http://msdn.microsoft.com/zh-cn/library/gg413374

http://www.cnblogs.com/scottxu/archive/2011/02/28/1967112.html

除了微软自家即将推出的vs2010 sp2之外,不少第三方厂家也推出了相应的解决方案,比如Ranorex(园子里有兄弟写过入门文章:http://www.cnblogs.com/chenkai/archive/2010/09/28/1837457.html

而我要介绍的是telerik的Test Studio,下载地址http://www.telerik.com/automated-testing-tools.aspx 之所以选择它,理由很简单:它实在太容易上手了,不管新手老手,保证5分钟就能上手,而且支持几乎所有前端技术,包括ajax/aspx mvc/silverlight/wpf等.

先来体验一把,普通网站的测试:(拿百度开刀)

下载telerik的Test Studio后,它有二种运行方式,一是单独运行,二是以插件形式集成在vs2010中,为了方便起见,以下采用第二种方式

1、打开vs2010 创建一个Test项目

img_466a0f9085726dce878a94fa3e10cab5.jpg

2、开始录制测试过程

默认情况下,新建的项目已经有一个web Test项,而且会自动打开该项,如下:

img_9eccb782c2cbfb18786676b94f5d2082.jpg

点击Record按钮(图中红色圈出的部分),默认会启动浏览器,然后在浏览器地址栏里输入http://www.baidu.com/ ,注意一下vs2010中的变化

img_244d8ba7b9d5adc538ecdf7f5c8ec25a.jpg

已经自动记录下了当前动作: Navigate to :'http://www.baidu.com/'。然后我们在浏览器输入框里输入“菩提树下的杨过”,并点击“百度一下”

img_270646b53828db918bec7c7ea7210af0.jpg

可以看到,整个键盘录入过程,以及鼠标点击“百度一下”的动作,已经被记录。关掉浏览器,整个录制过程结束。(是不是想起了那句广告语:哪里不会点哪里,so Easy!)

3、测试回放

img_2b53e88aea6fd0f4ad6310311c946864.jpg

点击上图中的“绿色按钮”即可回放刚才的测试过程。

silverlight的UI自动化测试与普通网站的测试几乎完全一样,只是要事先配置silverlight的运行方式和起始页。因为SL有二种运行方式,一是浏览器模式运行,二是OOB模式运行,所以要告诉Test Studio,你想怎么玩。

项目右击-->新建项-->Web Test

img_5acf1373359a870ed9a60f5e405899d9.jpg

文件名键入“SilverlightTest.tstest”(当然你可以随便改),然后打开这个文件,如下图 :

img_ed56d2e91cbdd2b81b88a18c71d98f9f.jpg

点击上图工具栏中红线圈出的按钮进行配置,这次我们拿silverlight的官网来开刀

img_04e52ff5ad787158e186e67d58501e30.jpg

解释一下:Web Url即为嵌入有Silverlight的网页地址。点击OK关掉窗口,剩下的事情就跟刚才测试百度完全一样

我在页面的ShowCase动画上随便点几个,记录下的结果如下:

img_3f3623a8048d6e22a0c60a8afc3033d0.jpg

够简单吧,OOB的测试跟这个几乎一样,只是配置的时候指定SL应用的快捷方式路径即可。

注意事项:

在Silverlight的测试中,我发现偶尔会出现Test Studio无法连接到Silverlihgt的情况出现,以下是Telerik工程师给出的调试建议:

Known Issues:
-  Automation only supports XAP Silverlight app deployment (the .NET method). XBAP or Javascript Silverlight deployment is not supported.
- Connecting to the Silverlight App via https in Firefox or Safari is currently not supported.
Diagnostic Steps:
1) If the Web and Silverlight app is deployed locally, try adding a period (‘.’) after localhost, as in http://localhost.:
2) Delete the entire cache for the test playback browser
- In IE select: Tools -> Internet Options -> (Under General Tab) Delete -> Choose to delete Temporary Internet Files
- In  Firefox select: Tools -> Clear Recent History -> Select Everything in ‘Time Range to Clear’ drop down menu -> Choose to delete Cache
- In Safari select: Main ToolBar Drop Down Menu -> Reset Safari… -> Choose to ‘Empty the cache’
3) Try increasing the (Settings.) SilverlightConnectTimeout if the Silverlight app has a longer load time
4) Try setting externalAccessfromCrossDomainCallers to script only in your application's AppManifest.xaml file by doing the following in your html page and Silverlight manifest:
a) Example for html page:

<param value="true" name="enableHtmlAccess"/>
<div id="silverlightControlHost">
<object height="300" width="300" type="application/x-silverlight-2" data="data:application/x-silverlight-2,">
<param value="http://a-remote-domain.com/ClientBin/SilverlightClient.xap" name="source"/>
<param value="white" name="background"/>
<param value="3.0.40723.0" name="minRuntimeVersion"/>
<param value="true" name="enableHtmlAccess"/>
<param value="visOnly=true" name="initParams"/>
<a style="text-decoration: none;" href="http://go.microsoft.com/fwlink/?LinkID=149156">
<img style="border-style: none; width: 400px; height: 200px;" alt="Install Microsoft Silverlight" src="http://storage.timheuer.com/sl4wp-ph.png"/></a></object>
<iframe style="border: 0px none ; visibility: hidden; height: 0pt; width: 0pt;"/></div>

Example for SL Manifest:

  <Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment"
  2:         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  3:             ExternalCallersFromCrossDomain="ScriptableOnly"
  4: >
  5:     <Deployment.Parts>
  6:     </Deployment.Parts>
  7: </Deployment>

(see this Microsoft forum thread for more information: http://forums.silverlight.net/forums/p/101955/340407.aspx)

4

) Try setting the "windowless" property for your Silverlight app as "false"
Example (similar to Step 3 html example):
<object id="xamlHost0" width="900" height="412" type="application/x-silverlight">
    <param value="transparent" name="background"/>
    <param value="true" name="windowless"/>
    <!-- a bunch of other params go here -->
</object>

5) Check the headers your server is sending for the Silverlight Page by:
- Install/Run Fiddler and load your Silverlight page.
- Click the response for the .xap file.
- Click Inspectors -> Headers.
There should be an entry: Content-Type:application/x-silverlight-app
This must be in the response in order for the WebAii Framework, Design Canvas, or WebUI Test Studio to detect the Silverlight App.

虽然是英文,但是并不复杂,只要对照红色标出部分一般都能解决。

最后,我提供一个小技巧,也有助于解决这个问题,测试Silverlight录制时,如果启动录制后浏览器无法自动跳转到指定的Web Url,可以手动在浏览器里输入网址,一般情况下Test Studio就能识别出当前页面有Silverlight。

目录
相关文章
|
3月前
|
前端开发 测试技术 API
UI自动化与API自动化已经开始互斥了吗?
UI自动化与API自动化已经开始互斥了吗?
|
1月前
|
Linux API Android开发
Airtest UI自动化框架 v1.1.4
Airtest UI自动化框架 v1.1.4
25 3
|
2月前
|
JavaScript 前端开发 Java
jquery ajax+spring mvc上传文件
jquery ajax+spring mvc上传文件
|
8月前
|
jenkins 测试技术 持续交付
基于Jenkins+Python+Ubuntu+Docker的接口/UI自动化测试环境部署详细过程
基于Jenkins+Python+Ubuntu+Docker的接口/UI自动化测试环境部署详细过程
337 1
|
9月前
|
前端开发 JavaScript Java
如何对使用React和EMF parsley设计的Web UI应用程序进行测试自动化
Web UI应用程序是指通过Web浏览器访问的应用程序,它们通常具有复杂的用户界面和交互逻辑。为了确保Web UI应用程序的功能、性能和用户体验,测试自动化是一种有效的方法,它可以在不需要人工干预的情况下,快速地执行重复的测试任务,并提供可靠的测试结果。本文将介绍如何对使用React和EMF parsley设计的Web UI应用程序进行测试自动化,以及使用HtmlUnitDriver和java代码实现的示例。
如何对使用React和EMF parsley设计的Web UI应用程序进行测试自动化
|
7月前
|
Web App开发 JSON JavaScript
SAP UI5 自动化测试工具的 qunit-redirect.js
SAP UI5 自动化测试工具的 qunit-redirect.js
52 0
|
7月前
|
前端开发 测试技术 BI
SAP UI5 的自动化测试套件页面的开发步骤介绍
SAP UI5 的自动化测试套件页面的开发步骤介绍
51 0
|
7月前
|
Web App开发 前端开发 测试技术
SAP UI5 应用开发教程之八十三 - SAP UI5 的自动化测试套件页面的开发步骤介绍试读版
SAP UI5 应用开发教程之八十三 - SAP UI5 的自动化测试套件页面的开发步骤介绍试读版
30 0
|
9月前
|
数据采集 Java 测试技术
03-UI自动化遍历工具-appcrawler
03-UI自动化遍历工具-appcrawler
|
9月前
|
测试技术 API 数据安全/隐私保护
搭建禅道环境作为练习UI和接口自动化测试对象
搭建禅道环境作为练习UI和接口自动化测试对象
85 1