1. 什么是TestCafe
TestCafe 是一個node.js端到端自動化工具，支持采納JavaScript或TypeScript來編寫測試，用于測試Web應(yīng)用程序貌矿。總結(jié)就是：它是 node.js 編寫的Web端UI自動化測試框架跃须。
1.1. 特點：
a. 它可以在所有流行的現(xiàn)代瀏覽器開箱即用站叼，不需要任何外部瀏覽器插件。
b. TestCafe使用異步執(zhí)行模型而無需指定等待時間菇民，有效提升了測試套件的穩(wěn)定性尽楔。它的選擇器API可更輕松實現(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)建項目
在GitHub創(chuàng)建 TestCafeDome 倉庫, Clone 到本地下梢，并在 VS Code 中打開項目。 在 VS Code 中打開終端(Terminal)使用 npm init 命令創(chuàng)建項目描述文件 package.json塞蹭。
2.3. 安裝TestCafe
使用命令 npm install testcafe安裝testcafe孽江。安裝完成后在 package.json 文件中可以看到 Testcafe依賴。
2.4. 安裝 TestCafe Test Runner
在VScode中安裝 TestCafe Test Runner 插件番电，如下圖所示岗屏。安裝完成可以直接右鍵運行 case辆琅，這個后邊會講到。
到此為止这刷，所有的安裝已經(jīng)完成婉烟，接下來是 Show Time.
3. Testcafe栗子 (POM)
大家都知道，構(gòu)建一個Web的自動化測試暇屋，最佳的解決方案就是使用POM Page Object Model似袁，那么POM是什么呢？
POM 模式的最大優(yōu)勢是當(dāng)UI或任何頁面的HTML對象變化了咐刨，無需更改測試本身叔营，只需更改其中的元素/方法的代碼即可。這將使得測試代碼比較簡潔所宰，而且易于理解绒尊，易于維護，重用性高仔粥。所以代碼就需要分為兩部分婴谱，一部分為測試代碼，一部分為封裝好的元素/方法代碼躯泰。
接下來以簡書的登錄做一個Demo：
-
先創(chuàng)建用例文件 TestCases 和頁面文件 PageObjects 谭羔，如下圖的結(jié)構(gòu)：
- 登錄簡書的case
第一步：在簡書的主頁面點擊登錄按鈕， 進入簡書登錄頁面
第二步：在登錄頁面麦向，輸入賬號信息瘟裸，點擊登錄，進入個人主頁
所有的代碼如下：
總結(jié):
a. 按照POM模式诵竭，測試用例看起來很清晰话告，易于理解
b. 當(dāng)其他的測試用例在使用登錄這個操作的時候直接可以調(diào)用對應(yīng)的 inputAccountInfo 方法，如果使用不同的賬戶可以傳不同的賬戶信息卵慰，可以重用
c. 當(dāng)頁面元素有修改的時候沙郭，不用修改測試用例，只需要修改對應(yīng)PageObjects文件的Selector即可裳朋，簡單病线，易維護
d. 在PageObjects 頁面可以把元素獲取(Selector)和方法(Action)部分分開，多個方法可以使用同一個Selector鲤嫡，易維護送挑，易理解
- 執(zhí)行測試用例
方法1：使用命令來運行npx testcafe chrome TestCases(執(zhí)行用例的參數(shù)還有很多，在后邊會有詳細的介紹)
方法2：在VSCode里暖眼，找到要執(zhí)行的測試用例的位置惕耕，右鍵，選擇 Testcafe: Run Test(s) in xxx 選項來執(zhí)行用例(如下圖所示)罢荡，這就是前面安裝的Testcafe Test Runner的功能赡突，方便執(zhí)行測試用例
4. Testcafe 測試用例的管理
當(dāng)項目的測試用例越來越多，很多測試用例就有很多共性区赵，比如惭缰，打開相同的頁面，登錄同樣的賬戶等等笼才，我們可以將這些相同的操作放在同一個文件中管理漱受，這里我們需要先了解TestCafe的其他功能。
4.1 測試用例的管理
對于Testcafe的測試用例骡送，一個js文件可以包含多個fixture昂羡，一個fixture可以包含多個testcase， 即test對應(yīng)的的每個函數(shù)模塊就是一個testcase摔踱。
用例執(zhí)行前的設(shè)置：
用例的執(zhí)行條件：
未完待續(xù)......
