上一篇針對了計數器Component做了三個單元測試，Component、計數器按鈕、計數器的數字是否正常顯示， 還少了兩個單元測試 => 計數器數字的初...
基本上我們會用到 計數器這整個Component (div) 、顯示數字 (span)、按鈕(button)這三個DOM， 所以先在我們的Component上加...
上一篇我們把計數器Component完成了，這篇要來寫這個計數器的測試了! 首先我們要先建立一個屬於它的測試檔案 (還記得之前有提過說測試檔案的名稱要是那個Co...
我們先來畫我們的計數器吧! 為了讓我們的計數器精美一點點點， 我們先來安裝React的fontAwesome(一些icon)和React的bootstrap吧!...
上一篇有提到，我們可以在使用者模式(Production mode)將屬性隱藏起來不讓使用者看到。 首先~我們先來安裝一個babel套件 npm install...
其實在html裡，我們可以給予以data開頭的屬性， data-test這個屬性只是方便我們來辨別它是測試用的屬性 在html標籤上鑲入data-test屬...
首先!! 我們先來建立渲染Component的function (這邊用的會是es6的箭頭函式) const setup=()=>shallow(<...
為了讓我們的測試看起來乾淨，就跟寫Code一樣，淺顯易懂是原則，所以我們要把握以下兩點! DRY(Don't Repeat Yourself) =>...
寫測試時，我們基本需要三樣東西 Enzyme Enzyme跟React溝通的適配器(Adapter) 在Enzyme裡，我們要使用的渲染方式 (Shallow...
前面我們有大概提到Enzyme的優點及作用~ 這篇我們要直接來安裝Enzyme和導入Enzyme來供我們後續的測試作使用! 由於Enzyme 不會在建立專案的時...
首先!! 我們要先來建立一個React專案 執行以下指令來建立專案 npx create-react-app 專案名稱 如果不是用上述指令來建立專案的話...
要進入寫測試之前呀~我們必須要先了解為什麼要寫測試，及我們會說明一種測試的開發方法(TDD) 寫測試主要是用來保護我們的程式碼而且可以有效的降低BUG出現的機率...
嗨各位看官們,對~又是我! 這是第二次參加鐵人賽,除了要檢視自己是不是有進步以外,也想把這一年來有學到的東西分享給大家 ! 上一屆鐵人賽寫了PHP後端框架-sy...
前言 在我們撰寫jest的時候，常常會遇到source code的function有使用到setTimeout的情況，若是我們在jest中也使用setTimeo...
如果元件內有牽涉 HTTP requests ，我們通常需要在測試中 mock 它們。今天將學習如何測試元件的時候 mock 這些 HTTP requests。...
目前為止我們已經了解該如何使用 React Testing Library 的 render 跟 debug 來 測試元件的狀態了。 今天我們將繼續探索如何測試...
昨天我們學習了如何在測試裡 render 元件，並使用 testing library 家族的 jest-dom 及 dom-testing-library 來...
用 Storybook 搭配測試方法，從元件開發到完成整個專案，可以增加開發者的信心，不會擔心改A錯B的狀況發生，因為從邏輯面及UI面都能被完整的測試到。 單元...
使用 ReactDOM 來 Render 被測試元件 假設現在有一個 <FavoriteNumber /> 元件，我們要測試它是否有 render...
用 jest.mock 來 mock 整個 module 今天 「理解 Mock 基礎概念」 即將告一個段落，目前為止我們 mock function 大致上滿...
到目前為止，我們還是「手動」地記住及復原需要被 mock 的 function，例如： test('returns winner', () => {...
通常，在測試 JavaScript 跟 Ｍock 依賴的時候，我們需要確認 Functions 是不是有被正確地呼叫，例如：被呼叫了幾次？參數是否有正常傳遞進去...
Photo on jestjs.io 前言 上一篇已經簡單的介紹過 Jest 的初始作業，並執行簡單的測試如果正在看這篇的大...
Photo on jestjs.io 前言 在前幾篇的文章內容中，介紹過兩個自動化測試框架的主題分別是 Robot Fram...
嗨 大家好 我是一路爬坡的阿肥 阿肥竟然撐過第三個禮拜了！真的太感動了嗚嗚希望可以撐到最後！ 前言 今天阿肥又要講跟設計模式沒什麼直接相關的主題啦（被揍）。雖...
前言 今天要進入如何對 Component 做測試，這裡筆者之前是使用 Enzyme ，可能也是主流的 React 的測試框架，但是學測試的時候 React 剛...
前言 本篇會提及的 Mock 在 Unit Test 中扮演著很重要的角色，因為單元測試必須將關注點放在要被測試的 function 身上，不能讓不確定性在 f...
前言 單元測試是個很神奇的技能，筆者一開始是為了重構而學的，那時候單純的以為寫下測試只是方便讓邏輯不被改變，但是沒想到它帶來的好處比想像中的還多，因為在為程式寫...
先前我們寫的測試案例程式碼, 有很多test 裡面的程式碼都一樣 test('buy 1 book', () => { let bookstore...
設定好 test 測試環境, 以及 git 環境設定, 現在我們可以開始搗鼓我們的產品實驗室. 當我們編寫產品程式時, 我們就試著用下面流程來跑 紅燈 --...
Ivy
TWGD
lala_lee_jobs
Yuri Tsai
神Q超人
閃電妖精
iThome鐵人賽
看影片追技術