博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【技术干货】测试Angular项目的正确姿势
阅读量:6219 次
发布时间:2019-06-21

本文共 1207 字,大约阅读时间需要 4 分钟。

满世界都在整蛊开玩笑!

我们就是要正正经经讲技术!

有技术就是这么傲娇!这么任性!

我说明天放假!你信吗!连放三天你信吗!

爱!信!不!信!

3250009d9d13d11430c

以下正文

(翩baohuhaonideyanjing

3e8000598d700c0f627

本文作者:上海驻云开发实施工程师 (实 shi 力 li wu wang方!舟!

在Web自动化测试方面,Selenium得到了广泛的应用,Splinter基于Selenium封装了更上层的API,用来方便测试人员编写用例,但我们使用Splinter测试我们的Web应用时发生了一些问题。

3e4000705ac737a0dc1

以上是一个简单的登录测试用例,看上去没有任何问题,但是最后的assert永远是失败的,因为我们使用了Angular,整个网站是全异步的,在执行那条assert的时候登录接口还未返回,而页面并没有进行重新加载,Splinter不会等待便会直接进行assert。

最简单直接的解决方法当然是在assert之前sleep一段时间,这个时间可以根据我们应用的实际响应速度进行调整,例如500ms,但是作为一个有强迫症的程序员,如此dirty的方法当然是不能接受的。

于是我跟我们公司的前端工程师讨论了一下(就是题图里面右边那个吐舌头的绅(hen)士(tai),对,我就是旁边那个福禄娃),给我们程序的rootScope设定一个counter,然后给rootScope一个interval,interval执行的内容是当counter为0的时候给body标签加一个pageReady的class,不为0就去掉,将我们封装过的发送http请求代码内发出时将counter加1,请求完成时-1。

JavaScript相关示例代码如下:

3e50006fdd7a258e506

而后在Splinter中加入检查的代码,根据body的pageReady来进行检查,当然也需要有一个次数限制,毕竟页面有可能挂掉或者怎样,如果超过次数限制了也跳出,例如我在示例代码中写的是10次,在实际使用中可以根据场景调整这个时间。

Splinter中检查相关代码如下:

3e70007030b0473203f

然后将最开始那个登录的代码加上wait_page_ready,改为:

3e8000598d588445ae3

其实visit后也要加入wait_page_ready,因为页面也有可能是异步加载的,最开始的例子中到assert才报错是因为刚好我们的login页面整个layout是一体的。

然而在编写测试用例时在每个正确的地方添加wait_page_ready太麻烦而且太不优雅了(知乎上多了干什么都要优雅一点),自然需要自动加一一下,以下代码则是自动给测试用例的visit,click等事件之后加上wait_page_ready。

3250009d9d25b6c76d4

好了,现在使用这个run方法来跑测试最开始那个测试用例,优雅并准确的解决了异步加载的Angular Web应用的自动化测试问题。

好啦~~~本文到这里也就结束啦~如果还希望了解更多相关知识的话,就赶紧订阅我们吧~~~

转载地址:http://oymja.baihongyu.com/

你可能感兴趣的文章
“死”法不重样,一根数据线如何从“机器伴侣”变身电脑杀手?
查看>>
CountDownLatch详解
查看>>
云时代重新定义主机安全:自动化安全闭环是核心
查看>>
abap选择屏幕工具栏按钮问题
查看>>
【Java】I/O类库
查看>>
WPF 4 Ribbon 开发 之 标签工具栏(Tab Toolbar)
查看>>
传闻 Android Q 将支持手机应用版本回滚
查看>>
Visual Studio Code 1.33 发布
查看>>
jQuery幻灯片播放器插件
查看>>
并发——读写锁初探
查看>>
BAT研发面试36题总结:Spring+Redis+Docker+Dubbo+高并发架构
查看>>
Android Animation(动画)---基础二(LayoutAnimationController)
查看>>
python docx文档转html页面
查看>>
阿里如何做到在线业务百分百容器化
查看>>
死锁查看处理(三)
查看>>
rabbitmq 启动与停止
查看>>
浅谈unicode编码和utf-8编码的关系
查看>>
LinuxOS
查看>>
12月5日云栖精选夜读 | 埋在 MySQL 数据库应用中的17个关键问题!
查看>>
实现抽屉列表-微信小程序
查看>>