UI自动化搭建,顾名思义,是指利用自动化工具和技术来构建、测试和部署用户界面(UI)的过程。它涵盖了从简单的UI元素定位和操作,到复杂的业务流程模拟和性能测试的方方面面。通过自动化重复性任务,UI自动化搭建可以提高测试覆盖率,并减少人为错误,从而提升软件质量和用户体验。
需不需要UI自动化?
我不知道,有多少小伙伴接触或者开发过UI自动化的相关内容,相信有这方面经历的小伙伴肯定在使用过程中或多或少的遇到过很多问题,所以我觉得首先应该考虑的问题是哪些场景适合使用UI自动化,现在的业务系统都很复杂,UI自动化并不能完全覆盖所有的场景,甚至可以说,只能覆盖一部分场景。所以在开发UI自动化的过程中,这是首先要考虑的问题。
什么是ui自动化?
UI自动化,即用户界面自动化,是指使用软件工具自动执行对用户界面(UI)的操作和测试的过程。UI自动化通常用于软件开发中的测试阶段,以确保应用程序的用户界面按照预期工作,并且用户交互能够产生正确的结果。
我们是怎么搭建UI自动化平台?
平台流程图
我们的自动化平台可以简单的展示为上图,首先我们在前端代码中标记testid用于捕获页面元素,为了捕捉页面行为,我们开发了浏览器插件,插件收集到页面动作,打包数据发送给测试管理系统,测试管理系统的主要功能是管理所有的测试用例,执行用例,并将结果输出至管理系统,或者上传至分析系统
平台的搭建涉及哪些技术?
整体来说分为三块,浏览器插件开发技术,前端技术和后端技术,前端是使用Umijs搭建,后端使用Nodejs搭建,后台服务用Eggjs,测试框架使用Playwright,数据库Mysql.
为什么要使用Playwright?
Playwright 是一个用于自动化浏览器操作的 Node.js 库,由 Microsoft 开发,提供可视化录入。最初选择Playwright是因为可以可视化的录入测试用例。其次,因为Playwright背靠微软的,后续迭代有保证。并且,Playwright可以很方便的跟踪测试过程。
为什么要开发浏览器插件?
虽然Playwright可以可视化的录入case,但是局限性很高,比如在playwright中无法自动生成断言,无法自动生成延时操作,无法等待元素出现等功能,这些都需要手动添加代码,这给录入测试用例带来了很大影响,所以我们开发了浏览器插件,通过插件来获取元素及行为,然后添加操作或者断言。针对浏览器数据怎么映射成测试用例,后续会继续介绍。
我们为什么要在代码中添加testid?
我们都知道网页的元素变化是很频繁的,这会给元素的查找带来很多影响,虽然可以通过id,class,Xpath等定位元素,但是复杂的单页面系统,class是会经常变化的,这就会导致定位元素不准确,会导致很多未知的bug,所以我们选择了在前端元素中标记testid,通过testid的全局唯一,来保证查找元素的稳定性和正确熊。
结束语
本篇大体介绍了UI自动化平台的搭建整体思路,相关细节会在之后的文章中体现,有问题可以交流