雪球 RN 应用前端自动化测试实践：基于 Airtest 的全链路解决方案
一、RN（React Native）业务背景与挑战
RN技术定位：
雪球核心业务（如基金交易、社区互动）采用RN开发，实现iOS/Android代码共用，提升迭代效率。但RN的动态界面特性（如组件动态渲染、异步加载）给自动化测试带来以下挑战：
- 界面元素不稳定：无固定ID的动态按钮、列表项导致传统控件定位失效；
- 跨端兼容性：iOS与Android的UI渲染差异显著，混合开发模块（RN+原生）适配困难；
- 实时数据依赖：基金净值、交易限额等实时接口延迟影响脚本执行稳定性。
二、自动化测试工具链选型
Airtest | 跨平台图像识别，模拟用户点击、滑动等操作 | 定位无固定ID的动态按钮、弹框 |
Poco | UI控件精准识别与断言（支持RN组件树解析） | 校验文本内容（如支付提示、错误信息） |
pytesseract | OCR文字识别（结合图像处理） | 解析动态渲染的文本（如基金净值截图） |
Mockoon | 接口模拟服务（支持动态模板与代理转发） | 隔离后端依赖，稳定测试环境 |
三、OCR技术在RN自动化中的深度应用
1. 技术实现链路
- 核心步骤： 区域截图：使用Airtest的capture_screen()获取目标区域（如定投周期选择器）；预处理优化： 灰度化（Image.convert("L")）减少色彩干扰；二值化（阈值调整）分离文字与背景；文字解析：通过pytesseract.image_to_string()识别中英文混合文本；业务断言：验证识别结果是否符合预期（如“每周周五”定投周期）。
2. 实战示例：定投周期动态文本校验
- 场景：RN自定义定投周期选择组件（无原生控件，文本通过Canvas渲染）。
- 实现代码：
img = G.DEVICE.snapshot(rect=(500, 800, 700, 900)) # 截取选择器区域
processed_img = img.convert("L").point(lambda x: 0 if x < 180 else 255)
cycle_text = pytesseract.image_to_string(processed_img, config="--psm 7")
assert "每周" in cycle_text, "定投周期识别失败"
- 优化点：通过
config="--psm 7"指定单行文本模式，提升识别准确率。
四、RN链路业务自动化示例：基金买入全流程
1. 业务流程拆解
搜索基金 | Airtest图像点击搜索框 + Poco断言结果列表 | 基金名称文本与代码匹配 |
选择子账户 | Poco遍历列表组件 + 图像点击确认 | 子账户名称正确回显 |
金额校验 | OCR识别最低买入金额 + Poco动态文本断言 | 组合支付逻辑（现金宝+银行卡额度） |
密码输入 | Airtest图像模拟安全键盘点击 | 避免原生控件Hook引发安全风险 |
结果验证 | Airtest图像比对 + Poco界面跳转断言 | 资产列表页显示最新交易记录 |
2. 代码片段：组合支付逻辑校验
def combine_pay_tip_assert():
tip_text = poco(textMatches="先从现金宝扣款.*").get_text()
assert "现金宝" in tip_text and "银行卡" in tip_text, "组合支付提示缺失"
五、RN自动化测试核心问题与解决方案
动态界面定位 | 列表项无固定ID、弹框随机生成 | Airtest图像识别 + Poco层级遍历（如
） |
跨线程延迟 | RN调用原生API后元素未加载完成 | 显式等待（
） |
动画干扰 | 滑动加载时元素位置动态变化 | 精准坐标滑动（
） + 动画周期
|
混合开发兼容 | RN与原生模块切换时控件识别失效 | 多框架混合使用（RN界面用Poco，原生界面切Appium） |
接口依赖 | 实时数据接口延迟导致脚本失败 | Mockoon模拟接口响应 + Charles代理转发 |
六、自建自动化测试平台架构
1. 平台能力全景
- 技术栈： 前端：React+Ant Design（脚本管理、报告可视化）；后端：Flask+MySQL（执行记录）+ Redis+RQ（任务队列）；执行层：Shell脚本调用Airtest，支持10+设备并行（iOS/Android）。
- 核心特性： 多设备调度：随机/指定设备执行，支持同时运行20+脚本；Mock服务集成：一键切换真实/模拟接口环境，提升脚本稳定性；智能报告：自动标注失败步骤截图，支持日志与图像联动分析。
2. 并行执行优化
- 通过
Supervisor+RQ为每台设备创建独立任务队列（如“iPhone12”队列），实现硬件资源高效利用； - 执行效率对比：单设备串行需4小时 → 5设备并行仅需30分钟。
七、落地成果与未来规划
- 量化收益： 核心业务自动化覆盖率：70%+（基金交易、定投等高频场景）；脚本执行成功率：从60%提升至92%（引入Mock服务后）；人力成本：回归测试人力投入减少50%，脚本维护效率提升30%。
- 未来方向： AI赋能：探索基于计算机视觉的自动脚本生成，降低界面变更维护成本；全链路覆盖：扩展至社区互动、投顾服务等复杂业务流程；边缘场景支持：适配折叠屏、平板等小众设备，提升兼容性测试效率。
总结
雪球团队通过“图像识别+控件定位+OCR文本解析”的立体化方案，结合自建自动化平台，系统性解决了RN应用的测试难题。该方案以基金交易流程为典型切入点，展现了从技术选型、场景落地到工程化实现的全链路实践，为同类RN项目提供了可复用的测试范式。未来，随着AI技术的深度融入，前端自动化测试将向“低代码、自维护”方向进一步演进，持续释放效率红利。
我的反思：Airtest图像识别 + Poco层级遍历是啥 怎么搞？
场景 1：动态生成的按钮（无固定 ID）
- 问题：RN 应用中通过 JS 动态生成的按钮，无稳定 ID 或 XPath。
- 解决方案：Airtest 图像识别：截图按钮作为模板，使用touch(Template("btn_buy.png"))点击。Poco 层级遍历：点击后通过poco("支付成功").exists()验证结果。
场景 2：复杂列表项操作
- 问题：列表项包含动态内容（如基金名称、净值），需精准定位特定项。
- 解决方案：Poco 层级遍历：通过poco("ListView").child("Cell")遍历列表项。Airtest 图像识别：对特定项中的图标（如 “加自选”）截图匹配并点击。
