lanyuanxiaoyao
5dd26d29a7
- 修复 5 个单元测试失败：ProviderForm 表单提交超时、ModelForm 初始值检查、 StatsTable Select 交互、ProviderTable 删除确认超时 - 适配 Ant Design 6 的 DOM 结构变化和异步行为 - 补充 E2E 测试从 6 个扩展到 32 个，覆盖供应商 CRUD、模型管理、 表单验证、错误处理、边界情况、用量统计筛选等完整用户流程 - 发现并处理 Ant Design 6 按钮文本渲染带空格的兼容性问题
93 lines
2.9 KiB
TypeScript
93 lines
2.9 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
|
|
test.describe('用量统计', () => {
|
|
test.beforeEach(async ({ page }) => {
|
|
await page.goto('/stats');
|
|
// 等待页面加载完成
|
|
await expect(page.getByRole('heading', { name: '用量统计' })).toBeVisible();
|
|
});
|
|
|
|
test('应显示用量统计页面', async ({ page }) => {
|
|
await expect(page.getByRole('heading', { name: '用量统计' })).toBeVisible();
|
|
});
|
|
|
|
test('应显示筛选控件', async ({ page }) => {
|
|
// 验证供应商筛选下拉框
|
|
await expect(page.getByText('所有供应商')).toBeVisible();
|
|
|
|
// 验证模型名称输入框
|
|
await expect(page.getByPlaceholder('模型名称')).toBeVisible();
|
|
|
|
// 验证日期范围选择器
|
|
await expect(page.locator('.ant-picker-range')).toBeVisible();
|
|
});
|
|
|
|
test('应通过导航返回供应商页面', async ({ page }) => {
|
|
await page.getByText('供应商管理').click();
|
|
await expect(page.getByRole('heading', { name: '供应商管理' })).toBeVisible();
|
|
});
|
|
|
|
test('应显示统计表格列标题', async ({ page }) => {
|
|
// 验证表格存在
|
|
await expect(page.locator('.ant-table')).toBeVisible();
|
|
|
|
// 通过 thead th 验证列标题存在
|
|
const headers = page.locator('.ant-table-thead th');
|
|
await expect(headers).toHaveCount(4);
|
|
|
|
// 逐个验证列标题文本
|
|
await expect(headers.nth(0)).toContainText('供应商');
|
|
await expect(headers.nth(1)).toContainText('模型');
|
|
await expect(headers.nth(2)).toContainText('日期');
|
|
await expect(headers.nth(3)).toContainText('请求数');
|
|
});
|
|
|
|
test('应能输入模型名称筛选', async ({ page }) => {
|
|
const modelInput = page.getByPlaceholder('模型名称');
|
|
|
|
// 输入模型名称
|
|
await modelInput.fill('gpt-4');
|
|
|
|
// 验证输入值
|
|
await expect(modelInput).toHaveValue('gpt-4');
|
|
|
|
// 清空输入
|
|
await modelInput.clear();
|
|
await expect(modelInput).toHaveValue('');
|
|
});
|
|
|
|
test('应能打开供应商筛选下拉框', async ({ page }) => {
|
|
// 点击供应商下拉框
|
|
await page.locator('.ant-select').click();
|
|
|
|
// 验证下拉选项出现
|
|
await page.waitForSelector('.ant-select-dropdown', { timeout: 3000 });
|
|
|
|
// 点击外部关闭下拉框
|
|
await page.keyboard.press('Escape');
|
|
});
|
|
|
|
test('应能打开日期范围选择器', async ({ page }) => {
|
|
// 点击日期选择器
|
|
await page.locator('.ant-picker-range').click();
|
|
|
|
// 验证日期面板出现
|
|
await page.waitForSelector('.ant-picker-dropdown', { timeout: 3000 });
|
|
|
|
// 点击外部关闭
|
|
await page.keyboard.press('Escape');
|
|
});
|
|
|
|
test('应显示空数据提示', async ({ page }) => {
|
|
// 等待表格加载
|
|
await page.waitForSelector('.ant-table', { timeout: 5000 });
|
|
|
|
// 检查是否有数据
|
|
const emptyText = page.locator('.ant-table-tbody .ant-empty-description');
|
|
|
|
if (await emptyText.count() > 0) {
|
|
await expect(emptyText).toBeVisible();
|
|
}
|
|
});
|
|
});
|