背景
你是否遇到過這種情況：前后端分離體系中，后端開發(fā)人員通知你接口有改動(dòng)谐腰，前端代碼需要做相應(yīng)調(diào)整孕豹。but，改了啥沒有明確說明十气，這時(shí)候需要一個(gè)個(gè)頁面去點(diǎn)擊励背，一個(gè)個(gè)按鈕去人肉測(cè)試，好不費(fèi)事桦踊。
接口變動(dòng)主要分兩種：
- 接口名稱變化（導(dǎo)致接口請(qǐng)求失斠我啊）终畅；
- 接口返回的數(shù)據(jù)結(jié)構(gòu)變化（添字段或者刪字段）籍胯。
通過編寫測(cè)試代碼，只要輸入 npm run test 即可自動(dòng)測(cè)試接口是否正常离福，這是本文要解決的問題杖狼。
tein
讀音：[tai-ing]（test-interface，取兩個(gè)單詞前兩個(gè)字符組成）妖爷，一個(gè)簡(jiǎn)短的接口測(cè)試腳本蝶涩。本來想拿現(xiàn)成的測(cè)試框架 Jest 在上面修修改改理朋，后來想了想要做的事非常簡(jiǎn)單，代碼全部碼好也不超過 400 行绿聘。
思路：
- 提前寫好接口返回?cái)?shù)據(jù)的數(shù)據(jù)結(jié)構(gòu)嗽上。tein 提供命令行工具
$ tein ui，會(huì)創(chuàng)建一個(gè)網(wǎng)頁自動(dòng)轉(zhuǎn)換數(shù)據(jù)結(jié)構(gòu)熄攘； - 內(nèi)部利用 axios 發(fā)請(qǐng)求判斷接口名稱是否變化兽愤，請(qǐng)求失敗八成是接口名字又改了；
- 接口請(qǐng)求成功后挪圾，將返回值再一次進(jìn)行數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)換浅萧，與第一步寫好的結(jié)構(gòu)進(jìn)行對(duì)比，判斷是否變化哲思。
transform.gif
運(yùn)行效果如下洼畅，有字段修改的會(huì)以不同顏色標(biāo)識(shí)出來，方便定位棚赔。
dein.gif
如果你的項(xiàng)目也需要對(duì)接口進(jìn)行測(cè)試帝簇，不妨體驗(yàn)一波。=> tein quick-start靠益。
對(duì)于 outh2 請(qǐng)求己儒，需要先拿到 token，之后每個(gè)請(qǐng)求都需要攜帶 token 進(jìn)行請(qǐng)求捆毫，tein 也做了相應(yīng)處理闪湾。具體 demo 參考 fixture-object-oauth2 與 issue#1。
有更好的處理方式绩卤，歡迎下方留言途样。
