UI自动化体系建设的创新实践
UI自动化体系建设的创新实践
全部原谅 发表于4个月前
UI自动化体系建设的创新实践
  • 发表于 4个月前
  • 阅读 0
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 新注册用户 域名抢购1元起>>>   

摘要: 阿里资深研发工程师开风为大家带来了《分层自动化之UI自动化体系建设》分享,他主要从UI自动化之痛和UI自动化体系建设之创新实践两部分,详细讲解了云效团队在UI自动化体系建设方面的宝贵经验。

在云效持续集成持续交付专场直播中,阿里资深研发工程师开风为大家带来了《分层自动化之UI自动化体系建设》分享,他主要从UI自动化之痛和UI自动化体系建设之创新实践两部分,详细讲解了云效团队在UI自动化体系建设方面的宝贵经验。

 

 

以下内容根据讲师PPT和视频整理而成。

 

UI自动化之痛

 

03d4f0c12bba0ca8bbb682b9e11dd5bbf7aa8ad8 

 

上图左侧的柱状图是从2010年12月到2014年12月中国网站数量增长情况,可以看出目前中国网站的数量呈现平稳递增的局面,网页的数量也呈现出大幅度上升。如此数量的网站和网页,以及迭代速度越来越快的互联网项目和越来越多的功能,手工地进行回归、前端UI方面的测试完全不能达到要求。

 

c7f4b534790f287fd0ad0c09678c2a9f3aaa49c7 

 

当前主流的UI自动化框架主要分为两种模式:一是编写脚本代码;二是通过录制生成脚本代码。上图对这种两模式从创建脚本、维护调试、排错成本、手工测试四个维度进行了对比:前者在编写脚本代码上耗时较长,而后者主要时长集中在维护调试这一步骤。由于互联网行业的业务变更、页面变更较快,且人员流动性较强,脚本的交接、保持脚本的稳定性等问题,也成为UI自动化过程中的痛点。

 

并且,目前浏览器的种类越发繁多,如IE、Chrome、火狐、safari等等,如何通过写一次脚本或录制一次脚本就实现多浏览器的测试呢?这一问题也深深困扰着UI自动化的开发人员。

 

云效团队的创新理念主要包括高效、简单、质量三点:

  • 高效是让自动化成为一件高效的事情,哪里不高效,就在哪里创新;
  • 简单是指降低自动化技术门槛,让大妈也能玩转自动化;
  • 质量是指快速维护,能持续保证产品质量。

 

UI自动化体系建设——框架模式

 

除了上文提到两种主流模式(第一种是编写脚本代码(webdriver),通过封装形成自身的脚本自动化;第二种像QTP和selenium IDE之类的录制->生成脚本->维护脚本)。目前阿里结合自身的创新实践,提出了第三种模式:录制脚本->生成数据->最终生成可维护的可视化数据,实现录制、维护双可视化,而非维护代码。

 

那么UI自动化体系建设的必备要素有哪些呢?

 

201fcd6a811acb2986b91b7e29459dd40c05abcc 

 

首先要具有很好的录制技术;其次维护时需要降低成本,实现维护可视化;还需要在录制过程中需要设置一些检查点,对一些数据进行参数化;其他如脚本管理系统、控件定位算法、数据驱动、公共脚本、执行调度、执行驱动、执行监控、执行框架可插拔都是UI自动化体系建设的必备要素。

 

UI自动化体系建设——关键点

 

UI自动化体系建设的关键主要有四点,分别是:(1)录制准确性(前提);(2)维护成本;(3)执行稳定性;(4)报告和错误排查,下面来一一详解。

 

录制准确性——抓取元素

 

在录制过程中,元素的抓取是最为关键的,元素抓取的完备性决定了后续定位控件的准确性。

 

如在录入框内输入“123456”,在录制过程中需要采集基本信息,一是元素对象本身,常见的是<input>输入框;其次是在该元素上的动作,这里是set;还包括所输入的数据“123456”。根据这些采集到的元素的基本数据,就可以生成element.set(data)这一测试代码。

 

那抓取元素一定需要抓取哪些信息呢?

 

首先是元素基本的ID、class、text、tagName等属性需要抓取;其次是xpath(相对)路径,它可以通过一些工具自动生成;此外,还需要抓取相似元素在页面的索引;最后需要注意匹配度,它用于排除误定位。下面来分享一下录制过程中踩过的坑。

 

Iframe中元素抓取和定位

 

传统行业的页面经常使用iframe嵌套,当需要录制多层嵌套中元素时,需要将嵌套的层级和元素自身的信息抓取下来,形成元素信息结构化数据。由于跨层之间的iframe之间无法直接通信,当面临这种情况时,采用何种方式才能保证元素抓取的准确性呢?在UI自动化执行阶段中,遇到iframe首先需要switch到这个iframe中,然后定位该元素后,再做一些执行动作。

 

那么面对多层嵌套的iframe,如何准确的抓取并且形成稳定的元素信息结构供后面的定位呢?

 

662e7884497731bc18181a217e843047c7d8be88 

 

上图描述了一种iframe中简单元素抓取和定位的机制:首先,通过JS注入的方式往各个iframe中注入代码;之后再通过window、postMessage等通信协议进行消息的发送和同步;在后台中心对iframe和top window之间的消息转发,进行循环元素定位,最终抓取出元素,抓取的元素结构包含top window->iframe->iframe->iframe->元素,这种结构阻止了在后续元素定位时出现控件定位失败的情况。

 

录制准确性——抓取元素——精确选择

 

944c8d5b8b5227e997a50dcfad1b1b5b2dda6f41

 

另一个需要注意的坑是精确选择。在录制过程中,多个Dom树节点可以表示一个元素,这就导致录制选择框选择dom节点不定。当通过录制选择框选择的元素可用来定位的信息太少时,可能导致执行时定位元素失败。如果采用精确选择或者精确定位机制,会有效地规避此类问题,例如在选择元素时,选择元素信息丰富的div节点,进而有效提高控件定位的准确性。精确选择实现起来比较简单,通常是将当前节点的所有父节点和子节点都抓取之后,结合整体Dom树结构,选择元素信息丰富的dom树节点来表示元素。

 

录制准确性——漏录

 

利用Selenium IDE录制框架录制淘宝上点击已买到宝贝这一动作时,首先需要将鼠标移动到“我的淘宝”元素上,才会触发下拉菜单,然后才能看到“已买到的宝贝”这一按钮,之后才会录制点击已买到的宝贝这一动作。面对这种情况,很多使用者都会漏录移动鼠标到“我的淘宝”这一步骤,进而使得在执行阶段丢失“已买到的宝贝”这一元素;此外,其他如漏录滚动条滚动动作,都会导致后续控件定位失败的现象。面对这些漏录动作的场景,应该如何处理呢?

 

自动生成方式可以解决这一问题,阿里内部自创了自动生成录制方式:在页面录制时,进行事件监控,当监控到鼠标移动、点击、滚动条滚动等动作时,在这些事件发生的前后分别做一个dom树快照,然后对比这两份快照,看新增了哪些元素。对于这些新增元素进行检查,如果元素上有特定标记时,说明该元素是有前置动作的,如果录制了相应的前置动作,则移除该标记;如果没有录制响应的前置动作,则会根据这一标识查找具体需要录制的哪些前置动作。

 

解决漏录问题能够有效提升了执行的成功率,降低了维护成本,使得录制完成后生成的脚本高可用。

 

录制准确性——数据和环境初始化

 

数据和环境的初始化也是录制准确性的前提。在执行录制动作的前后,发送Http请求或支持这种机制,或者进行数据库初始化以保证在录制过程中环境稳定、数据冗余正常,排除环境和数据对录制过程的干扰,进而提高脚本录制的质量。

 

维护成本

 

下面来谈一下维护成本。

 

ba4bd5c81ba240b30245bccdee52449937b6ba9f 

 

降低维护成本主要从三个方面入手,分别是:

 

  • 可视化维护,区别于常见的录制框架,可视化维护不需要维护代码,降低了技术门槛,只需维护操作界面,就可以实现UI自动化;
  • 录制元素信息批量更新,例如在页面登录场景,很多脚本都需要录制登录这个动作,之后才能录制其他动作,如果一些常见的公共场景,如登陆密码框结构发生变化,可以利用录制元素的批量更新这一机制;
  • 公共脚本是将如登录之类的场景提取出来做成一个公共脚本,使得录制过程中公共点可以使用公共脚本实现,实现业务脚本的可拼装,进而降低了生成、维护脚本的成本。

 

执行稳定性

 

执行稳定性的前提是元素定位,之后再对元素进行点击、下拉等操作。因此,公司需要有一套自己的空间定位算法,这套算法准确性是基于之前录制元素准确性的,录制信息越完备,算法定位越准确。这类算法一般是多种定位方式相结合,按照ID、Class、Text、TagName综合定位,直到定位到所需元素;对于相似元素,可以按照相对位置或者相对索引进行定位,以及利用Xpath进行最终定位保证,还可以利用相关的匹配度计算来排除误定位。

 

执行稳定性——脚本执行

 

在保障执行稳定性方面,首先需要有执行监控,它能够保障在执行过程中每个动作都能被良好地监控;其次要做到多执行框架可插拔,随时做好框架的可扩展性,并行保证执行稳定性;此外,需要保障一次录制,多浏览器执行。

执行完成后需要进行执行校验,来校验操作是否成功。常见的检查点包括文本检查、数值检查、元素属性检擦、页面URL检查、Cookie值检查、数据库表内容检查、弹出框检查。

 

报告和错误排查

 

执行完成之后,假设脚本执行失败之后如何帮助用户快速定位问题,这就需要完善的报告和错误排查机制了。

错误排查主要包括:

 

8d8e6ad36dbf2e350334437c200bc2b14df70312 

 

执行报告和执行日志,执行完成之后需要向用户提供一份完善的执行报告,让其了解执行的过程以及每次执行是否成功,如上图所示,详细罗列出各类信息。

 

abe6af3a46169b680158ed2a1a100f53bc5b43fe 

 

步骤截图,它帮助用户进一步定位当时执行场景的信息。

 

4d8f0ad762aaed0c08cf8a5bc0d18ed8566b2453 

 

错误分类,通过错误分类机制引导用户关注UI自动化框架的特点,更好地排查问题。

 

除了上述谈到的方式,在UI自动化体系建设中,还有一些其他措施,如脚本编译模块、报告中心、执行监控系统、执行代理、分布式执行调度系统、定时调度系统等。

 

UI自动化体系建设——扩展性

 

在扩展性方面,对于非常见的页面,需要支持自定义编码,对于特殊要求的用户,应该支持组件化开发;同时,整个自动化体系建设需要进行生命周期管理,具体可以分为脚本执行前后、动作执行前后,在执行生命周期中插入一些代码以满足执行脚本的可扩展性。

 

UI自动化体系建设——数据中心

 

最后来谈一下数据中心。无论是UI自动化还是接口自动化,都需要有很好的数据最支撑。在录制过程中,如登录账号,不可能实际地去注册,需要有完善地数据中心服务统一提供执行账号密码,以及订单号、会员ID等。

 

技术成就未来

 

目前,阿里云效团队将阿里内部的技术整合,推出了持续集成、持续交付一站式平台,通过项目管理流程和专项提效自动化工具,真正实现24小时持续集成持续交付:

 

阿里云——云效平台:  http://yunxiao.aliyun.com

原文链接:https://yq.aliyun.com/articles/142115

共有 人打赏支持
粉丝 2
博文 25
码字总数 1041
×
全部原谅
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: