前端单元测试基础介绍

《前端单元测试基础介绍》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、前端单元测试入门与实践一个实例在一个统计客户端信息的js中，写一个方法，从userAgent字符串获取浏览器引擎，名称，版本号等信息，要求能处理最常用的一些浏览器function_getBrowserInfo(ua){…………returnoBrowser;}最后采用的形式这个方法的测试用例YUI().use("test",function(Y){window.Y=Y;vartestCaseBrowser=newY.Test.Case({setUp:function(){this.testFun=window.

2、_getBrowserInfo;},testBrowserName:function(){for(vari=0;i

3、……//runalltestsY.Test.Runner.add(suite);Y.Test.Runner.run();});执行测试多浏览器自动执行测试用例代码的演化过程从最开始的需求，到现在最后的成品代码+测试用例，中间是如何演化的？原始需求在一个统计客户端信息的js中，写一个方法，从userAgent字符串获取浏览器引擎，名称，版本号等信息，要求能处理最常用的一些浏览器我们开始设想和编写代码if(!window['analizer']){window['analizer']=newfunction(){

4、varua=navigator.userAgent;……self._getBrowserInfo=function{/***codetoprocessuseragentstring*/……returnoBrowser;}}我们需要支持常用各大浏览器于是我们刻苦钻研，甚至找了曾哥写出了超简一行正则出结果的代码function_getBrowserInfo(ua){varoBrowser={};varmatch=ua.match(/(opera

5、ie

6、firefox

7、chrome

8、version)[s/:](

9、[wd.]+)?.*?(safari

10、version[s/:]([wd.]+)

11、$)/)

12、

13、[null,'unknown',0];varmode=match[1]=='ie'&&document.documentMode;oBrowser['browserName']=(match[1]=='version')?match[3]:match[1];oBrowser['browserVersion']=mode

14、

15、((match[1]=='opera'&&match[4])?match[4]:m

16、atch[2]);oBrowser['browserLanguage']=(navigator['browserLanguage']

17、

18、navigator['language']).toLowerCase();returnoBrowser;}一行正则检测五大浏览器名字，版本号，语言然后我们来验证依次打开各大浏览器，逐个检验，ok啦～接着要获取操作系统信息我们刻苦钻研，甚至找了曾哥写出了简洁获取系统信息的代码。function_getOSInfo(){varoOS={};…………returnoOS;}然后我们来

19、验证打开目前使用的系统上各大浏览器验证一下打开虚拟机跑xp验证一下打开虚拟机跑Linux验证一下打开mac验证一下发现了一个bug！修改代码，本例中代码互不影响，如果有时候进行了抽象和提取，修改基础方法还需要回归所有功能验证：打开当前系统五大浏览器验证一下打开虚拟机跑xp验证一下打开虚拟机跑linux验证一下打开mac验证一下终于初步开发完了这时发现其实我们还要获取移动操作系统的信息需求提出/变更开发->验证->开发……打开iPhone验证一下打开iPad验证一下打开iTouch验证一下打开安卓验证一下打开w

20、indowsPhone验证一下……IntroductingYUITEST结构业务代码测试代码xxTest.htmlyui-min.jsae.jsrun.jstest.js测试代码vartestData_fun_getInfo=[/**datatemplate:*[#ua#,#wordlist#,#name#,#version#]*/["Mozilla/5.0(WindowsNT6.1;WOW64;r