使用Taiko + Gauge进行自动化测试(一)

[toc]html

初识Taiko

先来了解一下什么是Taiko:“Taiko是一个免费开源浏览器自动化工具,由ThoughtWorks开发。它是一个node的库,Taiko使用Chrome Devtools API,它是为测试现代web应用程序而构建的。”node

因此对于Taiko来讲: 一、它是为测试Web应用而生 二、它基于Chrome浏览器git

关于Taiko简介中所提到的ThoughtWorks,若是有不了解的同窗能够跳转至此进行了解开发团队可能也将成为您框架选型评估的决策项)。github

环境安装

在安装Taiko以前,请确保您已经安装了NodeJs环境。若是您尚未安装nodejs,请跳转至Node官网 进行安装。web

对于开发工具,这里强烈推荐您使用 VS Code超强开发工具之一,不作解释)。若您还未安装VS Code,请跳转至VS Code官网进行下载安装。shell

在确保安装完成前两项基本支持环境以后,咱们就须要来安装Taiko了。npm

能够在桌面新建一个文件夹,好比“Taiko Demo”。打开 VS Code,点击左上角的“文件”,选择“打开文件夹”,而且选择刚才建立的文件。windows

在VS Code中打开“终端”。终端是VS Code 对命令控制台的集成,好比CMD,Powershell等,可让您不离开IDE就完成一系列操做。 选择VS Code上方的 “终端”,选择“新建终端”,固然您也可使用快捷键(ctrl + shift + `)。api

x

新建完成后,您将看到这样的窗口。(后续的操做将频繁用到此操做,请进行熟悉)。浏览器

接下来,在终端输入该命令:

npm install -g taiko

该内容为向全局环境安装taiko Node包。安装时间可能会有点久,由于taiko里面内置了一个100MB+的Chromium浏览器。

尝试Taiko

在终端输入 taiko ,就能够进入taiko的命令控制台。

若是您在VS Code终端获得错误提示:"由于在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。" 请使用该方法进行处理:《Powershell 没法运行脚本的处理方法》

进入taiko后您将获得这样的显示:

Version: 1.0.4 (Chromium:81.0.3994.0) Type .api for help and .exit to quit >

接下来输入 openBrowser(),您将看到taiko会开启一个浏览器。 而后执行 goto("baidu.com"),浏览器将跳转到百度首页。而后再次执行 write("博客园 句幽"),浏览器将在输入框内填充对于的内容。最后执行click("百度一下"),将模拟操做点击一下搜索。

接下来输入 .code ,您将看到刚才操做步骤的代码。 这是taiko为您自动生成的。

在VS Code中新建文件“first-case.js”。而后将刚才taiko为咱们生成的代码拷贝下来,复制到文件中。

此时该文件中的内容就至关于完成了咱们第一个Case: “打开浏览器,输入内容,点击搜索”。

taiko 执行过程

那么如今您可能会问,taiko是怎么执行的呢? 若是我要扩展一个用例该如何扩展呢?

先来看看咱们最开始输入的几个命令: openBrowsergotowriteclick。 这些都是taiko为咱们提供的内置命令。

也就是说 taiko 其实就是为我们提供了这些基于浏览器的基础操做指令,而咱们就能够用这些各类命令进行排列组合,完成对应的操做。好比 “点击”、“按压”、“输入”、“选择元素”等等操做,而这些全部的操做命令都在 taiko 官网 为咱们标注出来了。咱们只须要选取须要的命令进行操做就能够了。

好比我们更改一下操做:

await openBrowser(); await goto("baidu.com"); await write("句幽 博客园"); await link('句幽- 博客园').exists(); await click(link('句幽- 博客园'));

这样将会在百度搜索句幽的博客园,而后在点击跳转到句幽的博客园。

而这每个步骤都将会有一个验证,好比await link('句幽- 博客园').exists();,若是该页面没有获取到名称为"句幽- 博客园"的元素,将会验证失败。

而将这些步骤都转换为js代码,放置在我们的first-demo.js 文件中,而后在终端运行:

taiko first-demo.js

您将看到这样的结果:

[PASS] Browser opened [PASS] Navigated to URL http://baidu.com [PASS] Wrote taiko test automation into the focused element. [PASS] Clicked element matching text "百度一下" 1 times [PASS] Browser closed

成功和失败均可以直观的显示。 这些用例步骤放置到对应的文件中,最后再运行就能够获得测试结果啦。

结合Gauge编写用例

如今我们已经了解到了 taiko 是怎么使用的,它提供了各种操做浏览器的命令,供咱们排列组合完成模拟操做,最终获得自动化测试结果。

那么您以为它够简单吗?若是要和团队一同维护和编辑用例,它很方便吗? 显然不太好用。

因此此刻咱们将介绍另外的一个工具:Gauge。 它将以 taiko 提供的命令操做为基础,用更天然的操做方式来完成对应的操做。

在vs code的终端中输入这样的命令:

npm install -g @getgauge/cli

运行完成以后就完成了Gauge的安装。固然在Gauge的官网,它还提供了一个安装包。 以何种方式安装取决于你,不过此处我强烈建议您使用 npm的安装方式。

Gauge还提供了vs code的扩展支持,您能够在VS Code的扩展中(最左侧按钮)进行安装。

接着,在桌面新建一个文件夹gauge-demo,而后在vscode中打开。

在终端中输入:

gauge init js

运行完成后,将会获得Gauge的初始化项目。(vs code的扩展也提供了建立的命令,不过因为兼容问题常常会出现延迟,因此我建议您使用命令来初始化项目)。

x

初始化以后的项目如图。

使用Gauge

在使用以前,先为你们说明一下,Gauge它充当着一个什么样的角色: 首先要明白,taiko为咱们操做浏览器提供了便捷的指令,它使用js来编写。可是这就为我们测试团队创建了一个障碍,首先全员都得熟悉JS的写法,好比await等关键字等等,这无形提升了技术操做门槛。还有一点,咱们全部的案例都将已大量js片断代码来维护,无疑增大了维护成本。

那么gauge干了一个什么操做呢? 它创建于taiko之上,容许测试人员将某某关键词与某段JS相对应,好比("跳转" 对应 taiko 的Goto)。 这样有什么好处呢? 团队并不须要全员掌握JS了。频繁的操做用例能够统一为共同的指令,增长可维护性。

因此如今来看看Gauge提供的初始化项目,您很快就能明白:

查看test文件夹下面的step_implementation.js 文件。这里查看它的部分代码:

step("Goto getgauge github page", async () => {
    await goto('https://github.com/getgauge');
});

也就是说'Goto getgauge github page' 对应着 taiko 的操做 await goto('https://github.com/getgauge');

而后再看看specs文件夹下面的example.spec。对应部分为:

* Goto getgauge github page

这样,用例编写人员只须要写出这样的语句就能够完成操做了。而测试团队中的某一小部分人员,负责js对应关系的编写,功能测试人员负责用例的编写,就能很快的完成测试工做。

接下来咱们来尝试使用它,在test文件夹下面的step_implementation.js 文件中增长语句:

step("跳转到句幽博客", async () => {
    await goto("baidu.com");
    await write("句幽 博客园");
    await link('句幽- 博客园').exists();
    await click(link('句幽- 博客园'));
});

这部分代码熟悉吗? 这是我们刚开始使用taiko所写的代码。如今咱们将它包裹起来,对应到了跳转到句幽博客 这一指令。而后再到specs文件夹下面的example.spec添加对应操做:

## 跳转测试 * 跳转到句幽博客

文本指令 Gauge 采用了MarkDown的写法。咱们如今无需过去去了解markdown,只须要知道在spec文件中: # 表明的测试项目名,好比您能够命名(# 考勤分析测试),而## 表明了测试用例,好比您能够命名(## 添加考勤人员)。 * 表明了步骤,步骤的名称来源于您从js文件里的关键词对应。

最后在终端中执行:

gauge run [你的spec的文件名]

就能够进行测试,最终生成测试报告。

若是您安装了VS Code的Gauge插件,那么在进入'.spec'文件后,您能够看到每个用例上都有一个运行的按钮。点击就能够执行用例。

总结

本文以一个小案例来为你们介绍了什么是Taiko和Gauge,以及如何使用它。那么和传统的自动化测试相比,它有什么优点呢?以及在自动化测试框架百花齐放的今天,它和其它的框架相比有什么优劣势呢?(好比和Robot Framework相比)。以BDD(行为驱动开发)为核心理念的Taiko,是如何践行BDD的呢? 如何编写出更复杂的用例以及如何创建好的分区方式便团队成员维护等问题 都会在后期文章中为你们进行介绍。

原文出处:https://www.cnblogs.com/uoyo/p/12401366.html

相关文章
相关标签/搜索