e2ad1331cc
feat(测试): 新增Playwright和Vitest测试配置 feat(测试): 添加测试覆盖率报告生成功能 feat(测试): 实现前后端测试脚本集成 fix(测试): 修复测试密码不匹配问题 fix(测试): 修正URL等待策略 fix(测试): 调整错误消息选择器 refactor(测试): 重构测试目录结构 refactor(测试): 优化测试用例组织方式 docs: 更新测试报告文档 docs: 添加测试覆盖率报告模板 ci: 添加Docker测试环境配置 ci: 实现测试自动化脚本 chore: 更新依赖版本 chore: 添加测试相关配置文件
244 lines
8.4 KiB
TypeScript
244 lines
8.4 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
import { LoginPage } from './pages/LoginPage';
|
|
import { DashboardPage } from './pages/DashboardPage';
|
|
import { UserManagementPage } from './pages/UserManagementPage';
|
|
import { TestDataManager } from './utils/testDataManager';
|
|
import { TestHelper } from './utils/testHelper';
|
|
|
|
test.describe('用户管理 E2E 测试(改进版)', () => {
|
|
let loginPage: LoginPage;
|
|
let dashboardPage: DashboardPage;
|
|
let userManagementPage: UserManagementPage;
|
|
let testUser: any;
|
|
|
|
test.beforeAll(async ({ request }) => {
|
|
TestDataManager.initialize();
|
|
});
|
|
|
|
test.beforeEach(async ({ page }) => {
|
|
loginPage = new LoginPage(page);
|
|
dashboardPage = new DashboardPage(page);
|
|
userManagementPage = new UserManagementPage(page);
|
|
|
|
await loginPage.goto();
|
|
await loginPage.login('admin', 'admin123');
|
|
});
|
|
|
|
test.afterEach(async ({ page, request }) => {
|
|
await TestHelper.clearAllStorage(page);
|
|
|
|
if (testUser) {
|
|
await TestDataManager.deleteTestUser(request, testUser.username);
|
|
testUser = null;
|
|
}
|
|
});
|
|
|
|
test('创建用户完整流程', async ({ page, request }) => {
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('点击创建用户按钮', async () => {
|
|
await userManagementPage.clickCreateUser();
|
|
await TestHelper.waitForElementVisible(page, '.el-dialog');
|
|
});
|
|
|
|
await test.step('生成测试用户数据', async () => {
|
|
testUser = TestDataManager.generateTestUser();
|
|
console.log('Generated test user:', testUser);
|
|
});
|
|
|
|
await test.step('填写用户表单', async () => {
|
|
await userManagementPage.fillUserForm(testUser);
|
|
});
|
|
|
|
await test.step('提交表单', async () => {
|
|
await userManagementPage.submitForm();
|
|
await TestHelper.waitForSuccessMessage(page);
|
|
});
|
|
|
|
await test.step('验证用户创建成功', async () => {
|
|
await TestHelper.waitForTextContent(page, '.el-table', testUser.username);
|
|
const userCount = await userManagementPage.getUserCount();
|
|
expect(userCount).toBeGreaterThan(0);
|
|
});
|
|
|
|
await test.step('通过API验证用户存在', async () => {
|
|
const response = await request.get(`http://localhost:8084/api/users?username=${testUser.username}`);
|
|
expect(response.ok()).toBeTruthy();
|
|
const result = await response.json();
|
|
expect(result.data).toBeDefined();
|
|
});
|
|
});
|
|
|
|
test('编辑用户流程', async ({ page, request }) => {
|
|
await test.step('创建测试用户', async () => {
|
|
testUser = TestDataManager.generateTestUser();
|
|
await TestDataManager.createTestUser(request, testUser);
|
|
});
|
|
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('搜索并编辑用户', async () => {
|
|
await userManagementPage.search(testUser.username);
|
|
await TestHelper.waitForTextContent(page, '.el-table', testUser.username);
|
|
|
|
await userManagementPage.editUser(1);
|
|
await TestHelper.waitForElementVisible(page, '.el-dialog');
|
|
});
|
|
|
|
await test.step('修改用户邮箱', async () => {
|
|
const newEmail = `updated_${testUser.email}`;
|
|
await page.fill('input[name="email"]', newEmail);
|
|
await userManagementPage.submitForm();
|
|
await TestHelper.waitForSuccessMessage(page);
|
|
});
|
|
|
|
await test.step('验证修改成功', async () => {
|
|
await TestHelper.waitForTextContent(page, '.el-table', 'updated_');
|
|
});
|
|
});
|
|
|
|
test('删除用户流程', async ({ page, request }) => {
|
|
await test.step('创建测试用户', async () => {
|
|
testUser = TestDataManager.generateTestUser();
|
|
await TestDataManager.createTestUser(request, testUser);
|
|
});
|
|
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('搜索并删除用户', async () => {
|
|
await userManagementPage.search(testUser.username);
|
|
await TestHelper.waitForTextContent(page, '.el-table', testUser.username);
|
|
|
|
await userManagementPage.deleteUser(1);
|
|
await TestHelper.waitForElementVisible(page, '.el-message-box');
|
|
});
|
|
|
|
await test.step('确认删除', async () => {
|
|
await userManagementPage.confirmDelete();
|
|
await TestHelper.waitForSuccessMessage(page);
|
|
});
|
|
|
|
await test.step('验证用户已删除', async () => {
|
|
await page.reload();
|
|
await TestHelper.waitForPageLoad(page);
|
|
await userManagementPage.search(testUser.username);
|
|
|
|
const userCount = await userManagementPage.getUserCount();
|
|
expect(userCount).toBe(0);
|
|
});
|
|
});
|
|
|
|
test('搜索用户功能', async ({ page }) => {
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('搜索admin用户', async () => {
|
|
await userManagementPage.search('admin');
|
|
await TestHelper.waitForTextContent(page, '.el-table', 'admin');
|
|
});
|
|
|
|
await test.step('验证搜索结果', async () => {
|
|
const userCount = await userManagementPage.getUserCount();
|
|
expect(userCount).toBeGreaterThan(0);
|
|
});
|
|
});
|
|
|
|
test('分页功能', async ({ page }) => {
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('获取当前页码', async () => {
|
|
const currentPage = await userManagementPage.getCurrentPage();
|
|
expect(currentPage).toBe('1');
|
|
});
|
|
|
|
await test.step('点击下一页', async () => {
|
|
await userManagementPage.nextPage();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('验证页码变化', async () => {
|
|
const newPage = await userManagementPage.getCurrentPage();
|
|
expect(newPage).toBe('2');
|
|
});
|
|
});
|
|
|
|
test('批量删除用户', async ({ page, request }) => {
|
|
await test.step('创建多个测试用户', async () => {
|
|
const users = [];
|
|
for (let i = 0; i < 3; i++) {
|
|
const user = TestDataManager.generateTestUser();
|
|
await TestDataManager.createTestUser(request, user);
|
|
users.push(user);
|
|
}
|
|
});
|
|
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('选择多个用户', async () => {
|
|
await page.check('table tbody tr:nth-child(1) input[type="checkbox"]');
|
|
await page.check('table tbody tr:nth-child(2) input[type="checkbox"]');
|
|
});
|
|
|
|
await test.step('点击批量删除', async () => {
|
|
await page.click('button:has-text("批量删除")');
|
|
await TestHelper.waitForElementVisible(page, '.el-message-box');
|
|
});
|
|
|
|
await test.step('确认删除', async () => {
|
|
await page.click('.el-message-box__btns .el-button--primary');
|
|
await TestHelper.waitForSuccessMessage(page);
|
|
});
|
|
});
|
|
|
|
test('用户状态切换', async ({ page }) => {
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('切换用户状态', async () => {
|
|
await page.click('table tbody tr:first-child .status-toggle');
|
|
await TestHelper.waitForSuccessMessage(page);
|
|
});
|
|
|
|
await test.step('验证状态变化', async () => {
|
|
await page.reload();
|
|
await TestHelper.waitForPageLoad(page);
|
|
const statusElement = page.locator('table tbody tr:first-child .status-badge');
|
|
await TestHelper.waitForElementVisible(page, '.status-badge');
|
|
});
|
|
});
|
|
|
|
test('导出用户数据', async ({ page }) => {
|
|
await test.step('导航到用户管理页面', async () => {
|
|
await dashboardPage.navigateToUserManagement();
|
|
await TestHelper.waitForPageLoad(page);
|
|
});
|
|
|
|
await test.step('点击导出按钮', async () => {
|
|
const downloadPromise = page.waitForEvent('download');
|
|
await page.click('button:has-text("导出")');
|
|
const download = await downloadPromise;
|
|
|
|
expect(download.suggestedFilename()).toMatch(/users.*\.xlsx/);
|
|
});
|
|
});
|
|
});
|