guangfei.zhao/appium_ui_test

Fork 0

Files

guangfei.zhao 81102ec396 first commit

2025-10-31 17:53:12 +08:00

11 KiB

Raw Permalink Blame History

🚀 企业级UI测试工具

基于Appium的Android应用UI测试工具，采用模块化架构设计，支持实时截图、XML布局分析、视觉比对、性能监控、智能报告生成等企业级功能。

✨ 核心特性

🎯 主要功能

🔄 零配置启动: 自动创建目录结构，开箱即用
📸 实时截图: 快速捕获当前屏幕状态，支持批量操作
🔍 智能分析: XML布局深度解析，自动识别UI问题
👁️ 视觉验证: 纯图像像素级对比，检查UI外观效果
📐 布局比对: XML-SVG结构比对，验证布局逻辑一致性
⚡ 性能优化: 实时监控操作响应时间和设备状态
📊 详细报告: 生成JSON/HTML格式的专业测试报告

🏗️ 模块化架构

项目采用清晰的模块化设计，便于维护和扩展：

📁 项目结构
├── 📄 ui_test.py           # 主程序入口和交互界面
├── ⚙️ config.py            # 统一配置管理
├── 🔍 xml_analyzer.py      # XML布局分析模块
├── 👁️ visual_comparator.py # 视觉比对分析模块
├── 📊 test_reporter.py     # 测试报告生成模块
├── 📋 requirements.txt     # 项目依赖
├── 📖 README.md           # 项目文档
├── 📁 screenshots/        # 截图保存目录
├── 📁 xml_layouts/        # XML布局保存目录
├── 📁 design_references/  # 设计参考图目录 (SVG格式)
├── 📁 visual_comparisons/ # 视觉对比结果目录
└── 📁 reports/           # 测试报告目录

🔧 模块功能详解

📋 Config (config.py)

统一配置管理
Appium连接设置
目录路径配置
热键映射定义
分析参数调优

🔍 XMLAnalyzer (xml_analyzer.py)

XML结构解析
SVG文件解析和元素提取
XML-SVG布局结构比对
无障碍性问题检测
重复ID识别
空文本元素检查
元素统计分析
数据导出 (JSON/CSV)

👁️ VisualComparator (visual_comparator.py)

多格式图像支持 (PNG/JPG/SVG)
智能图像尺寸处理（保持宽高比）
SSIM相似度计算
差异区域检测
自动图像调整
批量比对处理
结果可视化

📊 TestReporter (test_reporter.py)

专业HTML报告
JSON数据导出
多维度分析
性能数据统计
问题汇总建议
自定义模板支持

🛠️ 安装配置

环境要求

Python 3.8+
Android SDK
Appium Server

依赖安装

pip install -r requirements.txt

主要依赖

Appium-Python-Client>=3.1.0  # Appium客户端
keyboard>=0.13.5              # 热键支持
opencv-python>=4.8.0          # 图像处理
scikit-image>=0.21.0          # 图像分析
lxml>=4.9.0                   # XML解析
jinja2>=3.1.0                 # 报告模板
cairosvg>=2.7.0               # SVG处理

🚀 快速开始

1. 启动Appium服务器

appium

2. 连接设备

连接Android设备或启动模拟器
确保ADB可访问设备

3. 运行测试工具

python ui_test.py

4. 配置应用信息

在 config.py 中修改目标应用配置：

DEVICE_CAPABILITIES = {
    'platformName': 'Android',
    'automationName': 'uiautomator2',
    'deviceName': 'your-device-name',
    'appPackage': 'com.your.app',
    'appActivity': '.MainActivity'
}

🎮 操作指南

热键操作

热键	功能	说明
F1	📸 截图	保存当前屏幕截图
F2	📄 XML布局	保存页面XML结构
F3	📱 应用信息	获取当前应用和Activity
F4	🔍 元素信息	显示页面元素详情
F5	👁️ 视觉比对	纯图像视觉对比（仅外观检查）
F6	🔍 XML分析	XML结构分析 + SVG布局比对
F7	⚡ 性能监控	监控操作性能
F8	🖱️ 元素点击	智能元素交互
F9	📊 生成报告	创建测试报告
Ctrl+Q	🚪 退出	安全退出程序

命令行操作

# 基础操作
help          # 显示帮助信息
status        # 显示连接状态
reconnect     # 重新连接设备

# 功能操作
screenshot    # 截图 (或输入 1)
xml          # 保存XML (或输入 2)
activity     # 应用信息 (或输入 3)
elements     # 元素信息 (或输入 4)
compare      # 视觉比对 - 纯图像对比 (或输入 5)
layout       # XML-SVG布局比对 - 专门的结构对比
analyze      # XML分析和布局比对 (或输入 6)
performance  # 性能监控 (或输入 7)
click        # 元素点击 (或输入 8)
report       # 生成报告 (或输入 9)

# 退出程序
quit         # 退出 (或输入 q)

📊 功能详解

🎯 功能分工说明

👁️ F5 - 视觉比对 (`compare`)

专注功能: 纯视觉图像比对
适用场景: 检查UI外观、颜色、布局视觉效果
操作流程:
1. 自动截图
2. 与设计图进行像素级比对
3. 显示相似度和差异区域
4. 生成可视化比对结果
输出结果: 相似度评分、差异区域标注图

🔍 F6 - XML分析和布局比对 (`analyze`)

专注功能: XML结构分析 + SVG布局比对
适用场景: 检查页面结构、元素层级、布局逻辑
操作流程:
1. 保存并分析XML布局
2. 自动截图（用于报告）
3. 如果有SVG设计图，进行结构比对
4. 生成综合测试报告
输出结果: XML分析报告、布局匹配度、测试报告

📐 layout命令 - 专门布局比对

专注功能: 纯XML-SVG结构比对
适用场景: 专门检查布局结构一致性
操作流程: 直接进行XML和SVG的结构对比
输出结果: 元素匹配情况、结构相似度

🔍 XML分析功能

结构解析: 完整的UI层级结构分析
问题检测:
- 无障碍性问题 (缺少contentDescription)
- 重复资源ID
- 空文本元素
- 尺寸异常元素
统计信息: 元素类型分布、层级深度等
数据导出: 支持JSON和CSV格式

👁️ 视觉比对功能

多格式支持: 专门优化SVG格式处理
智能对比:
- SSIM结构相似性分析
- 差异区域自动标注
- 相似度评分
批量处理: 支持多个设计图同时比对
结果可视化: 生成直观的对比图像

📊 报告生成功能

HTML报告:
- 专业样式设计
- 交互式图表
- 详细问题分析
- 改进建议
JSON数据: 结构化数据导出
多维度分析:
- XML结构分析
- 视觉比对结果
- 性能监控数据
- 问题汇总统计

⚡ 性能监控功能

响应时间: 操作执行时间统计
设备状态: CPU、内存使用情况
操作历史: 详细的操作记录
性能趋势: 长期性能变化分析

🎯 使用场景

📱 UI测试验证

视觉回归测试: 使用F5进行纯图像对比，检查UI外观变化
布局结构验证: 使用F6进行XML-SVG结构比对，确保布局逻辑正确
专项布局测试: 使用layout命令专门检查XML和SVG的结构一致性
性能监控: 实时监控UI操作响应时间

🔍 问题诊断

XML结构分析: 深度解析页面层级，发现结构问题
无障碍性检查: 自动检测缺失的accessibility属性
重复元素识别: 发现重复ID和空文本元素
视觉差异定位: 精确标注UI变化区域

📊 测试报告

综合分析报告: F6生成包含XML分析和布局比对的完整报告
视觉比对报告: F5生成专门的图像对比结果
性能数据统计: 操作响应时间和设备状态监控
多格式导出: 支持JSON、CSV、HTML格式

🔄 自动化测试

from ui_test import InteractiveUITester
from config import Config

# 初始化测试器
tester = InteractiveUITester()
tester.connect_device()

# 执行测试流程
tester.take_screenshot()
tester.save_xml_layout()
tester.compare_with_design()
tester.generate_report()

📊 批量分析

# 批量视觉比对
comparator = VisualComparator()
results = comparator.batch_compare_screenshots()

# 生成综合报告
reporter = TestReporter()
reporter.add_visual_comparison_data(results)
reporter.generate_html_report()

🔍 深度分析

# XML深度分析
analyzer = XMLAnalyzer()
analysis_result = analyzer.analyze_xml_file('layout.xml')
issues = analyzer.check_accessibility_issues()
stats = analyzer.get_element_statistics()

🔧 高级配置

📁 目录结构

appium_ui_test/
├── screenshots/          # 截图文件
├── xml_layouts/         # XML布局文件
├── designs/             # 设计图文件 (PNG/JPG/SVG)
├── reports/             # 测试报告
├── logs/               # 日志文件
└── temp/               # 临时文件

🎨 设计文件支持

图像格式: PNG、JPG（用于视觉比对）
矢量格式: SVG（支持视觉比对 + 布局结构比对）
命名规则: 建议使用描述性文件名
SVG优势:
- 支持双重比对（视觉 + 结构）
- 可缩放无损质量
- 包含布局元素信息

自定义分析规则

在 config.py 中调整分析参数：

XML_ANALYSIS = {
    'check_accessibility': True,
    'check_duplicate_ids': True,
    'check_empty_text': True,
    'min_element_size': 10,
    'max_nesting_level': 15
}

视觉比对优化

VISUAL_COMPARISON = {
    'similarity_threshold': 0.95,
    'diff_threshold': 50,
    'min_diff_area': 100,
    'supported_formats': ['.svg']
}

报告自定义

REPORT = {
    'include_screenshots': True,
    'include_xml_analysis': True,
    'include_visual_comparison': True,
    'include_performance_data': True,
    'template_style': 'professional'
}

🚨 故障排除

常见问题

连接失败
- 检查Appium服务器状态
- 验证设备连接和ADB访问
- 确认设备名称配置正确
模块导入错误
- 安装所有必需依赖: pip install -r requirements.txt
- 检查Python版本兼容性
- 验证虚拟环境激活状态
视觉比对失败
- 确保设计图为SVG格式
- 检查图像文件路径
- 验证cairosvg依赖安装
报告生成失败
- 检查输出目录权限
- 验证Jinja2模板完整性
- 确认数据格式正确性

功能选择指导

只需要检查UI外观: 使用F5（视觉比对）
需要检查布局结构: 使用F6（XML分析+布局比对）
专门比对XML和SVG结构: 使用layout命令
SVG文件: 自动支持双重比对（视觉+结构）
PNG/JPG文件: 仅支持视觉比对

调试模式

启用详细日志输出：

import logging
logging.basicConfig(level=logging.DEBUG)

🤝 贡献指南

欢迎提交Issue和Pull Request来改进项目！

开发环境设置

Fork项目仓库
创建功能分支
安装开发依赖
运行测试套件
提交代码变更

📄 许可证

本项目采用MIT许可证，详见LICENSE文件。

🎉 享受高效的UI测试体验！

11 KiB Raw Permalink Blame History Unescape Escape