专栏首页用户6517667的专栏移动端 Web 测试调试工具详解

移动端 Web 测试调试工具详解

来源:http://www.51testing.com/

背景

  虽然移动端Web有着天生的HTML5特性,但是硬件显示环境的差异、各浏览器实现标准的方式的差异让开发人员不得不花很多时间在测试与调试上。

  从简单的JSConsole到跨平台的Weinre再到强大的Ghostlab,再加上各种官方的调试工具,开发测试人员通常需要根据不同的场景使用不同的策略。

  本文从实际需求出发,通过对测试调试工具的基本原理的解释,对最具代表性的工具进行了分类,为大家的开发测试策略提供帮助。

 移动端测试调试工具的三种需求

  代码同步:在编辑器中修改代码,在移动端自动更新并看到效果。

  动作同步:在PC上点击按钮或跳转页面,各个移动测试设备执行相同的动作,测试人员可以直接看到效果。

  调试功能:在移动端浏览器缺乏官方调试工具的情况下,通过JS模拟控制台、元素查看器、样式编辑器。

 实现原理

  对移动端代码的检测与控制,主要由以下三个部分构成:

  目标控制器 (Target):通常是嵌入到页面中的JavaScript代码,读取页面的状态,发送到调试服务器,接收并执行调试服务器的指令。

  调试服务器 (Server):负责接收目标控制器传来的页面信息,通过调试客户端去展现给开发者,并将调试客户端发出的指令传递给目标控制器去执行。

  调试客户端 (Client) : 负责提供UI去操作调试服务器,展示页面信息,驶入调试指令。

 目标控制器的几种实现方法:

  向目标页面中加入一个指向调试服务器的Script标签,通过引入外部JS代码实现控制。这样做最简单且支持最广泛,缺点是需要改动代码。

  使用iFrame包装目标页面

  使用混合应用包装目标页面

  通过调试服务器建立代理站点

  (图中显示weinre调试器使用JS修改了Firefox中的console.log方法,将输出结果发往调试服务器,并最终在Chrome中的调试客户端中显示出来)

  调试服务器可以分为两种:

  开发机本地。可以是NodeJs、PHP的Server,或者桌面端浏览器的内置服务。

  远程。使用工具厂商提供的调试服务器,无需在自己在本地开启。

 调试客户端分为以下几种:

  1.调试服务器提供的网页

  2.浏览器插件

  3.桌面端应用

  4.命令行

  5.典型工具集合

  6.下面是笔者经过考察实践后得到的常见测试调试工具的集合。

  7.主要从以下角度进行分析:

  8.调试服务器类型

  9.调试客户端类型

  10.目标页面控制方式

  11.目标范围

  12.功能特性

 推荐

  Weinre无疑是最强大的JS模拟调试器,由于使用了Inspector的UI代码,使用起来很顺手,而且支持各种Web场景。商用的Ghostlab和Adobe Edge Inspect也使用Weinre作为其调试功能,可见其地位。

  GhostLab现在推出了Windows版,调试与同步功能兼具,应用面广,是首推的综合解决方案。但是它的Server在桌面端,并且使用代理站点,在公司的网络环境下使用受限。

  官方调试器拥有最强大的功能,与桌面端基本相同,可以在开发初期使用,配合LiveStyle和Emmet实现同步快速开发。

 总结

  移动Web开发本身的复杂性决定了我们不能找到一种完美的测试调试解决方案,但我们可以根据基本原理对工具进行分类,记录整理之后,根据实际情况选取最优策略。

欢迎参加众测:

https://wap.ztestin.com/site/register?usercode=FAAAQwMQGAAXAwQBA3QhExcDHAQDPjVaABMIQg%3D%3D

本文分享自微信公众号 - 软件测试培训(iTestTrain)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2018-09-17

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 面试题十四期-selenium+python面试题目总结

    webDriver是按照client/server模式设计,client就是我们的测试代码,发送请求,server就是打开的浏览器来打开client发出的请求并...

    测试小兵
  • 如何做好项目总结?

    想做好一份项目总结,总结人员必须具备一定的结构化思维,对问题、数据进行结构分析,且能够通过结构化思维表达出来。结构化思维具备以下四个特点:

    互联网技术小站
  • 面试题十六期-基于Selenium的Web自动化测试实战&面试题以及答案整理

    可以结合图片进行解释。脚本启动driver,然后启动浏览器作为远程服务器,执行脚本发送请求,服务器解析请求作出相应的操作,反馈给客户端(脚本)。

    测试小兵
  • 5种促进业务增长的软件测试策略

    SaaS产品在市场上的巨大普及是促使初创公司深入软件行业的一个重要因素。但是,当涉及到将软件产品开发和投放市场时,仅凭一个简单的想法是不够的。与同类产品一样,市...

    八音弦
  • 过关斩将-软测常见面试题

    3.软件测试理论,这个大家都不陌生,也是必考的了,应该可以轻松应付。要注意准备下web测试和性能测试这块,现在做web的公司好多。

    测试小兵
  • 一篇文章理解AB测试和灰度发布

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明...

    用户1212940
  • 面试题五期-中高级测试工程师基础知识必备之selenium篇

    引言:自动化永远是避不开的,反正你入职的岗位要不要用自动化,你必须得会一点,加分项。这一块包括,自动化一些理念和自动化的工具使用。

    测试小兵
  • 面试题二十一期-中高级测试工程师68道面试题

    就算所有人都不支持你。这条路会很曲折,你也会一度认为是不是自己选错了,但只要坚持,就算最后没有成功,但努力了就不会有遗憾。

    测试小兵
  • C#笔记:反射的简单用法

    反射其实说白了就是,当你知道类的名字和位置。你可以在程序运行时直接创建实例调用它。没什么大不了的。

    超级大猪
  • 【ACL2019】最佳长论文阅读笔记,降低机器翻译中的exposure bias

    文章知乎链接 https://zhuanlan.zhihu.com/p/92654122

    zenRRan

扫码关注云+社区

领取腾讯云代金券