我們將使用?Selenium?與?Nightwatch?搭建我們的測試腳手架载萌。
? ? ?Selenium?是一款 Web 的自動化測試環(huán)境搏予,它將幫我們搭建好測試環(huán)境慎玖,調(diào)取系統(tǒng)安裝的瀏覽器句旱,在瀏覽器里執(zhí)行一切自動化行為;
? ? Nightwatch?是一款 Test Runner砰盐,可以簡單理解為前者的控制軟件,它將提供一系列接口供我們編寫測試案例坑律,同時也是與現(xiàn)有前端項目結(jié)合的橋梁岩梳。只需使用 Javascript 和 CSS 選擇器,不需要初始化其他對象和類脾歇,您只需要編寫測試規(guī)范蒋腮。內(nèi)置命令行測試運行器,使您能夠運行整體測試藕各,分組測試或者單個測試池摧。
環(huán)境準備
首先要安裝?Java 7 或更高?,并且?java?命令可正常執(zhí)行才能測試噢~~ 最簡單的判斷方法就是打開自己的終端激况,輸入?java?并回車作彤,看看是不是有 Java 運行。如果有命令不存在之類的提示乌逐,請重新安裝 Java 運行環(huán)境 (???)
Selenium 是一個直接運行在瀏覽器中的非常流行的綜合測試工具集竭讳, 最初為Java?語言編寫, 現(xiàn)在已經(jīng)支持許多語言浙踢。
概述
總的來說绢慢,核心是使用selenium和driver操作瀏覽器,通過 nightwatch做斷言洛波。
安裝工具
然后我們將安裝 Selenium 與 Nightwatch胰舆。
安裝 selenium-standalone:
? ? ? npm install selenium-standalone --save-dev
安裝 Nightwatch:
? ? ? ? ? ? ? npm install nightwatch --save-dev
項目配置
一. 配置 Nightwatch
首先骚露,在項目根目錄建立文件 "nightwatch.json",這個文件用來存放 Nightwatch 的配置信息
nightwatch.json 的文件名是?不可以?修改的缚窿,因為 Nightwatch 每次啟動的時候都是從它讀取配置喔棘幸!這里的配置項很多,不過先不管它倦零,我們接著創(chuàng)建文件误续。
2. 接著在項目根目錄下創(chuàng)建文件?"nightwatch.conf.js"?,同樣此文件名也是不可以修改的扫茅,因為 Nightwatch 每次啟動也會從它這里讀取配置喔~ (′?_?`)
3. 再次在項目根目錄建立文件?"startup.js"蹋嵌,然后在文件內(nèi)部寫入:
require('nightwatch/bin/runner.js')
這個文件就是我們測試的入口文件,以后我們要執(zhí)行測試就要運行這個文件诞帐,命令為?node ./startup欣尼。入口文件的名字是可以按照喜好更改的,只要運行它就好啦停蕉。不過每次輸入?node ./startup?太麻煩了愕鼓,所以我們將這條命令寫入 npm scripts 中 ~~~ 打開?"package.json",在 JSON 對象中建立?"script"?屬性慧起,并寫入內(nèi)容:
{
? ? ...
? ? "scripts": {
? ? ? ? "start": "node ./startup.js"
? ? },
? ? ...
}
二. 配置 Selenium
Selenium?是自動化測試環(huán)境菇晃,它提供了測試服務器、啟動瀏覽器蚓挤、網(wǎng)頁自動操作等功能磺送,同時暴露 API 給 Nightwatch 供我們使用。
1. 建立 Selenium 的配置信息灿意。
在項目根目錄下建立文件夾?"build"估灿,并在其中創(chuàng)建文件 "selenium-conf.js"
2. 告訴 Nightwatch,我的 Selenium 與 Driver 在哪里缤剧。
再次打開項目根目錄下的?"nightwatch.conf.js"?文件
創(chuàng)建目錄存放測試用例
在項目根目錄新建一個名為 "tests" 的目錄馅袁,然后這里就用來存放我們即將編寫的測試用例文件。
那么這個文件夾能不能指向到其他地方去呢荒辕?當然可以汗销,不過要修改一個小地方。
您可以在目錄中存放多個測試用例文件抵窒,且命名隨意弛针,Nightwatch 將讀取目錄中所有的 JS 文件,如果符合測試用例格式李皇,將會自動執(zhí)行削茁。
>
| -- build|? ? ? | -- selenium-conf.js? ? ? ? # Selenium 版本信息配置。|? ? ? | -- selenium-setup.js? ? ? # Selenium 安裝命令腳本。|? ? ? | -- selenium-start.js? ? ? # Selenium 啟動命令腳本付材。| -- reports? ? ? ? #輸出測試報告
| -- tests? ? ? ? #測試用例| -- nightwatch.conf.js? ? ? ? ? ? # Nightwatch 動態(tài)配置文件朦拖。| -- nightwatch.json? ? ? ? ? ? ? ? # Nightwatch 配置文件。| -- package.json? ? ? ? ? ? ? ? ? # 項目信息配置文件厌衔。| -- startup.js? ? ? ? ? ? ? ? ? ? # 測試啟動入口文件。
基本api
client 是代碼運行時 Nightwatch 提供的對象捍岳,所有對瀏覽器進行的操作都將使用此對象調(diào)取富寿,比如 client.click("CSS Selector")、client.getCookie(function () {...})锣夹,我們第一章說過的 "可以簡單理解為 Selenium 的控制軟件" 就是通過它體現(xiàn)的喔页徐!
Expect是0.7版本的時候引入的一種BDD(行為驅(qū)動測試)風格的接口,也是為了執(zhí)行斷言银萍,使用鏈式的語法变勇,和直接的斷言相比,expect讀起來更加語義化贴唇,就像寫句子(但是單詞之間用的.連接的)
Assert這部分包含兩套有同樣方法的方法庫:assert和verify,其中搀绣,若是當前執(zhí)行的斷言沒有成功,assert會停止執(zhí)行剩余的斷言并立即結(jié)束戳气,verify會打印錯誤日志然后繼續(xù)淡定的執(zhí)行接下來的斷言链患。
Commands用來在頁面上執(zhí)行一些命令比如點擊、關(guān)掉當前窗口瓶您、清除cookie麻捻、獲取到某元素的值等。
禁用測試
要阻止某個模塊執(zhí)行測試呀袱, 只需要設置 disable 屬性為true :
module.exports = {
? '@disabled': true, // This will prevent the test module from running.
? 'sample test': function (client) {
? ? // test code
? }
};
禁用單獨測試用例?
禁用模塊中單獨的測試用例贸毕,目前還不支持。 但是有一個變通方法夜赵, 將測試方法轉(zhuǎn)化為字符串明棍,Nightwatch 就會忽略它。
module.exports = {
'sample test': ''+function (client) {
? ? // test code
? }
};
當你想要停止測試時注意總是要調(diào)用 end() 方法油吭,如此 selenium 會話才會正確的停止击蹲。
Nightwatch 為測試提供了 before/after, beforeEach/afterEach 鉤子。?
before 和 after 鉤子會在每個測試套件運行前后執(zhí)行婉宰。beforeEach 和 afterEach 則會在每個測試用例(測試步驟)執(zhí)行前后執(zhí)行歌豺。?
所有鉤子函數(shù)都接收一個 NightWatch 實例做為參數(shù)。?
Example:
before(), beforeEach(), “step one”, afterEach(), beforeEach(), “step two”, afterEach(), after()