Use Taiko + Gauge automated testing (a)

Hatsu识 Taiko

Let's look at what is Taiko: "Taiko is a free of open-source browser automation tools from ThoughtWorks development it is a node of the library, Taiko use Chrome Devtools API, which is for testing modern web applications and build.."

So for Taiko is: 1, which is for testing Web applications was born 2, which is based on the Chrome browser

About Taiko mentioned in the introduction of ThoughtWorks , if students do not understand can jump so far to find out about ( the development team may also be a decision-making framework for your item selection assessment ).

Environment Installation

Before installing Taiko, make sure you have installed the NodeJs environment. If you have not installed nodejs, please jump to the Node official website for installation.

For development tools, it is strongly recommended that you use VS Code ( one superior development tools, no explanation ). If you have not installed VS Code, please jump to the VS Code official website to download and install.

Ensure the installation is complete after the first two basic support environment, we need to install the Taiko.

You can create a new folder on the desktop, such as "Taiko Demo". Open VS Code, click on the upper left corner of the "File" and select "Open Folder", and select the file you just created.

Open the "terminal" in the VS Code. Terminal command console is VS Code of integration, such as CMD, Powershell, etc., without leaving the IDE allows you to complete a series of operations. Select the top VS Code "terminal", select "New Terminal", of course, you can also use the keyboard shortcut (ctrl + shift + `).

x

After the completion of the new, you will see a window. (Subsequent operations will frequently use this operation, familiarization).

Next, the command is entered at the terminal:

npm install -g taiko

The content is installed to the global environment Taiko the Node package. Installation time can be a bit long, because taiko inside a built-in 100MB + of the Chromium browser.

尝试 Taiko

In the terminal input taiko, you can enter the command console taiko.

If you get an error message in VS Code Terminal:. "Because prohibit running scripts on this system For more information, see https:?. /Go.microsoft.com/fwlink/ LinkID = in 135170 about_Execution_Policies" Use this method processing: "Powershell script can not run approach" .

After entering the taiko you will get this display:

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

Next enter openBrowser(), you will see taiko will open a browser. Then execute goto("baidu.com")the browser will jump to the Baidu home page. Then execute again write("博客园 句幽"), the browser will fill in for the contents of the input box. Final performance click("百度一下"), analog operation click search.

接下来输入 .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对应关系的编写,功能测试人员负责用例的编写,就能很快的完成测试工作。

Now let's try to use it in the testfolder below the step_implementation.jsincrease statement file:

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

This part of the code familiar to you? This is the taiko we just started using code written. Now we'll wrap it up, corresponds to 跳转到句幽博客the directive. Then to specsa folder below example.specto add the corresponding actions:

## Jump test
* Jump to sentence secluded blog

Gauge using a text instruction MarkDown wording. We now do not need to understand the past markdown, just need to know the spec file: #test project representatives, for example you can name (# Attendance analysis and testing), and ##represents a test case, for example, you can name (Attendance added ## staff) . *Represents a step, the step name is derived from your keyword corresponding to the js file from the.

The last execution in the terminal:

gauge run [your spec file name]

You can test, final test report generation.

If you install a plug-Gauge VS Code, then after entering '.spec' file, you can see the button on each use case has a run. Click on use cases can be performed.

to sum up

In this paper, a small case to introduce what is Taiko and Gauge, and how to use it for everyone. So compared to the traditional automated testing, is there any advantage of it? And automated testing framework flourishing today, its framework and other advantages and disadvantages compared to what it? ( Such as Robot Framework and compared ). With BDD (Behavior Driven Development) as the core concept of Taiko, BDD is how to practice it? How to write a more complex use cases and how to build a good team member will partitioning maintenance and other issues will be introduced for everyone in the latter part of the article.

Guess you like

Origin www.cnblogs.com/uoyo/p/12401366.html