Photo by Nightwatch.js on Twitter

前言

在前兩篇的文章都在介紹 Robot Framework 的自動化測試框架。
有興趣的可以點下方連結參考參考～

鼠年全馬鐵人挑戰 WEEK 13：Robot Framework (上)
鼠年全馬鐵人挑戰 WEEK 14：Robot Framework (下)

而在這個禮拜換換口味改一個測試框架來介紹。
前兩篇所介紹的 Robot Framework 是以 Python 為底層所設計的框架。
而這週所要分享的是以 Node.js 撰寫測試的自動化測試框架 “Nightwatch”。

介紹 Nightwatch

Nightwatch.js 是針對 Web 的自動化測試框架
使用 Node.js 進行測試腳本的撰寫
並使用之前提到過的 Selenium WebDriver 與各種瀏覽器進行溝通
有興趣的可以點下方連結參考

鼠年全馬鐵人挑戰 WEEK 08：Selenium WebDriver (上)
鼠年全馬鐵人挑戰 WEEK 09：Selenium WebDriver (下)

安裝 Nightwatch

安裝 Node 與 npm

如果不確定是否已經安裝可以透過查詢版本來確認
$ node -v 和 $ npm -v
如果尚未安裝 Node.js 和 npm 可點選下面連結安裝
官方載點 >>> nodejs.org

安裝 Nightwatch

接著直接進入重頭戲
為了方便使用小弟就先建立一個 nightwatch_demo 的專案資料夾
$ mkdir nightwatch_demo && cd nightwatch_demo

接著透過 npm 來新增一個 package.json 的初始文件
$ npm init -y

確認 package.json 建立成功後
就可以下指令來安裝 nightwatch 了
$ npm install nightwatch --save-dev

此時在專案底下會增加 node_modules 和 package-lock.json 的資料夾與檔案

安裝 WebDriver

使用 npm 指令來進行安裝所需要的 WebDriver

Chrom：$ npm install chromedriver --save-dev
FireFox: $ npm install geckodriver --save-dev

安裝 Selenim Server

使用 npm 指令來進行安裝 Selenium Server
$ npm install selenium-server --save-dev

如果想要參考更多資訊的話可以點擊下方連結

鼠年全馬鐵人挑戰 WEEK 10：Selenium Grid

執行測試

Nightwatch 帶有一個 examples 包含一些樣本測試的文件夾。
下面有附上一個指令，指令的測試內容為

1. 打開搜索引擎 Ecosia.org
2. 搜索 “nightwatch”
3. 驗證第一個結果是否是 Nightwatch.js 網站

$ ./node_modules/.bin/nightwatch node_modules/nightwatch/examples/tests/ecosia.js

此時專案中會再多出兩個東西
一個是放置測試輸出結果的資料夾 test_output
一個是 nightwatch 的組態文件 nightwatch.conf.js

如果以上的操作過程都沒有遇到問題的話
恭喜你，已經成功的完成所需的前置作業

結尾

這篇稍微簡單的介紹了一下 nightwatch 並完成使用前的前置作業
下一篇，小弟將會進行設定組態(Configuration) 並且執行測試

如果有疑問或是有錯誤，還請各位大哥大姐提點。
小弟將繼續往下週邁進。 ─=≡Σ((( つ•̀ω•́)つ

參考文件:

Nightwatch.js | Node.js powered End-to-End testing framework
nightwatch - npm