為了讓我們的測試看起來乾淨，就跟寫Code一樣，
淺顯易懂是原則，所以我們要把握以下兩點!

• DRY(Don't Repeat Yourself) => 將重複的code寫成共用function,靠傳入的參數並將結果進行return
• 寫上Test和Test Function的註解 => 單元測試的名稱最好就可以描述該測試所執行的內容

先來介紹Enzyme 的Shallow 和 Mount 兩個渲染的API吧~

• Shallow: 適用於單元測試，而且可以確保我們的測試不會影響任何子類別Component的行為

  • 傳入的是整個要測試的Component

  • 比較常用的function

    • find() : 在渲染出來的Component上面找尋某個節點
    • filter() : 在渲染出來的Component上過濾掉某的節點
    • contains() : 看看某個節點是否有出現在渲染出來的Component上
    • hasClass() : 判斷某個節點上是否含有某個Class ( 跟jquery的hasClass一樣 )

• Mount: 適用於有多個Component會互相影響的時候，
  使用這種渲染方式在測試裡，被用到的DOM都會互相影響

  • 傳入的參數和常用的function其實和shallow一樣，差別只是在於不同的用途

再來介紹幾個 JEST的function吧~

• expect() : 用來測試某個值，通常會搭配其他function，很少會單單只呼叫這個function
• toBe() : 測試某個值是不是符合自己期望的值，傳入的是自己期望的值 (可以搭配expect作使用)
• toEqual() : 測試 expect的值是不是跟傳入的值相等
• toHaveLength() : 測試某個值是不是符合所要的長度，傳入的是數字

上面是Enzyme 兩個渲染API的比較和 JEST的一些function的簡單介紹，
後續在寫測試的時候都會用到~

下一篇! 要來說明怎麼樣讓同樣的Code寫成共用function，
讓我們的測試Code看起來簡潔有力，

用的會是我們最最最基本的兩個function

• 渲染Component的function
• 尋找節點的function