8.9 KiB
8.9 KiB
前端界面测试指南 - 邮件和消息队列节点
🎯 测试目标
在前端界面中测试新实现的邮件节点和消息队列节点,验证:
- 节点在工具箱中正确显示
- 节点可以拖拽到画布
- 节点配置面板正确显示
- 节点配置可以保存
- 工作流可以执行
📋 前置条件
- 前端服务运行: http://101.43.95.130:8038
- 后端服务运行: http://101.43.95.130:8037
- 用户已登录
🚀 测试步骤
步骤1: 登录系统
- 打开浏览器,访问: http://101.43.95.130:8038
- 如果未登录,使用测试账号登录:
- 用户名:
test_user - 密码:
test_password123 - 或使用您自己的账号
- 用户名:
步骤2: 进入工作流设计器
- 在首页点击"工作流管理"
- 点击"创建新工作流"按钮
- 或点击现有工作流的"设计"按钮
步骤3: 测试邮件节点
3.1 添加邮件节点
-
查看左侧节点工具箱
- 应该能看到"邮件"节点(带有Message图标)
- 位置:在"Webhook"节点之后,"输出"节点之前
-
拖拽邮件节点到画布
- 从左侧工具箱拖拽"邮件"节点
- 放到画布中央位置
- 节点应该成功添加到画布
-
连接节点
- 如果画布中有"开始"节点,连接开始节点到邮件节点
- 如果没有开始节点,先添加一个开始节点
- 添加"结束"节点,连接邮件节点到结束节点
3.2 配置邮件节点
-
点击邮件节点,右侧应该显示配置面板
-
检查配置项,应该看到以下字段:
- ✅ SMTP服务器
- ✅ SMTP端口
- ✅ SMTP用户名
- ✅ SMTP密码(密码输入框)
- ✅ 使用TLS(开关)
- ✅ 发件人邮箱
- ✅ 收件人邮箱
- ✅ 抄送邮箱(可选)
- ✅ 密送邮箱(可选)
- ✅ 邮件主题
- ✅ 邮件正文类型(下拉选择:纯文本/HTML)
- ✅ 邮件正文(多行文本)
- ✅ 附件(可选,JSON格式)
-
填写测试配置:
SMTP服务器: smtp.gmail.com SMTP端口: 587 SMTP用户名: your-email@gmail.com SMTP密码: [您的应用专用密码] 使用TLS: ✅ 开启 发件人邮箱: your-email@gmail.com 收件人邮箱: recipient@example.com 邮件主题: 测试邮件 - {test_key} 邮件正文类型: 纯文本 邮件正文: 这是一封测试邮件。 测试数据: {test_data} 时间: {timestamp} -
测试变量替换提示
- 在主题和正文中使用
{test_key},{test_data},{timestamp} - 应该看到提示信息说明支持变量替换
- 在主题和正文中使用
-
保存节点配置
- 点击"保存配置"按钮
- 应该看到"节点配置已保存"的提示
3.3 保存工作流
- 点击工具栏的"保存"按钮
- 应该看到"工作流已保存"的提示
- 工作流名称会自动生成或可以手动编辑
3.4 运行工作流
- 点击"运行"按钮
- 在运行对话框中输入测试数据:
{ "test_key": "Hello World", "test_data": "这是测试数据", "timestamp": "2024-01-01 12:00:00" } - 点击"开始运行"
- 查看执行结果:
- 执行状态应该显示为"运行中"或"已完成"
- 如果配置了真实的SMTP服务器,邮件应该成功发送
- 如果未配置,会显示连接错误(这是正常的)
步骤4: 测试消息队列节点(RabbitMQ)
4.1 添加消息队列节点
-
查看左侧节点工具箱
- 应该能看到"消息队列"节点(带有Connection图标)
- 位置:在"邮件"节点之后
-
拖拽消息队列节点到画布
- 从左侧工具箱拖拽"消息队列"节点
- 放到画布上
-
连接节点
- 连接开始节点到消息队列节点
- 连接消息队列节点到结束节点
4.2 配置消息队列节点
-
点击消息队列节点,右侧应该显示配置面板
-
选择队列类型
- 下拉选择"RabbitMQ"或"Kafka"
- 选择后,配置面板会显示对应的配置项
-
RabbitMQ配置项(选择RabbitMQ时):
- ✅ 主机地址
- ✅ 端口
- ✅ 用户名
- ✅ 密码(密码输入框)
- ✅ Exchange(可选)
- ✅ Routing Key
- ✅ 队列名称
- ✅ 消息内容(JSON格式)
-
填写RabbitMQ测试配置:
队列类型: RabbitMQ 主机地址: localhost 端口: 5672 用户名: guest 密码: guest 队列名称: test_queue Routing Key: test.routing.key 消息内容: { "test_key": "{test_key}", "test_data": "{test_data}", "timestamp": "{timestamp}" } -
保存节点配置
4.3 测试Kafka配置
-
切换队列类型为Kafka
- 配置面板会显示Kafka相关配置
-
Kafka配置项:
- ✅ Bootstrap Servers
- ✅ Topic
- ✅ 消息内容(JSON格式)
-
填写Kafka测试配置:
队列类型: Kafka Bootstrap Servers: localhost:9092 Topic: test_topic 消息内容: { "test_key": "{test_key}", "test_data": "{test_data}", "timestamp": "{timestamp}" } -
保存节点配置
4.4 保存并运行工作流
- 保存工作流
- 运行工作流,输入测试数据:
{ "test_key": "Hello Queue", "test_data": "这是测试数据", "timestamp": "2024-01-01 12:00:00" } - 查看执行结果
✅ 测试检查清单
邮件节点测试
- 节点在工具箱中显示("邮件"节点)
- 节点可以拖拽到画布
- 节点配置面板正确显示所有配置项
- 可以填写和修改配置
- 配置可以保存
- 工作流可以保存
- 工作流可以运行
- 变量替换提示正确显示
- HTML格式选项可以切换
消息队列节点测试
- 节点在工具箱中显示("消息队列"节点)
- 节点可以拖拽到画布
- 队列类型可以切换(RabbitMQ/Kafka)
- RabbitMQ配置项正确显示
- Kafka配置项正确显示
- 配置可以保存
- 工作流可以保存
- 工作流可以运行
- 变量替换提示正确显示
通用测试
- 节点可以连接(连线功能)
- 节点可以删除
- 节点可以复制粘贴
- 画布缩放功能正常
- 保存状态提示正常
🐛 常见问题排查
问题1: 节点在工具箱中不显示
可能原因:
- 前端代码未更新
- 浏览器缓存问题
解决方法:
- 刷新浏览器(Ctrl+F5 强制刷新)
- 检查浏览器控制台是否有错误
- 确认前端服务已重启
问题2: 配置面板不显示
可能原因:
- 节点未正确选中
- 配置面板被隐藏
解决方法:
- 点击节点确保选中(节点应该高亮)
- 检查右侧配置面板是否可见
- 尝试刷新页面
问题3: 配置无法保存
可能原因:
- 后端API错误
- 网络连接问题
解决方法:
- 检查浏览器控制台的网络请求
- 查看是否有错误信息
- 检查后端服务是否正常运行
问题4: 工作流执行失败
可能原因:
- 未配置真实的SMTP/RabbitMQ/Kafka服务器
- 配置信息错误
- 网络连接问题
解决方法:
- 检查执行详情页面的错误信息
- 确认外部服务配置正确
- 查看执行日志了解详细错误
📸 预期界面效果
节点工具箱
左侧应该显示以下节点(按顺序):
- 开始
- 输入
- LLM
- 条件
- 转换
- 循环
- Agent
- HTTP请求
- 数据库
- 文件操作
- 定时任务
- Webhook
- 邮件 ← 新节点
- 消息队列 ← 新节点
- 输出
- 结束
邮件节点配置面板
右侧配置面板应该显示:
- 标题:"节点配置"
- 节点ID(只读)
- 节点类型(只读)
- 节点名称
- SMTP配置区域
- 邮件内容配置区域
- 附件配置区域
- 保存/复制/删除按钮
消息队列节点配置面板
右侧配置面板应该显示:
- 队列类型选择(下拉)
- RabbitMQ配置区域(选择RabbitMQ时)
- Kafka配置区域(选择Kafka时)
- 消息内容配置区域
- 保存/复制/删除按钮
🎯 测试数据示例
邮件节点测试数据
{
"test_key": "Hello World",
"test_data": "这是测试数据",
"timestamp": "2024-01-01 12:00:00",
"user_name": "测试用户",
"order_id": "12345"
}
消息队列节点测试数据
{
"test_key": "Hello Queue",
"test_data": "这是测试数据",
"timestamp": "2024-01-01 12:00:00",
"event_type": "user_action",
"user_id": "12345"
}
📝 测试记录
测试时请记录:
- 测试时间
- 测试环境(浏览器、操作系统)
- 测试结果(通过/失败)
- 遇到的问题
- 截图(如果有)
🎉 测试完成
测试通过后,您可以:
- 在实际工作流中使用这些节点
- 配置真实的SMTP/RabbitMQ/Kafka服务器进行实际测试
- 继续开发其他功能
测试指南版本: v1.0
最后更新: 2024年1月17日