✨ 实战系列 ✨ 1️⃣ 微信小程序自动化测试实践（附 Python 源码）❤️

逃离我推掉我的手 2023-10-08 14:21 44阅读 0赞

![在这里插入图片描述][5fb87c883155482198a70b4dca710d26.gif_pic_center]

### 缘起，为什么要进行小程序自动化测试 ###

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

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

今天要带来的是：微信小程序自动化测试的一些最佳实践心得，包括微信小程序的基本测试技术和操作方法，以及如何利用 Appium 的 WebView 测试技术 + adb proxy 完成微信小程序的自动化测试（可能是目前最实用的小程序自动化测试技术），并附上 Python 版源码。

**需要什么资料软件别花钱来这看看**

> **配套视频资料：《微信小程序自动化测试》内容包括：小程序搜索测试脚本编写、技术选型、小程序测试常见问题，进阶学习文末加群群里有链接提取码要找管理员！**

### 小程序运行环境 ###

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16]

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

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

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

### 微信小程序技术架构 ###

微信小程序技术架构如下图所示：  
![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 1]

### 使用 Chrome 调试小程序 ###

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

chrome://inspect/#devices

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

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 2]

可以使用 chrome inspect 分析微信小程序的控件结构与布局：  
![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 3]

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

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_18_color_FFFFFF_t_70_g_se_x_16]

### 小程序的性能测试 ###

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

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 4]

### 微信小程序的自动化测试 ###

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 5]

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

1.Native 原生自动化方式。

*  使用 Appium 即可完成，缺点就是控件定位不够准确，无法深入小程序内部；

2.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"] = "程序员一凡 yifan.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 有一定的延迟需要等待

最后：学习不要孤军奋战，最好是能抱团取暖，相互成就一起成长，群众效应的效果是非常强大的，大家一起学习，一起打卡，会更有学习动力，也更能坚持下去。你可以加入我们的测试技术交流扣扣群：914172719（里面有各种软件测试资源和技术讨论）

**喜欢软件测试的小伙伴们，如果我的博客对你有帮助、如果你喜欢我的博客内容，请 “点赞” “评论” “收藏” 一键三连哦！**

--------------------

### 好文推荐 ###

[转行面试，跳槽面试，软件测试人员都必须知道的这几种面试技巧！][Link 1]

[面试经：一线城市搬砖！又面软件测试岗，5000就知足了…][5000]

[面试官：工作三年，还来面初级测试？恐怕你的软件测试工程师的头衔要加双引号…][Link 2]

[什么样的人适合从事软件测试工作？][Link 3]

[那个准点下班的人，比我先升职了…][Link 4]

[测试岗反复跳槽，跳着跳着就跳没了…][Link 5]

[5fb87c883155482198a70b4dca710d26.gif_pic_center]: https://img-blog.csdnimg.cn/5fb87c883155482198a70b4dca710d26.gif#pic_center
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/29ac1813fc3c4d12af11118732c6ae0d.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 1]: https://img-blog.csdnimg.cn/63bc045795644600916851ed5d936dbf.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 2]: https://img-blog.csdnimg.cn/69d406385a5e45188fad251f1475798e.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 3]: https://img-blog.csdnimg.cn/c6071779e8fe4696b2856f200c2d1d81.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_18_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/5afc1bda96274d4ca690ecc27f759276.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_18,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 4]: https://img-blog.csdnimg.cn/398c491631874958aad5f8148001011e.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb_size_20_color_FFFFFF_t_70_g_se_x_16 5]: https://img-blog.csdnimg.cn/5fbe9a3de0df4371b6cd99c88a8deb30.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA6L2v5Lu25rWL6K-V5ZCb,size_20,color_FFFFFF,t_70,g_se,x_16
[Link 1]: https://blog.csdn.net/m0_56736369/article/details/117909132
[5000]: https://blog.csdn.net/m0_56736369/article/details/117915399
[Link 2]: https://blog.csdn.net/weixin_50829653/article/details/117422433
[Link 3]: https://blog.csdn.net/weixin_50271247/article/details/108421434
[Link 4]: https://blog.csdn.net/weixin_50829653/article/details/117856900
[Link 5]: https://blog.csdn.net/m0_56736369/article/details/117923266