fix(e2e): 修复对话框关闭问题,完善 E2E 测试
- 修复 TDesign Dialog onConfirm 不自动关闭的问题 - 使用 useEffect 监听 mutation 状态自动关闭对话框 - 测试使用 waitForResponse 等待 API 响应 - 添加 clearDatabase 函数确保测试隔离 - 归档 e2e-real-backend 变更到 archive/2026-04-22 - 同步 e2e-testing spec 到主 specs
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
import { clearDatabase } from './fixtures'
|
||||
|
||||
let uid = Date.now()
|
||||
|
||||
@@ -13,13 +14,15 @@ function formInputs(page: import('@playwright/test').Page) {
|
||||
name: dialog.locator('input[placeholder="例如: OpenAI"]'),
|
||||
apiKey: dialog.locator('input[type="password"]'),
|
||||
baseUrl: dialog.locator('input[placeholder="例如: https://api.openai.com/v1"]'),
|
||||
protocol: dialog.locator('.t-select'),
|
||||
saveBtn: dialog.locator('.t-dialog__footer').getByRole('button', { name: '保存' }),
|
||||
cancelBtn: dialog.locator('.t-dialog__footer').getByRole('button', { name: '取消' }),
|
||||
}
|
||||
}
|
||||
|
||||
test.describe('供应商管理', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
test.beforeEach(async ({ page, request }) => {
|
||||
await clearDatabase(request)
|
||||
await page.goto('/providers')
|
||||
await expect(page.getByRole('heading', { name: '供应商管理' })).toBeVisible()
|
||||
})
|
||||
@@ -34,12 +37,14 @@ test.describe('供应商管理', () => {
|
||||
await inputs.name.fill('Test Provider')
|
||||
await inputs.apiKey.fill('sk_test_key_12345')
|
||||
await inputs.baseUrl.fill('https://api.openai.com/v1')
|
||||
await inputs.protocol.click()
|
||||
await page.waitForSelector('.t-select__dropdown', { timeout: 3000 })
|
||||
await page.locator('.t-select__dropdown .t-select-option').first().click()
|
||||
await page.waitForSelector('.t-select__dropdown', { state: 'hidden', timeout: 3000 })
|
||||
|
||||
await inputs.saveBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 5000 })
|
||||
|
||||
await expect(page.locator('.t-table__body td').getByText(testId)).toBeVisible()
|
||||
await expect(page.locator('.t-table__body td').getByText('Test Provider')).toBeVisible()
|
||||
|
||||
await expect(page.locator('.t-table__body').getByText('Test Provider')).toBeVisible({ timeout: 10000 })
|
||||
})
|
||||
|
||||
test('应能编辑供应商并验证更新生效', async ({ page }) => {
|
||||
@@ -51,8 +56,18 @@ test.describe('供应商管理', () => {
|
||||
await inputs.name.fill('Before Edit')
|
||||
await inputs.apiKey.fill('sk_key')
|
||||
await inputs.baseUrl.fill('https://api.example.com/v1')
|
||||
await inputs.protocol.click()
|
||||
await page.waitForSelector('.t-select__dropdown', { timeout: 3000 })
|
||||
await page.locator('.t-select__dropdown .t-select-option').first().click()
|
||||
await page.waitForSelector('.t-select__dropdown', { state: 'hidden', timeout: 3000 })
|
||||
|
||||
const responsePromise = page.waitForResponse(resp => resp.url().includes('/api/providers') && resp.request().method() === 'POST')
|
||||
await inputs.saveBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 5000 })
|
||||
await responsePromise
|
||||
await expect(page.locator('.t-table__body').getByText('Before Edit')).toBeVisible({ timeout: 5000 })
|
||||
|
||||
await inputs.cancelBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 3000 })
|
||||
|
||||
await page.locator('.t-table__body button:has-text("编辑")').first().click()
|
||||
await expect(page.locator('.t-dialog:visible')).toBeVisible()
|
||||
@@ -60,10 +75,11 @@ test.describe('供应商管理', () => {
|
||||
const editInputs = formInputs(page)
|
||||
await editInputs.name.clear()
|
||||
await editInputs.name.fill('After Edit')
|
||||
|
||||
const updateResponsePromise = page.waitForResponse(resp => resp.url().includes('/api/providers') && resp.request().method() === 'PUT')
|
||||
await editInputs.saveBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 5000 })
|
||||
|
||||
await expect(page.locator('.t-table__body td').getByText('After Edit')).toBeVisible()
|
||||
await updateResponsePromise
|
||||
await expect(page.locator('.t-table__body').getByText('After Edit')).toBeVisible({ timeout: 5000 })
|
||||
})
|
||||
|
||||
test('应能删除供应商并验证消失', async ({ page }) => {
|
||||
@@ -75,15 +91,20 @@ test.describe('供应商管理', () => {
|
||||
await inputs.name.fill('To Delete')
|
||||
await inputs.apiKey.fill('sk_key')
|
||||
await inputs.baseUrl.fill('https://api.example.com/v1')
|
||||
await inputs.protocol.click()
|
||||
await page.waitForSelector('.t-select__dropdown', { timeout: 3000 })
|
||||
await page.locator('.t-select__dropdown .t-select-option').first().click()
|
||||
await page.waitForSelector('.t-select__dropdown', { state: 'hidden', timeout: 3000 })
|
||||
await inputs.saveBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 5000 })
|
||||
await expect(page.locator('.t-table__body').getByText('To Delete')).toBeVisible({ timeout: 10000 })
|
||||
|
||||
await inputs.cancelBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 3000 })
|
||||
|
||||
await page.locator('.t-table__body button:has-text("删除")').first().click()
|
||||
await expect(page.getByText('确定要删除这个供应商吗?')).toBeVisible()
|
||||
await page.locator('.t-popconfirm').getByRole('button', { name: '确定' }).click()
|
||||
await expect(page.getByText('确定要删除这个供应商吗?')).not.toBeVisible({ timeout: 3000 })
|
||||
|
||||
await expect(page.locator('.t-table__body td').getByText(testId)).not.toBeVisible({ timeout: 5000 })
|
||||
await expect(page.locator('.t-table__body').getByText('To Delete')).not.toBeVisible({ timeout: 5000 })
|
||||
})
|
||||
|
||||
test('应正确脱敏显示 API Key', async ({ page }) => {
|
||||
@@ -95,9 +116,13 @@ test.describe('供应商管理', () => {
|
||||
await inputs.name.fill('Mask Test')
|
||||
await inputs.apiKey.fill('sk_abcdefghijklmnopqrstuvwxyz')
|
||||
await inputs.baseUrl.fill('https://api.example.com/v1')
|
||||
await inputs.protocol.click()
|
||||
await page.waitForSelector('.t-select__dropdown', { timeout: 3000 })
|
||||
await page.locator('.t-select__dropdown .t-select-option').first().click()
|
||||
await page.waitForSelector('.t-select__dropdown', { state: 'hidden', timeout: 3000 })
|
||||
await inputs.saveBtn.click()
|
||||
await expect(page.locator('.t-dialog:visible')).not.toBeVisible({ timeout: 5000 })
|
||||
await expect(page.locator('.t-table__body').getByText('Mask Test')).toBeVisible({ timeout: 10000 })
|
||||
|
||||
await expect(page.locator('.t-table__body')).toContainText('***stuv')
|
||||
await expect(page.locator('.t-table__body')).toContainText('****wxyz')
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user