cfc/tests/e2e/activity-registration.spec.js

/**
 * ================================================================
 * 场景：活动报名全流程 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();
  });

});