前后端分离架构中接口测试最佳实践
作者: dkvirus 发表于: 2019-01-08 16:22:00 最近更新: 2019-01-31 21:01:48

背景

你是否遇到过这种情况:前后端分离体系中,后端开发人员通知你接口有改动,前端代码需要做相应调整。but,改了啥没有明确说明,这时候需要一个个页面去点击,一个个按钮去人肉测试,好不费事。

接口变动主要分两种:

  • 接口名称变化(导致接口请求失败);
  • 接口返回的数据结构变化(添字段或者删字段)。

通过编写测试代码,只要输入 npm run test 即可自动测试接口是否正常,这是本文要解决的问题。

tein

读音:[tai-ing](test-interface,取两个单词前两个字符组成),一个简短的接口测试脚本。本来想拿现成的测试框架 Jest 在上面修修改改,后来想了想要做的事非常简单,代码全部码好也不超过 400 行。

思路:

  • 提前写好接口返回数据的数据结构。tein 提供命令行工具 $ tein ui ,会创建一个网页自动转换数据结构;
  • 内部利用 axios 发请求判断接口名称是否变化,请求失败八成是接口名字又改了;
  • 接口请求成功后,将返回值再一次进行数据结构转换,与第一步写好的结构进行对比,判断是否变化。

transform.gif

运行效果如下,有字段修改的会以不同颜色标识出来,方便定位。

dein.gif

如果你的项目也需要对接口进行测试,不妨体验一波。=> tein quick-start

对于 outh2 请求,需要先拿到 token,之后每个请求都需要携带 token 进行请求,tein 也做了相应处理。具体 demo 参考 fixture-object-oauth2issue#1

有更好的处理方式,欢迎下方留言。

首页
友链
归档
dkvirus
动态
RSS