使用 Docker 部署前端自动化测试的尝试(一)

导语

自动化测试是一个老生常谈的话题,往往应为界面变化太快,测试脚本更新跟不上需求变化而作罢。所以打算引入能自动生成测试脚本的 uirecorder 这一开源工具。并且配合使用 Docker 来加快测试环境的部署。

现状

自动化测试的重要性大家都有共识,在 web 前端领域大家做的比较完善的基本上还是在基础类库和公共方法上的单元测试。因为这一块代码比较稳定,单元测试的工具也比较完善。但是前端的大部分工作是在和界面打交道,把打比喻成一种特殊的 GUI 软件也会会更形象一点。所以模拟用户操作的自动化测试能更多的覆盖我们的业务逻辑。

那为什么目前的自动化测试普及率还是不高呢?这里引入业界的一个公式:

自动化的收益 = 迭代次数 * 全手动执行成本 - 首次自动化成本 - 维护次数 * 维护成本

往往就是因为写测试用例的耗时(首次自动化成本)加上需求变化(维护次数)大,导致自动化的收益回报低。所以业界一直在探索一些工具来降低这些成本。

UI Recorder

经过一些调研,觉得 uirecorder这套开源工具方便易用,能通过让使用者自己跑一遍测试流程而自动生成对应的测试脚本,简化编写脚本的过程。于是决定尝试尝试。

使用 uirecorder 需要 Node、Java 的环境。在环境准备好后通过

npm install uirecorder -g

命令安装,然后新建一个文件夹在其中使用

npm init

初始化配置后就可以开始录制脚本了。

具体使用可以参考它的文档和这个 视频介绍,这里就不赘述了。

录制脚本生成之后可以手动跑一跑刚才的 case

1. 启动 WebDriver 服务:

npm run installdriver

npm run server

2. 在新窗口运行单个脚本:

source run.sh sample/test.spec.js

然后我们就可以看到测试运行的整个流程。

通过使用录制的方式生成脚本,能大大加快我们开发测试用例的的速度,一旦需求界面发生变化,我们可以迅速同步测试用例。

引入 Docker

解决了脚本生成的问题,我们还想让整个测试的体系更加高效敏捷。我们知道前端的另一大苦逼之处就是要做浏览器兼容,各大浏览器都通过了才算大功告成。所以自动化测试也需要在各个浏览器下运行。

因为自动化测试时独占的,所以往往需要一个浏览器部署在一个测试机上来并行测试。而这样导致太多的资源的消耗,也成为自动化测试普及的一个瓶颈。

庆幸这是一个好的时代!我们有了 Docker 这一神器。Docker 有秒级启动、应用隔离、良好的可移植性的优点,完全使用沙箱机制,相互之间没有任何接口。而且性能开销小,可以很容易地在机器和数据中心中运行。最重要的是, 他们不依赖于任何语言、框架或系统。

很自然的,我们想尝试尝试这两者结合起来的力量。

生在开源时代的 Docker 也自带开源属性,在 Docker Hub上我们能找到非常多的镜像地址,不需要我们一步一步的从零开始构建我们自己的镜像。

使用 Docker

回到我们的主题,我们需要的是利用 Docker 来构建我们的测试环境,这样可以很方便快速的部署到测试机上,并且后期扩展也非常容易。

要跑我们的测试用例需要 selenium 和浏览器的环境,docker hub 上有专门的一个镜像系列:https://hub.docker.com/r/selenium/

这里面包含了基础环境的镜像,包含各种浏览器 Selenium standalone 的镜像。我们先使用 hub 和 node-chrome 来试试水

  • selenium/hub: 运行 Selenium Grid Hub 的镜像
  • selenium/node-chrome: 包含 Chrome 的 Selenium node 镜像需要连接 Selenium Grid Hub 使用

首先我们把这两个镜像拉去到本地:

docker pull selenium/hub
docker pull selenium/node-chrome

然后先后把两个镜像跑起来:

docker run -d --name hub -p 4444:4444 selenium/hub

这个命令解释一下几个参数:

  • -d 如果在 docker run 后面追加 -d=true 或者 -d,那么容器将会运行在后台模式。
  • --name 容器识别参数,如果你在执行 docker run 时没有指定 \--name,那么 deamon 会自动生成一个随机字符串 UUID 作为标识符。所以有个 name 会非常方便,这里我们指定 name 为 hub。
  • -p 发布特定端口,显式将一个或者一组端口从容器里绑定到宿主机上(hostPort:containerPort)
docker run -d -P -p 5901:5900 -p 15000:5555 --link hub:hub selenium/node-chrome
  • --link 多容器应用程序里使用 \--link name:alias 在消费和服务容器之间创建链接

然后在跑 uirecorder 的项目中的 config.json 文件中,修改 webdriver 的 port 参数:

 "webdriver": {
        "host": "127.0.0.1",
        "port": "15000",
        "browsers": "chrome"
    },

这里的 port 15000 就是在上面的 docker 启动命令中指定的。接着使用之前 run testcase 的命令(source run.sh)启动就可以看到 case 跑起来了,而且本地浏览器并没有启动。因为这是的浏览器是启动在 docker 容器中了。

下一步

之前的尝试中,最后一个测试环境也就是 uirecorder 的测试环境并没有在 docker 容器中,其实我们也可以吧组后的环境也 build 成一个 docker 容器,这样部署起来才更畅快。接下来会继续尝试这一步的改进,并真正部署到测试环境中,并结合定时脚本,邮件报警机制完善我们的流程。

且看下回分解。

原创声明,本文系作者授权云+社区-专栏发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏JetpropelledSnake

Python入门之软件开发目录规范

本章重点:     理解在开发人标准软件时,如何布局项目目录结构,以及注意开发规范的重要性。     一、为什么要有好的目录结构     二、目录组织的方式  ...

3805
来自专栏xdecode

Java读取打印机自定义纸张.

打印出现截断? 对于自定义纸张打印, 一定要先在打印机配置那边添加, 不然会出现截断. 例如打印1000*500, 出来是正常的, 打印216*139, 出现了...

20910
来自专栏happyJared

IDEA快捷键拆解系列(后记)

  对于绝大多数开发者而言,把一款编辑器用熟了之后,再突然切换到其它款的编辑器的话,这个适应阶段一般都比较艰辛和漫长。但博主有理由相信,大神级别的程序员总是会先...

382
来自专栏JavaWeb

使用Spring profile 多环境配置管理

3478
来自专栏蛋未明的专栏

nodejs学习指南

1886
来自专栏SDNLAB

如何向ONOS社区贡献代码

ONOS是业界首个面向运营商业务场景的开源SDN控制器平台,主要面向服务提供商和企业骨干网。由于ONOS是完全开源的项目且面向全球的开发者开放,对于项目的管理有...

3247
来自专栏杂烩

一个综合的分布式项目之性能测试 原

    项目托管到gitlab其实和托管到github并无区别,和osc-git一样都是一个项目托管平台,gitlab适合那么想要代码知识产权不希望公开的公司使...

574
来自专栏杂文共赏

如何构建NodeJS微电影服务并使用docker部署

在本系列中,我们将构建一个基于NodeJS微服务,并使用Docker Swarm集群进行部署。

1343
来自专栏北京马哥教育

自动化代码发布系统实现

日常运维问题 在我日常运维工作中,代码发布可能是最普遍的一项工作之一,尤其是网页代码的更新,碎片化发布需求非常频繁。在前期开发人员比较少时,还可以由自己 来上服...

4648
来自专栏架构师之旅

《Spring敲门砖之基础教程第一季》 第一章(4) Spring 开发工具及开发环境配置

回顾 上一节,我们主要讨论了Sping的历史版本演绎,从无到有,从发布版本1.0到5.0的功能特性分析,并且对现在正在开发5.0版本充期许。随着Spr...

1767

扫码关注云+社区