首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >接口测试平台代码实现103:GraphQL-3

接口测试平台代码实现103:GraphQL-3

作者头像
我去热饭
发布于 2022-05-19 01:33:59
发布于 2022-05-19 01:33:59
2260
举报
文章被收录于专栏:测试开发干货测试开发干货

上节我们搞定了首页的GraphQL请求功能,但是似乎漏掉了一个功能:显示。也就是当我点击左侧请求记录的时候,右侧需要显示对应的请求数据,但是很显然我们遗漏了GraphQL这个请求体类型。

打开Home.html:找到这段代码:

我们现在来添加上:

然后就可以成功显示了。

正文开始:

本节我们来快速搞定接口库调试层,相较于首页,这里涉及的不但要有显示,发送功能,还有保存功能。

首先我们打开接口库的html,在dom层(你可以理解为<标签>部分)进行创建表情,大部分原理和代码我们可以复制首页的对应部分。

打开P_apis.html:

首先增加这句:

有同学经常搞不懂这句插入的具体位置,其实这里可以通过上下文的关键字来ctrl+f来寻找。这是程序员基本功哦~

效果如下:

然后我们再去写他的子页面:

效果如下:

我们试着输入,结果发现输入的东西都看不见,那是因为颜色都是白色,我们这里要加个文字颜色属性:

现在能正常输入显示了。

然后我们找到 显示,保存和发送函数,分别添加 graphql的部分。

首先是显示:

显示写完了,现在我也不确定这段代码对不对。毕竟我们是直播开发,假如后面不小心发现写错了,我也不会来这改好,然后装作没出错的样子。因为教程中代码的截图比较连贯,来回跳跃改容易引起叉劈。大家也经历一下真实的流程,很接地气很安心。

然后是发送:

然后是保存:

经过测试:三个函数全部成功了~

然后我们去修改views.py中,加上相应的代码:

找到函数 Api_send()

如图,到这,就算搞定了接口库调试层的部分了。

大家可以自行简单测试,bug请迅速留言或反馈哦~

下节课我们要搞定用例库的步骤相关,那里要更复杂一些,需要增加请求体的替换部分设计。

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-12-24,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 测试开发干货 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
接口测试平台代码实现105:登录态接口
本节开始之前 要纠正一个bug,这个bug算是作者挖的一个小坑,在graphql的实际发送请求的代码中,作者对variables的求值代码不小心写成了int,其实应该用eval,因为这一个错误后其他代码全是复制粘贴,所以导致首页/接口调试/用例执行 三处均存在这个bug,好在榜一大哥使用中发现并给予纠正。
我去热饭
2022/05/19
8450
接口测试平台代码实现105:登录态接口
接口测试平台代码实现104:GraphQL-4
本节开始我要一步搞定用例库相关的设置,首先打开P_cases.html,找到步骤详情页的请求体类型部分,然后添加相关dom:
我去热饭
2022/05/19
2330
接口测试平台代码实现104:GraphQL-4
接口测试平台代码实现43:接口底层请求逻辑
终于结束了接口调试层的前端编写。来到了后台代码处理。其实就是点击Send按钮,我们调用requests来发送请求,并把返回值显示到调试层的返回体中即可,注意实际中这部分会越来越复杂,内容也会越来越多,本教程目前章节只会实现初始的各种请求难度,后续章节可能会不断完善这块。
我去热饭
2022/05/19
4810
接口测试平台代码实现43:接口底层请求逻辑
接口测试平台代码实现112:登录态接口-8
本节我们要搞定普通接口调试时自动加入登陆态接口返回参数到请求头/体中的后台实现。
我去热饭
2022/05/19
4290
接口测试平台代码实现112:登录态接口-8
接口测试平台代码实现101:图片优化和GraphQL-1
之前有小伙伴反馈一个问题。说每次刷新页面,个人头像的图片都会全屏显示,闪烁一下再回到正常位置和大小。用个可怕的头像的时候尤其吓人。
我去热饭
2022/05/19
2790
接口测试平台代码实现101:图片优化和GraphQL-1
接口测试平台代码实现49:自动异常测试-2
本节开始之前先感谢有同学反馈并主动过修复的一个bug:就是在某些接口的返回值中,中文会显示乱码的问题
我去热饭
2022/05/19
4860
接口测试平台代码实现49:自动异常测试-2
接口测试平台代码实现114:登录态接口-10
这位博主在上一节课,成功实现了登陆状态嵌入到接口库的功能,本节会继续嵌入到用例库中。
我去热饭
2022/05/19
3140
接口测试平台代码实现114:登录态接口-10
接口测试平台代码实现番外:主页改版-4
我们这里准备当用户进入这个首页的时候,就自动带进来4个字段。count_***** 所以我们现在去views.py中找到child_json,来添加这个4个字段。
我去热饭
2022/05/19
3490
接口测试平台代码实现番外:主页改版-4
接口测试平台代码实现番外:主页改版-6
本节我们来实现下那三个饼形图的后台逻辑,不过我这里只做其中一个的,其他俩个留着日后再用。
我去热饭
2022/05/19
2740
接口测试平台代码实现番外:主页改版-6
接口测试平台代码实现58-首页重构6
我们记得,我们都是用a标签超链接 来显示一个一个的请求记录。那么他们点击的href属性,我们指定的是触发一个叫home_log_show()的js函数,传入这个记录的id,当然这个函数还没有写。
我去热饭
2022/05/19
6100
接口测试平台代码实现58-首页重构6
接口测试平台代码实现111:登录态接口-7
我们先在打开项目的P_apis.html,找到调试弹层,先找个位置给它加上这个登陆态的开关:
我去热饭
2022/05/19
2510
接口测试平台代码实现111:登录态接口-7
接口测试平台代码实现106:登录态接口-2
大部分内容我们仍然可以借鉴普通接口调试层的内容,所以打开P_apis.html,找到那个登陆态的div,开始进行添加内部控件,但是也不能全都照搬过来,有一些就不需要,比如接口名字。而因为这个接口一个项目基本也就设置一次,所以优化便利性这种事的优先级不高,精力还是留给那些使用频率高的功能上吧
我去热饭
2022/05/19
1K0
接口测试平台代码实现106:登录态接口-2
接口测试平台代码实现102:GraphQL-2
我们上节搞定了首页的前端显示,不过有小伙子反馈说高度不够,那,其实我们可以通过修改raw属性来控制高度,其实就是行数。之前10行,我们改成14行:
我去热饭
2022/05/19
2300
接口测试平台代码实现102:GraphQL-2
接口测试平台代码实现番外:主页改版-2
打开Home.html,我们找到这个保存请求的按钮,给它写了一个onclick函数。注意,需要传入项目id
我去热饭
2022/05/19
2290
接口测试平台代码实现番外:主页改版-2
接口测试平台代码实现109:登录态接口-5
打开P_apis.html,给Send按钮加上onclick并且下面新建login_send函数:
我去热饭
2022/05/19
3450
接口测试平台代码实现109:登录态接口-5
接口测试平台代码实现107:登录态接口-3
首先先改正一下 榜一大哥提出的bug,就是当选择完公共请求头后取消选择,然后再请求就会报错的问题:
我去热饭
2022/05/19
5180
接口测试平台代码实现107:登录态接口-3
接口测试平台代码实现159:私有client证书设置四
本节课我们来搞定前端开关:是否加入证书。 主要技巧仍然是 仿造之前 加密开关的位置和写法来完成。 要搞定的页面有:P_apis.html,P_cases.html。 P_apis.html: 首先是调试层dom部分: 效果如下: 然后是调试层的bom部分: 清空旧数据函数: 展示函数: 保存函数: 请求函数: 最后是登录态部分: dom层: 效果如下: Bom层: 展示函数: 保存函数: 请求函数: 好,到这里我们就搞定了P_apis.html。
我去热饭
2022/05/19
2270
接口测试平台代码实现159:私有client证书设置四
接口测试平台代码实现19.首页优化
按照最近俩天 小伙伴的反馈激烈程度,本节课准备把首页添加一个非常有用户黏性的一个功能。公司内的各个超链接传送门!
我去热饭
2022/05/19
6510
接口测试平台代码实现19.首页优化
接口测试平台代码实现99:全局域名-6
我们已经成功的搞定了 全局域名的 增删改查 功能。接下来就嵌入到接口库调试层中吧。关于这里的设计呢?我们就不能按照之前全局请求头的设计了,因为全局请求头是可以多选的,但是全局域名只能单选。
我去热饭
2022/05/19
6090
接口测试平台代码实现99:全局域名-6
接口测试平台代码实现48: 自动异常测试-1
本功能属于番外,不是必须的。长度大概3章节。难度不高,也算给大家休息一下。
我去热饭
2022/05/19
5460
接口测试平台代码实现48: 自动异常测试-1
推荐阅读
相关推荐
接口测试平台代码实现105:登录态接口
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档