cfc/tests/e2e/mini-games-full.spec.js

/**
 * ================================================================
 * 场景：小游戏完整流程 E2E 测试
 * ================================================================
 * 用户故事：孩子完成小游戏任务（舒尔特方格/猜数字/数独）
 *
 * 流程步骤：
 *   1. 查看可选小游戏
 *   2. 完成舒尔特方格
 *   3. 完成猜数字
 *   4. 完成数独
 *   5. 进行认知训练
 *
 * 关键里程碑：
 *   - [Milestone-1] 游戏1完成
 *   - [Milestone-2] 认知训练完成
 * ================================================================
 *
 * 运行：npx playwright test tests/e2e/mini-games-full.spec.js
 */

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

test.describe('【场景流程】小游戏完整流程', () => {

  // ===== 场景1：查看可选小游戏 =====

  test('[场景1] 查看可选小游戏 - 期望返回游戏列表', async ({ page }) => {
    // ========== Given：创建任务时 ==========
    await page.goto('/#/pages/tasks/create-task');
    await page.waitForLoadState('networkidle');

    // ========== When：选择小游戏类型 ==========
    const gameSelect = page.locator('.minigame-picker, .game-type-select');
    if (await gameSelect.isVisible()) {
      await gameSelect.click();
    }

    // ========== Then：返回游戏列表 ========
    await page.waitForSelector('.game-option, .minigame-item', { timeout: 5000 });

    const gameOptions = page.locator('.game-option, .minigame-item');
    const count = await gameOptions.count();

    expect(count).toBeGreaterThan(0);
  });

  // ===== 场景2：完成舒尔特方格 =====

  test('[场景2] 完成舒尔特方格 - 期望游戏完成', async ({ page }) => {
    // ========== Given：进入舒尔特方格游戏 ==========
    await page.goto('/#/pages/games/schulte');
    await page.waitForLoadState('networkidle');

    // ========== When：完成游戏 ==========
    await page.waitForSelector('.schulte-grid, .game-grid', { timeout: 5000 });

    // 获取所有格子并按顺序点击
    const cells = page.locator('.grid-cell, .cell');
    const count = await cells.count();

    // 按数字顺序点击（假设数字从1开始显示）
    for (let i = 0; i < Math.min(count, 9); i++) {
      await cells.nth(i).click();
      await page.waitForTimeout(100);
    }

    // ========== Then：Milestone-1 - 游戏完成 ========
    await page.waitForSelector('.game-complete, .result-card', { timeout: 10000 });

    const resultCard = page.locator('.game-complete, .result-card');
    expect(await resultCard.isVisible()).toBeTruthy();
  });

  // ===== 场景3：完成猜数字 =====

  test('[场景3] 完成猜数字 - 期望游戏完成', async ({ page }) => {
    // ========== Given：进入猜数字游戏 ==========
    await page.goto('/#/pages/games/1a2b');
    await page.waitForLoadState('networkidle');

    // ========== When：进行游戏 ==========
    await page.waitForSelector('.guess-input, .input-area', { timeout: 5000 });

    // 输入猜测
    const input = page.locator('.guess-input, .number-input');
    if (await input.isVisible()) {
      await input.fill('1234');
    }

    // 提交猜测
    const submitBtn = page.locator('.submit-btn, .guess-btn');
    if (await submitBtn.isVisible()) {
      await submitBtn.click();
    }

    // ========== Then：返回猜测结果 ========
    await page.waitForSelector('.result-hint, .guess-result', { timeout: 5000 });

    const resultHint = page.locator('.result-hint, .guess-result');
    expect(await resultHint.isVisible()).toBeTruthy();
  });

  // ===== 场景4：完成数独 =====

  test('[场景4] 完成数独 - 期望游戏完成', async ({ page }) => {
    // ========== Given：进入数独游戏 ==========
    await page.goto('/#/pages/games/sudoku');
    await page.waitForLoadState('networkidle');

    // ========== When：进行游戏 ==========
    await page.waitForSelector('.sudoku-grid, .game-board', { timeout: 5000 });

    // 点击一个空格
    const emptyCell = page.locator('.cell.empty, .cell:not(.fixed)').first();
    if (await emptyCell.isVisible()) {
      await emptyCell.click();
    }

    // 选择数字
    const numBtn = page.locator('.num-btn:has-text("1")').first();
    if (await numBtn.isVisible()) {
      await numBtn.click();
    }

    // ========== Then：数字填入 ========
    await page.waitForTimeout(500);

    const filledCell = page.locator('.cell.filled');
    const hasFilled = await filledCell.count() > 0;
    expect(hasFilled).toBeTruthy();
  });

  // ===== 场景5：进行认知训练 =====

  test('[场景5] 进行认知训练 - 期望训练记录生成', async ({ page }) => {
    // ========== Given：进入智维度 ==========
    await page.goto('/#/pages/wisdom/training-hub');
    await page.waitForLoadState('networkidle');

    // ========== When：开始训练 ==========
    const startBtn = page.locator('.start-btn, .start-training');
    if (await startBtn.isVisible()) {
      await startBtn.click();
    }

    // 等待训练开始
    await page.waitForSelector('.training-content, .quiz-area', { timeout: 5000 });

    // 完成一道题目
    const answerBtn = page.locator('.answer-btn, .option').first();
    if (await answerBtn.isVisible()) {
      await answerBtn.click();
    }

    // ========== Then：Milestone-2 - 训练记录生成 ========
    await page.waitForSelector('.training-complete, .result-saved', { timeout: 10000 });

    const completeTip = page.locator('.training-complete, .result-saved');
    expect(await completeTip.isVisible()).toBeTruthy();
  });

});