web自動化測試框架-01 搭建基礎架構並運行一個樣例

時間 2019-11-16

標籤 web 自動化測試框架搭建基礎架構運行一個樣例欄目 HTML 简体版

原文原文鏈接

系列內容

備註：配合免費視頻教程，獲取更佳的學習效果！課程連接： ke.qq.com/course/2815…node

主要內容

搭建web自動化測試框架
運行簡單的樣例

搭建Web自動化測試框架

如今經常使用的自動化測試框架有單元測試框架，關鍵字驅動框架，以及如今比較流行的行爲驅動測試框架。本次教程，咱們採用行爲驅動框架Cucumber.js + selenium-webdriver 來實現Web自動化測試。Cucumbergit

環境搭建

前提條件github
- 開發語言: node.js
- 開發工具: CukeTest（下載地址：http://cuketest.com/）CukeTest兼容Cucumber.js, 因此會大大提升咱們的生產效率。
安裝步驟web
- 安裝CukeTestnpm
  
  下載完成後，按照默認安裝方式安裝便可。瀏覽器
建立項目
安裝完成後，打開CukeTest,新建項目，項目名稱任意寫，項目模板選擇 Web ,項目路徑選擇本身本地一個目錄。點擊建立按鈕，完成建立。bash

運行簡單的樣例

編輯測試用例
項目建立完成後，工具默認會自動幫咱們生成Cucumber的代碼樣例。簡要介紹下默認項目目錄結構架構
```
└─features                Cucumber 運行默認從features目錄遍歷文件
    ├─step_definitions    定義自動化腳本
    └─support             定義環境支持目錄（好比定義運行超時、瀏覽器驅動）
複製代碼
```
.feature 文件是Cucumber中的劇本文件，定義了測試用例。 CukeTest默認會以可視化編輯模式打開feature文件，以下圖所示：框架

熟悉Cucumber的同窗會發現，使用CukeTest編輯feature文件很方便。在對應的文字輸入部分，直接雙擊就能夠進行編輯，不用擔憂文件格式不符合劇本的語法。例如，咱們要寫一個簡單的百度搜索自動化測試樣例。能夠編輯feature文件爲：async

對應的feature文本爲:
```
# language: zh-CN
功能: 百度搜索功能
測試功能

  場景: 百度搜索
    假如瀏覽到搜索網站 "http://www.baidu.com"
    當輸入關鍵字"CukeTest",並的點擊搜索按鈕的時候
    那麼搜索結果中應該能夠包含"CukeTest"
    

複製代碼
```
能夠在CukeTest中切換到文本視圖將上面文本複製進去。關於feature文件的編輯已經講解，會在後續教程中專門講解。

編輯自動化代碼
打開 step_definitions\definitions.js 文件，點擊feature文件中操做步驟上的灰色按鈕，會自動在definitions.js中生成自動化樣例代碼。

const { Given, When, Then } = require('cucumber');

const assert = require('assert');

const { driver } = require('../support/web_driver');

Given(/^瀏覽到搜索網站 "([^"]*)"$/, async function(url) { await driver.get(url); }); When(/^輸入關鍵字"([^"]*)",並的點擊搜索按鈕的時候$/, async function (arg1) {
    return 'pending';
});

Then(/^搜索結果中應該能夠包含"([^"]*)"$/, async function (arg1) { return 'pending'; }); 複製代碼

根據以前學習的selenium-webdriver 語法完善代碼，最終代碼：

const { Given, When, Then } = require('cucumber');

const assert = require('assert');
const { driver } = require('../support/web_driver');

Given(/^瀏覽到搜索網站 "([^"]*)"$/, async function(url) { await driver.get(url) ;}) ;When(/^輸入關鍵字"([^"]*)",並的點擊搜索按鈕的時候$/, async function (arg1) {
    await driver.findElement({id:'kw'}).sendKeys(arg1);
    await driver.findElement({id:'su'}).click();
});

Then(/^搜索結果中應該能夠包含"([^"]*)"$/, async function (arg1) { await driver.sleep(3000) let allresult = await driver.findElement({id:'content_left'}).getText() return assert.ok(allresult.includes(arg1)); }); 複製代碼

安裝項目依賴

有兩種方式安裝依賴包：能夠選擇本身熟悉的方式進行安裝：
1. 在項目的根目錄下運行命令 npm install npm install
2. 使用CukeTest工具進行安裝點擊工具欄上更新依賴包選項，在彈出的對話框中點擊保存自動下載
點擊保存按鈕使用工具進行下載。下載完成後的目錄結構: