/** * ================================================================ * 场景:小游戏完整流程 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(); }); });