本文为霍格沃兹测试学院测试大咖公开课《微信小程序自动化测试》图文整理精华版,进阶学习文末加群!

随着微信小程序的功能和生态日益完善,很多公司的产品业务形态逐渐从 App 延升到微信小程序、微信公众号等。小程序项目页面越来越多,业务逻辑也越来越复杂,全手工测试已无法满足快速增长的业务需求。

然而,由于小程序本身的一些特性,导致业界目前缺乏成熟完善的解决方案,总会出现各种问题(包括腾讯微信官方提供的自动化工具)。如何做好小程序的自动化测试就成为测试同学当下普遍面临的一个痛点难题。

本节课就主要分享下微信小程序自动化测试的一些最佳实践心得,包括微信小程序的基本测试技术和操作方法,以及如何利用 Appium 的 WebView 测试技术 + adb proxy 完成微信小程序的自动化测试(可能是目前最实用的小程序自动化测试技术),并附上 Python 版源码。

小程序运行环境

平台差异:尽管各运行环境是十分相似的,但是还是有些许区别:

JavaScript 语法和 API 支持不一致:语法上开发者可以通过开启 ES6 转 ES5 的功能来规避(详情);此外,小程序基础库内置了必要的Polyfill,来弥补API的差异。

WXSS 渲染表现不一致:尽管可以通过开启样式补全来规避大部分的问题,还是建议开发者需要在 iOS 和 Android 上分别检查小程序的真实表现。

微信小程序技术架构

微信小程序技术架构如下图所示:

使用 Chrome 调试小程序

用 Chrome 浏览器提供的 inspect 分析工具,在浏览器中输入如下地址:

chrome://inspect/#devices

使用 Chrome 浏览器查看手机上打开的 WebView 进程与基本信息:

可以使用 chrome inspect 分析微信小程序的控件结构与布局:

使用 console 执行自己的 JavaScript 代码:

小程序的性能测试

这里附一张小程序性能测试图:

微信小程序的自动化测试

微信小程序自动化测试的关键步骤

Native 原生自动化方式。使用 Appium 即可完成,缺点就是控件定位不够准确,无法深入小程序内部;

Webview 自动化方式:可以获取更多小程序内部质量数据。

设置 chromedriver 正确版本

设置 chrome option 传递给 chromedriver

使用 adb proxy 解决 fix chromedriver 的 bug

为什么仍然有很多人搞不定?

低版本的 chromedriver 在高版本的手机上有 bug

chromedriver 与微信定制的 chrome 内核对接实现上有问题

解决方案:如何 fix it?

chromedriver 没有使用 adb 命令,而是使用了 adb 协议

参考课程中提到的 adb proxy 源代码

源码-微信小程序自动化测试 Python 版代码示例

class TestWXMicroWebView:

# 为了演示方便,未使用page object模式

def setup(self):

caps = {}

caps["platformName"] = "android"

caps["deviceName"] = "测试人社区 ceshiren.com"

caps["appPackage"] = "com.tencent.mm"

caps["appActivity"] = "com.tencent.mm.ui.LauncherUI"

caps["noReset"] = True

caps['unicodeKeyboard'] = True

caps['resetKeyboard'] = True

caps['chromedriverExecutable'] = \

'/Users/seveniruby/projects/chromedriver/chromedrivers/chromedriver_78.0.3904.11'

# options = ChromeOptions()

# options.add_experimental_option('androidProcess', 'com.tencent.mm:appbrand0')

caps['chromeOptions'] = {

'androidProcess': 'com.tencent.mm:appbrand0'

}

caps['adbPort'] = 5038

self.driver = webdriver.Remote("http://localhost:4723/wd/hub", caps)

self.driver.implicitly_wait(30)

self.driver.find_element(By.XPATH, "//*[@text='通讯录']")

self.driver.implicitly_wait(10)

self.enter_micro_program()

print(self.driver.contexts)

def enter_micro_program(self):

# 原生自动化测试

size = self.driver.get_window_size()

self.driver.swipe(size['width'] * 0.5, size['height'] * 0.4, size['width'] * 0.5, size['height'] * 0.9)

self.driver.find_element(By.CLASS_NAME, 'android.widget.EditText').click()

self.driver.find_element(By.XPATH, "//*[@text='取消']")

self.driver.find_element(By.CLASS_NAME, "android.widget.EditText").send_keys("雪球")

self.driver.find_element(By.CLASS_NAME, 'android.widget.Button')

self.driver.find_element(By.CLASS_NAME, 'android.widget.Button').click()

self.driver.find_element(By.XPATH, "//*[@text='自选']")

def find_top_window(self):

for window in self.driver.window_handles:

print(window)

if ":VISIBLE" in self.driver.title:

print(self.driver.title)

else:

self.driver.switch_to.window(window)

def test_search_webview(self):

# 进入webview

self.driver.switch_to.context('WEBVIEW_xweb')

self.driver.implicitly_wait(10)

self.find_top_window()

# css定位

self.driver.find_element(By.CSS_SELECTOR, "[src*=stock_add]").click()

# 等待新窗口

WebDriverWait(self.driver, 30).until(lambda x: len(self.driver.window_handles) > 2)

self.find_top_window()

self.driver.find_element(By.CSS_SELECTOR, "._input").click()

# 输入

self.driver.switch_to.context("NATIVE_APP")

ActionChains(self.driver).send_keys("alibaba").perform()

# 点击

self.driver.switch_to.context('WEBVIEW_xweb')

self.driver.find_element(By.CSS_SELECTOR, ".stock__item")

self.driver.find_element(By.CSS_SELECTOR, ".stock__item").click()

小程序自动化测试需要跨过的几个坎

WebView 开关/x5内核调试开关

ChromeOption 选项需要填写

WebView 版本和 ChromeDriver 版本对应问题

低版本 ChromeDriver 需要修复 ps 命令的 bug

Context API 有一定的延迟需要等待

以上,更多内容(ChromeDriver 的资料与 WebView 自动化关键代码,Appium 配置,mapping.json,常见错误等),请点击下方链接入群获取。

微信 小程序 python 渲染_干货 | 微信小程序自动化测试最佳实践(附 Python 源码)...相关推荐

  1. eureka 之前的服务如何关闭_干货分享 | 服务注册中心Spring Cloud Eureka部分源码分析...

    友情提示:全文13000多文字,预计阅读时间10-15分钟 Spring Cloud Eureka作为常用的服务注册中心,我们有必要去了解其内在实现机制,这样出现问题的时候我们可以快速去定位问题.当我 ...

  2. 基于Selenium+Python的web自动化测试框架(附框架源码+项目实战)

    目录 一.什么是Selenium? 二.自动化测试框架 三.自动化框架的设计和实现 四.需要改进的模块 五.总结 总结感谢每一个认真阅读我文章的人!!! 重点:配套学习资料和视频教学 一.什么是Sel ...

  3. 微信小程序view动态长度_微信小程序实现动态改变view标签宽度和高度的方法【附demo源码下载】...

    本文实例讲述了微信小程序实现动态改变view标签宽度和高度的方法.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml文件 >我是view标签,我现在的宽度是{{v ...

  4. 微信小程序多图上传/朋友圈传图效果【附完整源码】

    效果图 部分源代码 js文件: var uploadPicture = require('../Frameworks/common.js') //获取应用实例 const app = getApp() ...

  5. python django博客源码_利用Django实现一个博客(附全部源码)

    不论什么语言,学Web开发必做的项目--个人博客. 本次项目基于Python的知名Web框架Django,从数据库到视图逻辑.再到模板语法,完整的走了一遍MTV开发流程. markdown非常适合写博 ...

  6. python:实现Triplets with zero sum零和三元组(附完整源码)

    python:实现Triplets with zero sum零和三元组 def find_Triplets_with_zero_sum(arr, num):found = False# sort a ...

  7. python以递归的方式实现十进制转二进制算法(附完整源码)

    python以递归的方式实现十进制转二进制算法 def binary_recursive(decimal: int) -> str:decimal = int(decimal)if decima ...

  8. python:实现带GUI界面的Youtube下载器(附完整源码)

    python:实现带GUI界面的Youtube下载器 from pytube import * import os from tkinter import * from tkinter.filedia ...

  9. Python:实现获取daily horoscope每日星座运势算法(附完整源码)

    Python:实现获取daily horoscope每日星座运势算法 import requests from bs4 import BeautifulSoupdef horoscope(zodiac ...

最新文章

  1. 实战项目 10: 货物清单应用
  2. 如何利用CSS给同一个网页中的超链接设置设置不同的样式?
  3. 说一说限制字数的输入框踩的坑
  4. 表单字段三维数组名_【技术汇】回转式空气预热器温度场三维数值模拟
  5. 【转】PHP面试题总结
  6. Detectron2和MMDetection的学习笔记
  7. Office版本差别引发的语法问题
  8. 计算机信息管理自荐信个人简历,计算机信息专业英文自荐信
  9. Python黑帽子_hack与渗透测试编程之道 第三章代码
  10. 一键刷入twrp_小米红米如何正确TWRP卡刷MIUI12波兰版或者欧版等系统详细教程
  11. php中间件获取分表数据,分库分表中间件CDS
  12. 【每日一题】 480. 滑动窗口中位数
  13. python事件是什么意思_python 回调函数是什么意思
  14. vue源码学习(第一张) this访问data数据 拆散之后并不难
  15. [C#学习教程-委托]001.大道至简之委托(代理),匿名函数,Lambda表达式
  16. 分享一个特别好用的站长在线工具箱
  17. kodi 默认桌面_如何自定义Kodi新的默认外观河口
  18. 德州学院大学计算机,德州学院 计算机系 李天志老师简介 联系方式 手机电话 邮箱...
  19. 山东理工大学ACM平台题答案 2561 九九乘法表
  20. SMO组织的现状与发展

热门文章

  1. vue-cli2.9.6更新不了问题
  2. PCL之估计整个点云表面法向量
  3. php jwt payload,php实现jwt
  4. linux桌面版如何添加新网络,ubuntu网络配置(桌面版和服务器版)
  5. Proxy实现MySQL读写分离
  6. 图像滤镜艺术---(Instagram)1977滤镜
  7. 微信小程序 自定义组件(stepper)
  8. HP-lefthand底层结构具体解释及存储灾难数据恢复
  9. python 线程池的研究及实现
  10. 【Computer Organization笔记11】多周期CPU