cfc/tests/e2e/contact-management.spec.js

/**
 * ================================================================
 * 场景：联系人管理全流程 E2E 测试
 * ================================================================
 * 用户故事：家长管理社会联系人（朋友/同事/合作伙伴）
 *
 * 流程步骤：
 *   1. 创建联系人
 *   2. 通讯录导入
 *   3. 记录互动
 *   4. 编辑/删除联系人
 *
 * 关键里程碑：
 *   - [Milestone-1] 联系人创建成功
 * ================================================================
 *
 * 运行：npx playwright test tests/e2e/contact-management.spec.js
 */

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

test.describe('【场景流程】联系人管理全流程', () => {

  // ===== 场景1：创建联系人 =====

  test('[场景1] 创建联系人 - 期望创建成功', async ({ page }) => {
    // ========== Given：进入联系人页 ==========
    await page.goto('/#/pages/action/contact-detail');
    await page.waitForLoadState('networkidle');

    // ========== When：创建联系人 ==========
    const addBtn = page.locator('.add-btn, .add-contact-btn');
    if (await addBtn.isVisible()) {
      await addBtn.click();
    }

    await page.waitForSelector('.contact-form', { timeout: 5000 });

    // 填写姓名
    const nameInput = page.locator('input[name="name"], .name-input');
    if (await nameInput.isVisible()) {
      await nameInput.fill('测试联系人_' + Date.now());
    }

    // 填写手机号
    const phoneInput = page.locator('input[name="phone"], .phone-input');
    if (await phoneInput.isVisible()) {
      await phoneInput.fill('138' + String(Date.now()).slice(-8));
    }

    // 选择关系类型
    const relationSelect = page.locator('.relation-picker, select[name="relationshipType"]');
    if (await relationSelect.isVisible()) {
      await relationSelect.selectOption('friend');
    }

    // 提交
    await page.click('.submit-btn, .save-btn');

    // ========== Then：Milestone-1 - 创建成功 ========
    await page.waitForSelector('.success-tip, .contact-added, .toast-success', { timeout: 10000 });
    expect(await page.locator('.success-tip, .contact-added').isVisible()).toBeTruthy();
  });

  // ===== 场景2：通讯录导入 =====

  test('[场景2] 通讯录导入 - 期望导入成功', async ({ page }) => {
    // ========== Given：进入联系人导入页 ==========
    await page.goto('/#/pages/action/contact-import');
    await page.waitForLoadState('networkidle');

    // ========== When：导入通讯录 ==========
    const importBtn = page.locator('.import-btn, .import-contacts-btn');
    if (await importBtn.isVisible()) {
      await importBtn.click();
    }

    // 选择导入方式
    const selectBtn = page.locator('.select-contacts-btn');
    if (await selectBtn.isVisible()) {
      await selectBtn.click();
    }

    // 选择要导入的联系人
    await page.waitForSelector('.contact-item', { timeout: 5000 });
    await page.locator('.contact-item').first().click();

    // 确认导入
    await page.click('.confirm-import-btn, .submit-btn');

    // ========== Then：导入成功 ========
    await page.waitForSelector('.success-tip, .import-success, .toast-success', { timeout: 15000 });
    expect(await page.locator('.success-tip, .import-success').isVisible()).toBeTruthy();
  });

  // ===== 场景3：记录互动 =====

  test('[场景3] 记录互动 - 期望记录成功', async ({ page }) => {
    // ========== Given：进入联系人详情 ==========
    await page.goto('/#/pages/action/contact-detail');
    await page.waitForLoadState('networkidle');

    // 选择一个联系人
    await page.waitForSelector('.contact-item', { timeout: 5000 });
    await page.locator('.contact-item').first().click();

    // ========== When：记录互动 ==========
    const interactBtn = page.locator('.interact-btn, .add-interaction');
    if (await interactBtn.isVisible()) {
      await interactBtn.click();
    }

    await page.waitForSelector('.interaction-form', { timeout: 5000 });

    // 填写互动内容
    const noteInput = page.locator('textarea[name="note"], .note-input');
    if (await noteInput.isVisible()) {
      await noteInput.fill('今天一起吃饭，讨论了合作事宜。');
    }

    await page.click('.submit-btn, .save-btn');

    // ========== Then：记录成功 ========
    await page.waitForSelector('.success-tip, .interaction-added', { timeout: 10000 });
    expect(await page.locator('.success-tip, .interaction-added').isVisible()).toBeTruthy();
  });

  // ===== 场景4：编辑/删除联系人 =====

  test('[场景4] 编辑/删除联系人 - 期望操作成功', async ({ page }) => {
    // ========== Given：进入联系人列表 ==========
    await page.goto('/#/pages/action/contact-detail');
    await page.waitForLoadState('networkidle');

    // ========== When：编辑联系人 ==========
    await page.waitForSelector('.contact-item', { timeout: 5000 });

    const firstContact = page.locator('.contact-item').first();
    const editBtn = firstContact.locator('.edit-btn');

    if (await editBtn.isVisible()) {
      await editBtn.click();
    } else {
      await firstContact.click();
    }

    await page.waitForSelector('.edit-form, .contact-form', { timeout: 5000 });

    // 修改姓名
    const nameInput = page.locator('input[name="name"], .name-input');
    if (await nameInput.isVisible()) {
      await nameInput.fill('已更新联系人_' + Date.now());
    }

    await page.click('.save-btn, .submit-btn');

    // ========== Then：操作成功 ========
    await page.waitForSelector('.success-tip, .update-success', { timeout: 10000 });
    expect(await page.locator('.success-tip, .update-success').isVisible()).toBeTruthy();
  });

});