test API with mock function
此篇有使用 isomorphic-fetch Library
此篇要call的API為 https://facebook.github.io/react-native/movies.json
1.fetch api
新建 root/app/api/users.js 使用此class 將call我們要的API寫成一個function
2.call fetch
在 root/app/Home.js 內 call 步驟1所寫的function
執行App後,可看見call API要到的內容
3.撰寫測試的 test case
在此步驟先撰寫測試的 test case,確認是否OK 新建 root/__tests__/HomeMockApi-test.js
下圖說明Code
執行此test case ,成功
此時的 Users.all() 並非真的跑去call fb那串API,因為 global.fetch... 所以被判定使用模擬函數(mock function )
4.撰寫實際例子的 test case
步驟三成功後,就開始實際的例子吧!
1) 將測試的mock function註解掉後執行test,會得到 fetch is not defined 的錯誤,如下圖。
fetch is not defined的原因: 在測試區域(test area)內,我們無法通過 test 偵測它到底是什麼東西,所以我們使用 isomorphic-fetch
2) 安裝 isomorphic-fetch
3) 在 HomeMockApi-test.js內import isomorphic-fetch 執行test case,結果是失敗,但可以看到成功印出從API內獲取的內容,如下圖
5) 修改expect 直接拿此 fb API 內的 movies 中隨便一比的 title 來測試,code 如下
執行後成功,如下圖 (API內容可透過網頁開啟URL查看)
isomorphic-fetch Library
參考
Last updated