1. 什么是TestCafe
TestCafe 是一個(gè)node.js端到端自動(dòng)化工具，支持采納JavaScript或TypeScript來編寫測試，用于測試Web應(yīng)用程序?？偨Y(jié)就是：它是 node.js 編寫的Web端UI自動(dòng)化測試框架。
1.1. 特點(diǎn)：
a. 它可以在所有流行的現(xiàn)代瀏覽器開箱即用，不需要任何外部瀏覽器插件。
b. TestCafe使用異步執(zhí)行模型而無需指定等待時(shí)間，有效提升了測試套件的穩(wěn)定性。它的選擇器API可更輕松實(shí)現(xiàn)PageObject模式。
1.2. 官網(wǎng)：
http://devexpress.github.io/testcafe/
2. TestCafe 環(huán)境準(zhǔn)備
2. 1. 前提條件
1.1 必須有node環(huán)境
node官網(wǎng) https://nodejs.org/en/ 下載 node 安裝包并安裝。node.js安裝完成后，包管理工具npm也已經(jīng)安裝成功。使用node -v 和 npm -v 命令查看，如果安裝成功，就能得到安裝的版本號。
1.2 安裝 Visual Studio Code
Visual Studio Code 官網(wǎng) https://code.visualstudio.com/ 下載并打開。
2.2. 創(chuàng)建項(xiàng)目
在GitHub創(chuàng)建 TestCafeDome 倉庫, Clone 到本地，并在 VS Code 中打開項(xiàng)目。 在 VS Code 中打開終端(Terminal)使用 npm init 命令創(chuàng)建項(xiàng)目描述文件 package.json。
2.3. 安裝TestCafe
使用命令 npm install testcafe安裝testcafe。安裝完成后在 package.json 文件中可以看到 Testcafe依賴。
2.4. 安裝 TestCafe Test Runner
在VScode中安裝 TestCafe Test Runner 插件，如下圖所示。安裝完成可以直接右鍵運(yùn)行 case，這個(gè)后邊會(huì)講到。
到此為止，所有的安裝已經(jīng)完成，接下來是 Show Time.
3. Testcafe栗子 (POM)
大家都知道，構(gòu)建一個(gè)Web的自動(dòng)化測試，最佳的解決方案就是使用POM Page Object Model，那么POM是什么呢？
POM 模式的最大優(yōu)勢是當(dāng)UI或任何頁面的HTML對象變化了，無需更改測試本身，只需更改其中的元素/方法的代碼即可。這將使得測試代碼比較簡潔，而且易于理解，易于維護(hù)，重用性高。所以代碼就需要分為兩部分，一部分為測試代碼，一部分為封裝好的元素/方法代碼。
接下來以簡書的登錄做一個(gè)Demo：
-
先創(chuàng)建用例文件 TestCases 和頁面文件 PageObjects ，如下圖的結(jié)構(gòu)：
- 登錄簡書的case
第一步：在簡書的主頁面點(diǎn)擊登錄按鈕， 進(jìn)入簡書登錄頁面
第二步：在登錄頁面，輸入賬號信息，點(diǎn)擊登錄，進(jìn)入個(gè)人主頁
所有的代碼如下：
總結(jié):
a. 按照POM模式，測試用例看起來很清晰，易于理解
b. 當(dāng)其他的測試用例在使用登錄這個(gè)操作的時(shí)候直接可以調(diào)用對應(yīng)的 inputAccountInfo 方法，如果使用不同的賬戶可以傳不同的賬戶信息，可以重用
c. 當(dāng)頁面元素有修改的時(shí)候，不用修改測試用例，只需要修改對應(yīng)PageObjects文件的Selector即可，簡單，易維護(hù)
d. 在PageObjects 頁面可以把元素獲取(Selector)和方法(Action)部分分開，多個(gè)方法可以使用同一個(gè)Selector，易維護(hù)，易理解
- 執(zhí)行測試用例
方法1：使用命令來運(yùn)行npx testcafe chrome TestCases(執(zhí)行用例的參數(shù)還有很多，在后邊會(huì)有詳細(xì)的介紹)
方法2：在VSCode里，找到要執(zhí)行的測試用例的位置，右鍵，選擇 Testcafe: Run Test(s) in xxx 選項(xiàng)來執(zhí)行用例(如下圖所示)，這就是前面安裝的Testcafe Test Runner的功能，方便執(zhí)行測試用例
4. Testcafe 測試用例的管理
當(dāng)項(xiàng)目的測試用例越來越多，很多測試用例就有很多共性，比如，打開相同的頁面，登錄同樣的賬戶等等，我們可以將這些相同的操作放在同一個(gè)文件中管理，這里我們需要先了解TestCafe的其他功能。
4.1 測試用例的管理
對于Testcafe的測試用例，一個(gè)js文件可以包含多個(gè)fixture，一個(gè)fixture可以包含多個(gè)testcase， 即test對應(yīng)的的每個(gè)函數(shù)模塊就是一個(gè)testcase。
用例執(zhí)行前的設(shè)置：
用例的執(zhí)行條件：
未完待續(xù)......
