携岛项目（XieLi）全链路自动化测试方案与技能报告

本报告针对携岛项目（包含 Spring Boot 后端 Api、Vue 3 管理后台 AdminWeb 及微信小程序商户端）的商户入驻申请至平台审核激活核心业务逻辑，总结整理了一套全链路自动化测试实施方案与技能图谱。

---

一、 核心业务流自动化测试设计

商户入驻流程跨越了小程序端、后台管理端和支付网关。自动化测试需要对这些节点进行仿真和状态判定。

---

二、 测试技能维度与技术栈

针对项目的多端架构，我们划分出三个主要的自动化测试技能维度：

测试层次	测试目标	技术栈 / 工具	核心实现手段
后端接口集成测试	业务接口、状态流转、DB事务控制、安全策略拦截	JUnit 5, @SpringBootTest, MockMvc, Mockito	拦截外部第三方云接口；用 SecurityContext 模拟管理员登录态；利用 Redis 注入手机验证态；使用数据库事务自动回滚。
AdminWeb UI 测试	平台端审核审批流操作、表单项校验、页面导航、列表数据呈现	Playwright (推荐) / Cypress, Node.js	启动真实浏览器，自动模拟管理员登录，点击“商户管理”->“入驻审核”，点击按钮，填写意见并断言页面状态。
微信小程序 UI 测试	商户端入驻表单录入、OCR证照上传反馈、微信统一下单与模拟支付	Minium (微信官方框架), Python/Node.js	驱动微信开发者工具，Mock 掉手机拍照/相册选择组件并替换为本地图片；拦截并 Mock wx.requestPayment 接口。

---

三、 各端自动化测试具体实现方案

1. 后端接口集成测试 (Java - Api Module)

后端集成测试主要在不启动完整外设服务的状态下，验证接口的输入校验、数据库存取、状态变化 and 敏感数据加密。

NOTE

Mock 外部接口关键设计

• 短信发送 (SmsService): 通过 @MockBean 模拟，或在测试中提前用 RedisCache 写入 sms_verified:{phone} = "1" 绕过短信验证。
• 微信支付接口 (platformWechatPayService): 用 Mock 替代，模拟支付成功的回调报文。

核心测试用例代码结构示例 (JUnit 5)：

@SpringBootTest(properties = {
    "wechat.merchant-miniapp.app-secret=mock_secret",
    "wechat.platform-pay.api-v3-key=12345678901234567890123456789012",
    "wechat.platform-pay.mch-serial-no=mock",
    "wechat.platform-pay.public-key-id=mock"
})
@ActiveProfiles("druid")
@Transactional // 测试完成后自动回滚数据，保持数据库干净
public class MerchantOnboardingWorkflowTest {

    @Autowired private MerchantApplyController applyController;
    @Autowired private XlMerchantController adminController;
    @Autowired private RedisCache redisCache;
    @Autowired private XlMerchantMapper merchantMapper;

    @Test
    public void testFullOnboardingWorkflow() {
        String phone = "13912345678";
        
        // 步骤 1: 注入短信验证通过状态到 Redis
        redisCache.setCacheObject("sms_verified:" + phone, "1", 5, TimeUnit.MINUTES);

        // 步骤 2: 模拟商户提交入驻申请
        MerchantApplyDto applyDto = createValidApplyDto(phone);
        AjaxResult applyResult = applyController.apply(applyDto);
        assertEquals(200, applyResult.get("code"));
        
        MerchantApplyVo applyVo = (MerchantApplyVo) applyResult.get("data");
        Long merchantId = applyVo.getMerchantId();
        assertNotNull(merchantId);

        // 验证入驻初期状态为 1 (PENDING_REVIEW)
        XlMerchant createdMerchant = merchantMapper.selectById(merchantId);
        assertEquals(1, createdMerchant.getStatus().intValue());

        // 步骤 3: 模拟平台管理员登录态 (Spring Security Context)
        LoginUser loginUser = new LoginUser();
        SysUser sysUser = new SysUser();
        sysUser.setUserId(1L);
        sysUser.setUserName("admin");
        loginUser.setUser(sysUser);
        UsernamePasswordAuthenticationToken auth = new UsernamePasswordAuthenticationToken(loginUser, null, null);
        SecurityContextHolder.getContext().setAuthentication(auth);

        // 步骤 4: 管理员进行审核通过操作
        MerchantAuditDto auditDto = new MerchantAuditDto();
        auditDto.setId(merchantId);
        auditDto.setStatus(3); // 审核通过 -> 待支付
        AjaxResult auditResult = adminController.audit(auditDto);
        assertEquals(200, auditResult.get("code"));

        // 步骤 5: 验证商户状态变更为 3 (PENDING_PAYMENT)
        XlMerchant auditedMerchant = merchantMapper.selectById(merchantId);
        assertEquals(3, auditedMerchant.getStatus().intValue());
    }
}

---

二、 管理端 UI 自动化测试 (Vue - AdminWeb)

针对 Vue 项目，我们利用 Playwright 可以在无头浏览器中进行毫秒级的操作流测试。

TIP

Playwright 的优势

• 自动等待机制：无需手动写 sleep，当网络请求返回、Element Plus 的 Dialog 动画完成时，Playwright 会自动捕获元素，避免了测试抖动（Flaky Test）。
• 录制功能：支持通过 npx playwright codegen 直接录制管理员在界面的点击并生成测试代码。

模拟管理员审核的测试脚本示例 (JavaScript)：

const { test, expect } = require('@playwright/test');

test('管理员审核通过商户流程', async ({ page }) => {
  // 1. 登录平台
  await page.goto('http://localhost:80/login');
  await page.fill('input[placeholder="账号"]', 'admin');
  await page.fill('input[placeholder="密码"]', 'admin123');
  await page.click('button:has-text("登录")');
  await page.waitForNavigation();

  // 2. 导航到商户管理
  await page.click('text=商户管理');
  await page.click('text=入驻审核');

  // 3. 搜索测试商户并打开审核弹窗
  await page.fill('input[placeholder="输入商户名称"]', '自动化测试商户');
  await page.click('button:has-text("查询")');
  await page.click('table tr:first-child button:has-text("审核")');

  // 4. 执行审批操作
  await page.click('label:has-text("同意入驻")');
  await page.click('button:has-text("确定")');

  // 5. 校验提示语与状态更新
  const successTip = page.locator('.el-message--success');
  await expect(successTip).toContainText('操作成功');
});

---

三、 小程序端 UI 自动化测试 (WeChat Mini-Program)

使用微信官方推出的 Minium 自动化框架，它打通了与微信客户端底层协议的连接。

IMPORTANT

微信小程序测试的 Mock 策略 在真机或开发者工具中跑测试时，由于无法在测试环境中真正调用摄像头拍照或使用真实微信钱包支付，我们需要对微信原生组件进行 Mock：

• Ocr 拍照组件 Mock：测试脚本拦截 wx.chooseImage 接口，自动返回本地存储 of 测试营业执照图片路径，绕过人工选择文件的限制。
• 微信支付 Mock：拦截 wx.requestPayment，使其直接回调 success 块，从而模拟保证金顺利支付完成。

Minium 驱动小程序测试脚本示例 (Python)：

import minium

class MerchantApplyTest(minium.MiniTest):
    def test_submit_apply(self):
        # 1. 启动并获取小程序页面实例
        page = self.mini.app.get_current_page()
        
        # 2. 跳转到申请入驻页面
        self.mini.app.redirect_to("/pages/login/login")
        page.click("button.apply-entrance-btn") # 点击入驻入口
        
        # 3. 填写文本表单
        page.input("input[name='merchantName']", "自动化测试商户")
        page.input("input[name='contactPhone']", "13912345678")
        
        # 4. Mock 微信原生营业执照选择
        self.mini.ext.mock_wx_method(
            "chooseImage", 
            success_res={"tempFilePaths": ["/tmp/mock_license.png"]}
        )
        page.click(".upload-license-uploader") # 触发上传
        
        # 5. 提交入驻申请
        page.click("button.submit-apply-btn")
        
        # 6. 验证成功页面渲染
        success_title = page.get_element(".status-title")
        self.assertEqual(success_title.inner_html, "申请提交成功，待平台审核")

---

四、 自动化集成建议与落地路线

为了帮助项目顺利落地此自动化方案，建议按照以下阶段推进：

1. 第一阶段（性价比最高）： 在后端 ruoyi-admin 模块中创建基于数据库事务回滚的 API 集成测试类。该阶段开发成本低，能够确保所有核心状态流转（入驻-审核-支付回调-注销-退款）在接口级实现全闭环验证，避免 regression bug。
2. 第二阶段（覆盖用户交互）： 引入 Playwright 对 AdminWeb 进行 E2E 覆盖，重点针对商户信息审核、资质查看与驳回/通过弹窗进行 UI 仿真。
3. 第三阶段（高级质量保障）： 使用 Python + Minium 完成小程序端从验证码接收到表单填写的真机/模拟器测试。