JavaScript組件之旅:測試組件

本期，我們要討論的議題是JavaScript 的測試，以檢查元件的狀態和運作方式是否符合預期，也會介紹一個可以方便編寫測試案例的測試方法。這裡說的測試當然是使用自動化的測試手段，也是軟體品質保證(QA)的重要環節。就本系列文章介紹的Smart Queue 來說，我們的測試目標包括：

• Task 物件的建立：第二期的程式碼提供了多種建立方式，需要測試物件建立後的狀態。
• Queue 內的任務運行順序：我們提供了兩種改變執行順序的方式：優先權和依賴配置，也要測試各種配置對次序的影響。

對於第一個目標，只需檢查物件建立後的屬性是否符合預期即可。我們已經多次提到“符合預期”，斷言(Assert)正是為此而設計的。簡單的說，斷言就是確保所測試的表達式結果為“真”，否則，以某種方式通知測試人員，並幫助其定位斷言失敗的測試案例。

第二個目標稍微有點複雜。由於我們在元件編碼實作的時候，將排序後的佇列(_sorted)隱藏在了閉包中，所以外部是無法存取的。有兩種方法可以考慮：(1)重構程式碼，增加程式碼的可測試性，又有兩種重構方法：(a)設定debug 開關，開啟時將_sorted 暴露給外部；(b)增加獨立文件，以建構的方式拼接程式碼最終會產生一個測試版本。 (2)測試行為的結果而不是過程，前一種方法實質上是深入到組件的運行時狀態，而這個方法只是檢查組件的運行結果。本期選用後者種測驗方式，第一種測驗方式留給有興趣的讀者練習:)

需要說明的是，我個人不贊成第一種的方法a. 為什麼呢？我先說一下這個任務隊列的設計理念：

• 它只是一個佇列，只負責「按需」調整任務的運行次序，不關注任務的個別細節。換句話說，它操作整體的任務，而不關心任務具體的行為和表現。
• 它是個安全的佇列，使用者（第一期提到的「客戶」）可以放心把任務加進去，不用擔心這個任務資訊會被其他客戶看到。需要說明的是，第二期實作程式碼中有SmartQueue.Queue = [[], [], []], 結果是外部可以存取到佇列項目。程式碼僅供介紹之用，你可以安全地刪除SmartQueue.Queue = 來達成安全控制。

出處： Alipay UED