tg-live-game-web/tests/e2e/auth.spec.ts

import { test, expect } from '@playwright/test'

// 测试账号配置
const TEST_USERNAME = process.env.TEST_USERNAME || 'admin'
const TEST_PASSWORD = process.env.TEST_PASSWORD || '123456'

test.describe('登录登出测试', () => {
  test.beforeEach(async ({ page }) => {
    // 清除登录状态
    await page.goto('/login')
    await page.evaluate(() => {
      localStorage.clear()
      document.cookie.split(';').forEach((c) => {
        document.cookie = c.replace(/^ +/, '').replace(/=.*/, '=;expires=' + new Date().toUTCString() + ';path=/')
      })
    })
    await page.reload()
  })

  test('登录页面正确显示', async ({ page }) => {
    await expect(page.getByPlaceholder('请输入用户名')).toBeVisible()
    await expect(page.getByPlaceholder('请输入密码')).toBeVisible()
    await expect(page.getByRole('button', { name: '登 录' })).toBeVisible()
    await expect(page.getByText('记住我')).toBeVisible()
  })

  test('空表单提交显示验证错误', async ({ page }) => {
    await page.getByRole('button', { name: '登 录' }).click()
    await expect(page.getByText('请输入用户名')).toBeVisible()
    await expect(page.getByText('请输入密码')).toBeVisible()
  })

  test('登录成功并显示用户名 admin', async ({ page }) => {
    // 输入登录信息
    await page.getByPlaceholder('请输入用户名').fill(TEST_USERNAME)
    await page.getByPlaceholder('请输入密码').fill(TEST_PASSWORD)

    // 等待登录按钮可用并点击
    const loginBtn = page.getByRole('button', { name: '登 录' })
    await expect(loginBtn).toBeEnabled()
    await loginBtn.click()

    // 等待登录 API 响应并跳转
    await page.waitForURL(/^(?!.*\/login).*$/, { timeout: 15000 })

    // 验证用户名显示为 admin
    await expect(page.locator('.username')).toBeVisible({ timeout: 10000 })
    await expect(page.locator('.username')).toContainText('admin')
  })

  test('登录后可以正常登出', async ({ page }) => {
    // 先登录
    await page.getByPlaceholder('请输入用户名').fill(TEST_USERNAME)
    await page.getByPlaceholder('请输入密码').fill(TEST_PASSWORD)
    const loginBtn = page.getByRole('button', { name: '登 录' })
    await expect(loginBtn).toBeEnabled()
    await loginBtn.click()
    await page.waitForURL(/^(?!.*\/login).*$/, { timeout: 15000 })

    // 点击用户下拉菜单
    await page.locator('.user-info').click()
    await page.waitForTimeout(500)

    // 点击退出登录
    await page.getByText('退出登录').click()

    // 验证跳转到登录页
    await expect(page).toHaveURL(/\/login/, { timeout: 10000 })
  })

  test('修改密码弹窗可以打开', async ({ page }) => {
    // 先登录
    await page.getByPlaceholder('请输入用户名').fill(TEST_USERNAME)
    await page.getByPlaceholder('请输入密码').fill(TEST_PASSWORD)
    const loginBtn = page.getByRole('button', { name: '登 录' })
    await expect(loginBtn).toBeEnabled()
    await loginBtn.click()
    await page.waitForURL(/^(?!.*\/login).*$/, { timeout: 15000 })

    // 点击用户下拉菜单
    await page.locator('.user-info').click()
    await page.waitForTimeout(500)

    // 点击修改密码
    await page.getByText('修改密码').click()

    // 验证弹窗显示
    await expect(page.getByRole('dialog')).toBeVisible()
    await expect(page.locator('.el-dialog').getByText('修改密码')).toBeVisible()
  })
})