二哲 web前端開發 前端
你bf有時候咱們須要不發送請求就能完成前端的業務邏輯測試,而許多的業務邏輯都會須要調用到後端的API接口。那如何能mock咱們所須要的data就是一個問題。當咱們能有一個良好的測試環境以後,只要保證後端的接口沒有問題,那咱們就能夠保證業務邏輯也沒有問題。web
因此咱們對API的集成測試有如下幾個要求
1.不發送請求,返回本地假數據
2.發佈前經過CI跑unit test,經過則發佈上線後端
首先通常咱們在network部分都會進行封裝,假設在project中封裝了以下的請求工具
既然咱們不能發送真實請求,那咱們就須要相似能攔截的東西,攔截也能夠經過mock代替。因而咱們能夠經過jest.mock方法來作。安全
這個就是jest.mock的做用。數據結構
明白了這個後就好辦了。項目目錄以下:
而咱們的fake文件其實主要作的事情就是根據請求url,method,status等,去讀取對應的本地假數據。大體以下。
mockData文件夾則就是放咱們的假數據,在這咱們能夠假設定義以下數據結構,來模擬咱們的response。
最後看下咱們的 unit test 如何寫ide
假設/user接口返回得數據多是這樣
而咱們前端service層爲UI層提供了一個initUserData的方法,initUserData方法裏的操做是當age爲18,那就要返回19。
因此咱們在Jest則能夠直接這樣測試。
這樣咱們使用Jest就能夠完成對業務邏輯的測試,Unit test在大型項目中很是須要,每當提交一個feature時,能夠跑完全部測試,會讓你很是有安全感,極大提高了項目的穩定性。工具
真正的方法(http),與mock的方法http,文件必須同名,而後放在mocks文件夾下便可。若是不一樣名使用jest.mock()則會失敗。學習
以上例子源碼請自行下載學習:
連接: https://pan.baidu.com/s/1QyI8ayo3EHD3xfwTUkRDlg 密碼: 1jq4測試