ci: 添加 E2E 测试与 CI/CD 配置

- Playwright E2E 测试（运势页、紫微斗数页） - Playwright 配置文件 - Jenkinsfile 流水线定义 - 构建/部署脚本
2026-04-29 21:16:34 +08:00
parent 0c9a4ac96b
commit 0761ecffd3
5 changed files with 535 additions and 0 deletions
@@ -0,0 +1,95 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('运势分析功能E2E测试', () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto('/#/pages/fortune/index')
+    await page.waitForLoadState('networkidle')
+  })
+
+  test.describe('TC-FORTUNE-001: 运势页面结构', () => {
+    test('应该显示运势标签页', async ({ page }) => {
+      const tabs = page.locator('[data-test="fortune-tabs"]')
+      await expect(tabs).toBeVisible()
+    })
+
+    test('应该显示日运和月运标签', async ({ page }) => {
+      const dailyTab = page.locator('.tab:has-text("日运")')
+      const monthlyTab = page.locator('.tab:has-text("月运")')
+      await expect(dailyTab).toBeVisible()
+      await expect(monthlyTab).toBeVisible()
+    })
+
+    test('默认应该选中日运标签', async ({ page }) => {
+      const dailyTab = page.locator('.tab:has-text("日运")')
+      await expect(dailyTab).toHaveClass(/active/)
+    })
+  })
+
+  test.describe('TC-FORTUNE-002: 标签切换', () => {
+    test('应该能够切换到月运', async ({ page }) => {
+      const monthlyTab = page.locator('.tab:has-text("月运")')
+      await monthlyTab.click()
+      await expect(monthlyTab).toHaveClass(/active/)
+
+      const dailyTab = page.locator('.tab:has-text("日运")')
+      await expect(dailyTab).not.toHaveClass(/active/)
+    })
+
+    test('应该能够切换回日运', async ({ page }) => {
+      const monthlyTab = page.locator('.tab:has-text("月运")')
+      await monthlyTab.click()
+      await expect(monthlyTab).toHaveClass(/active/)
+
+      const dailyTab = page.locator('.tab:has-text("日运")')
+      await dailyTab.click()
+      await expect(dailyTab).toHaveClass(/active/)
+    })
+  })
+
+  test.describe('TC-FORTUNE-003: 无排盘数据提示', () => {
+    test('未排盘时应该显示提示信息', async ({ page }) => {
+      const hint = page.locator('.no-chart-hint')
+      const isVisible = await hint.isVisible().catch(() => false)
+      if (isVisible) {
+        await expect(hint).toBeVisible()
+        const hintText = page.locator('.hint-text')
+        await expect(hintText).toContainText('排盘')
+      }
+    })
+  })
+
+  test.describe('TC-FORTUNE-004: 日期选择', () => {
+    test('日运页面应该显示日期选择器', async ({ page }) => {
+      const datePicker = page.locator('.date-picker').first()
+      await expect(datePicker).toBeVisible()
+    })
+
+    test('月运页面应该显示月份选择器', async ({ page }) => {
+      const monthlyTab = page.locator('.tab:has-text("月运")')
+      await monthlyTab.click()
+
+      const monthPicker = page.locator('.date-picker').first()
+      await expect(monthPicker).toBeVisible()
+    })
+  })
+
+  test.describe('TC-FORTUNE-005: 响应式设计', () => {
+    test('移动端应该正常显示', async ({ page }) => {
+      await page.setViewportSize({ width: 375, height: 667 })
+      await page.reload()
+      await page.waitForLoadState('networkidle')
+
+      const tabs = page.locator('[data-test="fortune-tabs"]')
+      await expect(tabs).toBeVisible()
+    })
+
+    test('桌面端应该正常显示', async ({ page }) => {
+      await page.setViewportSize({ width: 1920, height: 1080 })
+      await page.reload()
+      await page.waitForLoadState('networkidle')
+
+      const tabs = page.locator('[data-test="fortune-tabs"]')
+      await expect(tabs).toBeVisible()
+    })
+  })
+})
@@ -0,0 +1,125 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('紫微排盘功能E2E测试', () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto('/#/pages/ziwei/index')
+    await page.waitForLoadState('networkidle')
+  })
+
+  test.describe('TC-ZIWEI-001: 排盘表单', () => {
+    test('应该显示出生信息表单', async ({ page }) => {
+      const birthForm = page.locator('[data-test="birth-form"]')
+      await expect(birthForm).toBeVisible()
+    })
+
+    test('应该显示排盘按钮', async ({ page }) => {
+      const generateBtn = page.locator('[data-test="generate-btn"]')
+      await expect(generateBtn).toBeVisible()
+    })
+
+    test('未选择日期时排盘按钮应可点击但不执行', async ({ page }) => {
+      const generateBtn = page.locator('[data-test="generate-btn"]')
+      await expect(generateBtn).toBeVisible()
+      await generateBtn.click()
+      const chartResult = page.locator('.chart-result')
+      await expect(chartResult).not.toBeVisible()
+    })
+  })
+
+  test.describe('TC-ZIWEI-002: 排盘流程', () => {
+    test('应该能够选择出生日期并排盘', async ({ page }) => {
+      const picker = page.locator('picker').first()
+      await picker.click()
+      await page.waitForTimeout(500)
+
+      const dateInput = page.locator('input[type="date"], .picker-value').first()
+      if (await dateInput.isVisible()) {
+        await dateInput.fill('1990-01-15')
+      }
+
+      const generateBtn = page.locator('[data-test="generate-btn"]')
+      await generateBtn.click()
+      await page.waitForTimeout(2000)
+
+      const chartResult = page.locator('.chart-result')
+      const isVisible = await chartResult.isVisible().catch(() => false)
+      if (isVisible) {
+        await expect(chartResult).toBeVisible()
+      }
+    })
+
+    test('排盘后应该显示宫位卡片', async ({ page }) => {
+      const picker = page.locator('picker').first()
+      await picker.click()
+      await page.waitForTimeout(500)
+
+      const dateInput = page.locator('input[type="date"], .picker-value').first()
+      if (await dateInput.isVisible()) {
+        await dateInput.fill('1990-06-20')
+      }
+
+      const generateBtn = page.locator('[data-test="generate-btn"]')
+      await generateBtn.click()
+      await page.waitForTimeout(2000)
+
+      const palaceCards = page.locator('.palace-card')
+      const count = await palaceCards.count()
+      if (count > 0) {
+        expect(count).toBeGreaterThan(0)
+      }
+    })
+
+    test('排盘后应该显示三方四正分析', async ({ page }) => {
+      const picker = page.locator('picker').first()
+      await picker.click()
+      await page.waitForTimeout(500)
+
+      const dateInput = page.locator('input[type="date"], .picker-value').first()
+      if (await dateInput.isVisible()) {
+        await dateInput.fill('1985-03-10')
+      }
+
+      const generateBtn = page.locator('[data-test="generate-btn"]')
+      await generateBtn.click()
+      await page.waitForTimeout(2000)
+
+      const analysisSection = page.locator('.analysis-section')
+      const isVisible = await analysisSection.isVisible().catch(() => false)
+      if (isVisible) {
+        await expect(analysisSection).toBeVisible()
+      }
+    })
+  })
+
+  test.describe('TC-ZIWEI-003: 性别切换', () => {
+    test('应该能够切换性别', async ({ page }) => {
+      const femaleOption = page.locator('.gender-option:has-text("女")')
+      await femaleOption.click()
+      await expect(femaleOption).toHaveClass(/active/)
+
+      const maleOption = page.locator('.gender-option:has-text("男")')
+      await maleOption.click()
+      await expect(maleOption).toHaveClass(/active/)
+    })
+  })
+
+  test.describe('TC-ZIWEI-004: 响应式设计', () => {
+    test('移动端应该正常显示', async ({ page }) => {
+      await page.setViewportSize({ width: 375, height: 667 })
+      await page.reload()
+      await page.waitForLoadState('networkidle')
+
+      const birthForm = page.locator('[data-test="birth-form"]')
+      await expect(birthForm).toBeVisible()
+    })
+
+    test('桌面端应该正常显示', async ({ page }) => {
+      await page.setViewportSize({ width: 1920, height: 1080 })
+      await page.reload()
+      await page.waitForLoadState('networkidle')
+
+      const birthForm = page.locator('[data-test="birth-form"]')
+      await expect(birthForm).toBeVisible()
+    })
+  })
+})