❤️ 🍰 🌹 🎬 🚴♀️ 🏋️♀️ 💻 🚀 💜
這裡記錄了我的學習和開發筆記，歡迎交流 (*´∀`)~♥
© 2024. All rights reserved.
本篇文章主要是將去年底今年初參加「2018 iT 邦幫忙鐵人賽」與後續在 VueJS 台灣 meetup 201803@五倍紅寶石所分享的文件做收納整理。
March 26, 2018 Nightwatch 自動化測試 End-to-End Testing 端對端測試 Selenium Selenium WebDriver 鐵人賽 2018鐵人賽 sharing Nightwatch101 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
這是我在 2017 年最值得聊聊的十件事 (*´∀`)~♥
February 15, 2018 年度回顧 鐵人賽 2018鐵人賽 北海道 日本 旅遊 職涯 Modern Web Nightwatch101 WorldGym End-to-End Testing Nightwatch Unit Test 單元測試 自動化測試 端對端測試 生活 · 留言
整理一下走到目前為止的想法。
January 9, 2018 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium Selenium WebDriver Selenium IDE 鐵人賽 2018鐵人賽 Unit Test Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Selenium IDE 可說是導入自動化測試的起手式。它很類似按鍵精靈，錄製好腳本後，執行腳本來自動完成文字輸入、點擊或跳頁等動作，確認執行動作皆如預期，若不符合預期狀況則停止並報錯，可協助確認 UI 功能是否正常執行，大大減低手動測試所花費的時間和精力。
January 8, 2018 Selenium IDE Selenium Nightwatch Nightwatch101 End-to-End Testing 端對端測試 鐵人賽 2018鐵人賽 自動化測試 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
這篇要說明一個更輕巧簡便的測試方法－不經 Selenium Server 而獨立使用 Webdriver 來啟動測試的方法，以 ChromeDriver 為例。
January 7, 2018 Selenium WebDriver ChromeDriver Nightwatch Nightwatch101 Selenium End-to-End Testing 端對端測試 鐵人賽 2018鐵人賽 自動化測試 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
綜合使用前面篇章所提到的內容－標籤、Page Objects 和客製化斷言，我們來做個範例...
January 6, 2018 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
由於在 nightwatch.conf.js 的 output_folder 設定了測試報告的路徑，因此在專案目錄底下可看到 reports 的資料夾，裡面的 JUnit XML 測試報告檔案即是按 group 所放置，像是這樣...
January 5, 2018 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 允許開發者定義自己的斷言指令，擴充 `.assert` 和 `.verify` 命名空間。
January 4, 2018 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 允許開發者定義自己的客製化指令（Custom Commands），這對將常用的功能抽出來成為模組，很有幫助。
January 3, 2018 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Page Objects 預先定義一個頁面裡面的元素（element）、區塊（section）和命令（command），意即將一個網頁切分成許多個片段，然後利用物件把這些片段包裝起來使用，例如：將一個頁面區分為 header、footer 等，然後在測試程式中就用這樣的 header 或 footer 為單位操作 DOM element。
January 2, 2018 Nightwatch Nightwatch101 Selenium End-to-End Testing 端對端測試 鐵人賽 2018鐵人賽 自動化測試 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Page Objects 預先定義一個頁面裡面的元素（Element）、區塊（Section）和命令（Command），意即將一個網頁切分成許多個片段，利用物件把這些片段包裝起來使用，例如：將一個頁面區分為 header、footer 等，然後在測試程式中就用這樣的 header 或 footer 為單位操作 DOM element。
January 1, 2018 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
本篇來看看 Nightwatch Test Runner 如何同時指定不同環境來跑測試、調整 Terminal Output 的顯示結果和經由 Test Workers 實現平行執行。
December 31, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
本篇要來聊聊禁跑特定 Test Suite 和 Test Case 的方法。
December 30, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 允許開發者使用標籤（tag）標記測試程式，在跑測試的時候可指定跑特定標籤的部份。使用標籤的好處是一個測試可有多個不同的標籤，不必受限於分類的唯一和垂直特性，相較有彈性。
December 29, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 允許開發者將測試程式分組（group）測試，分組的方式就是將測試程式碼放進同一個資料夾，群組名稱即資料夾名稱。
December 28, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 提供 Command Line Test Runner，便於設定、跑測試和產生測試報告。本篇先來探討安裝方式的差異和如何針對單檔、多檔、單檔+資料夾進行測試。
December 27, 2017 Nightwatch Nightwatch101 Selenium End-to-End Testing 端對端測試 鐵人賽 2018鐵人賽 自動化測試 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
來個簡單範例－拿我們家新上線的功能－購物車和新版結帳頁來玩玩！
December 26, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
隨著測試環境和加入功能愈來愈多元複雜，設定檔 `nightwatch.conf.js` 漸漸的就變成了一個龐然大物。大怪物來了 (☉д⊙) 來幫設定檔減肥 + 美化吧！ (ﾉ◕ヮ◕)ﾉ*:･ﾟ✧
December 25, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
所有的鉤子（Test Hooks）－before[Each] 與 after[Each] method 都可以執行非同步（asynchronous）的動作。如果要執行非同步的動作，就要傳入 callback 作為第二個參數，並在最後執行這個 callback。若不呼叫這個 callback 會導致逾時錯誤（timout error）。
December 24, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 單元測試 Unit Test Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 提供 before/after 與 beforeEach/afterEach 鉤子。
December 23, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Chai BDD Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
在上一篇 Assert 提到，.assert 和 .verify 的 library 基本上是做相同的事情，差別只在於斷言（assertion）失敗時的處理方式。
December 22, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Chai BDD Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 斷言庫（Assertion Library）除了提供上一篇提到的 Expect 外，還有 Assert 和 Verify。在 Nightwatch 中，.assert 和 .verify 的 library 基本上是做相同的事情，差別只在於斷言失敗時的處理方式。
December 21, 2017 Nightwatch Nightwatch101 Selenium End-to-End Testing 端對端測試 鐵人賽 2018鐵人賽 自動化測試 Chai BDD Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 的 BDD Expect 是源自於 Chai 的 Expect API，並且只能用於網頁元素的比對。expect 比 assert 更有彈性和口語化，缺點是不能串起來（chain）使用。
December 20, 2017 Nightwatch Chai BDD End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 TDD Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
指令分為兩種－Nightwatch 提供的指令與開發者撰寫的客製化指令，以下繼續 Part 3，來聊聊與執行流程相關的指令。
December 19, 2017 Nightwatch 自動化測試 End-to-End Testing 端對端測試 Nightwatch101 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
指令分為兩種－Nightwatch 提供的指令與開發者撰寫的客製化指令，以下繼續 Part 2，來聊聊 Cookie、Window 和 Log 相關的指令。
December 18, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
這篇 Part 1 先來看一些 UI 操作相關的指令，例如元素定位、設值、點擊和檢視是否存在或可見等。
December 17, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 鐵人賽 2018鐵人賽 UTF-8 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
做 End-to-End Testing 的第一步就是抓到網頁的元素，而定位網頁元素有兩種方法「CSS Selector」和「Xpath」，在本篇使用 Xpath。
December 16, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
做 End-to-End Testing 的第一步就是抓到網頁的元素，而定位網頁元素有兩種方法「CSS Selector」和「Xpath」，以下使用 CSS Selector。
December 15, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
Nightwatch 提供了 Command-line Test Runner，用來跑各種類型的測試，例如：指定測試環境、依群組或標籤或個別檔案、循序或平行執行等。其設定檔的預設名稱是 nightwatch.json 或 nightwatch.conf.js，如果兩者都出現，會優先選擇 nightwatch.conf.js，設定檔位置在這個專案的根目錄底下。
December 14, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium Selenium WebDriver 鐵人賽 2018鐵人賽 base-64 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
環境建置。
December 13, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
介紹 Nightwatch、Selenium Webdriver 與運作原理。
December 12, 2017 Selenium WebDriver Nightwatch End-to-End Testing 端對端測試 Nightwatch101 Selenium 鐵人賽 2018鐵人賽 自動化測試 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
這一系列 2018 鐵人賽「Nightwatch101：使用 Nightwatch 實現 End-to-End Testing」會有以下內容：Nightwatch 與 Selenium Webdriver、使用 CSS Selector和 Xpath 定位網頁元素、API（Commands、Expect、Assert、Verify）、Test Hooks、Nightwatch Test Runner、Page Objects、客製化指令與斷言、客製化測試報告、測試程式範例、Selenium IDE。希望大家不吝指教 :)
December 11, 2017 Nightwatch End-to-End Testing 端對端測試 自動化測試 Nightwatch101 Selenium Selenium WebDriver 鐵人賽 2018鐵人賽 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言