/** * ================================================================ * 场景:活动报名全流程 E2E 测试 * ================================================================ * 用户故事: * - 管理员:创建/发布活动,审核报名 * - 家长/孩子:浏览活动,报名/取消报名 * * 流程步骤: * 1. 管理员创建并发布活动 * 2. 家长浏览活动并报名 * 3. 管理员审核报名 * 4. 家长取消报名 * * 关键里程碑: * - [Milestone-1] 活动发布成功 * - [Milestone-2] 报名成功 * - [Milestone-3] 审核成功 * ================================================================ * * 运行:npx playwright test tests/e2e/activity-registration.spec.js */ const { test, expect } = require('@playwright/test'); test.describe('【场景流程】活动报名全流程', () => { // ===== 场景1:管理员创建并发布活动 ===== test('[场景1] 管理员创建并发布活动 - 期望发布成功', async ({ page }) => { // ========== Given:管理员进入活动管理页 ========== await page.goto('/#/pages/admin/activity-list'); await page.waitForLoadState('networkidle'); // ========== When:创建活动 ========== const createBtn = page.locator('.create-btn, .add-activity-btn'); if (await createBtn.isVisible()) { await createBtn.click(); } else { await page.goto('/#/pages/admin/activity-create'); await page.waitForLoadState('networkidle'); } await page.waitForSelector('.activity-form, .create-form', { timeout: 5000 }); // 填写活动名称 const titleInput = page.locator('input[name="title"], .title-input'); if (await titleInput.isVisible()) { await titleInput.fill('测试活动_' + Date.now()); } // 填写活动描述 const descInput = page.locator('textarea[name="description"], .desc-input'); if (await descInput.isVisible()) { await descInput.fill('这是一个测试活动,描述活动的具体内容。'); } // 填写地点 const locationInput = page.locator('input[name="location"], .location-input'); if (await locationInput.isVisible()) { await locationInput.fill('线上活动'); } // 填写人数上限 const maxInput = page.locator('input[name="maxParticipants"], .max-input'); if (await maxInput.isVisible()) { await maxInput.fill('50'); } // 发布活动 await page.click('.publish-btn, .submit-btn'); // ========== Then:Milestone-1 - 发布成功 ======== await page.waitForSelector('.success-tip, .publish-success', { timeout: 10000 }); expect(await page.locator('.success-tip, .publish-success').isVisible()).toBeTruthy(); }); // ===== 场景2:家长浏览活动并报名 ===== test('[场景2] 家长浏览活动并报名 - 期望报名成功', async ({ page }) => { // ========== Given:家长进入活动列表页 ========== await page.goto('/#/pages/discover-detail/activity-list'); await page.waitForLoadState('networkidle'); // ========== When:浏览并选择活动 ========== await page.waitForSelector('.activity-item, .activity-card', { timeout: 10000 }); // 点击第一个活动 await page.locator('.activity-item').first().click(); // 等待活动详情加载 await page.waitForSelector('.activity-detail, .detail-content', { timeout: 5000 }); // 点击报名按钮 const registerBtn = page.locator('.register-btn, .sign-up-btn, .apply-btn'); if (await registerBtn.isVisible()) { await registerBtn.click(); } // 选择孩子 const childSelect = page.locator('.child-picker, .select-child'); if (await childSelect.isVisible()) { await childSelect.click(); await page.waitForSelector('.child-option', { timeout: 3000 }); await page.locator('.child-option').first().click(); } // 确认报名 await page.click('.confirm-btn, .submit-btn'); // ========== Then:Milestone-2 - 报名成功 ======== await page.waitForSelector('.success-tip, .register-success, .toast-success', { timeout: 10000 }); expect(await page.locator('.success-tip, .register-success').isVisible()).toBeTruthy(); }); // ===== 场景3:管理员审核报名 ===== test('[场景3] 管理员审核报名 - 期望审核成功', async ({ page }) => { // ========== Given:管理员进入报名管理页 ========== await page.goto('/#/pages/admin/registration-list'); await page.waitForLoadState('networkidle'); // ========== When:审核报名 ========== await page.waitForSelector('.registration-item, .apply-item', { timeout: 10000 }); const approveBtn = page.locator('.approve-btn, .pass-btn').first(); if (await approveBtn.isVisible()) { await approveBtn.click(); } // ========== Then:Milestone-3 - 审核成功 ======== await page.waitForTimeout(500); // 验证状态变化 const statusTag = page.locator('.status-tag, .registration-status'); if (await statusTag.isVisible()) { const statusText = await statusTag.textContent(); expect(statusText).toMatch(/已通过|approved/i); } }); // ===== 场景4:家长取消报名 ===== test('[场景4] 家长取消报名 - 期望取消成功', async ({ page }) => { // ========== Given:家长进入我的报名页 ========== await page.goto('/#/pages/profile/my-activities'); await page.waitForLoadState('networkidle'); // ========== When:取消报名 ========== await page.waitForSelector('.registration-item, .my-activity', { timeout: 10000 }); const cancelBtn = page.locator('.cancel-btn, .cancel-registration').first(); if (await cancelBtn.isVisible()) { await cancelBtn.click(); } // 确认取消 const confirmBtn = page.locator('.van-dialog__confirm, .dialog-confirm'); if (await confirmBtn.isVisible()) { await confirmBtn.click(); } // ========== Then:取消成功 ======== await page.waitForSelector('.cancel-success, .toast-success', { timeout: 10000 }); expect(await page.locator('.cancel-success, .toast-success').isVisible()).toBeTruthy(); }); });