张翔
128 lines
3.9 KiB
TypeScript
128 lines
3.9 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
import { ContactPage } from '../../shared/pages';
|
|
import { formData } from '../../shared/config/test-data';
|
|
import { TestDataFactory } from '../../shared/utils/testing/TestDataFactory';
|
|
import { TestDataCleaner } from '../../shared/utils/testing/TestDataCleaner';
|
|
|
|
test.describe('表单验证测试', () => {
|
|
test.beforeAll(async () => {
|
|
TestDataFactory.createContactForm();
|
|
});
|
|
|
|
test.afterAll(async () => {
|
|
await TestDataCleaner.cleanupAll();
|
|
});
|
|
test('联系表单 - 有效数据提交', async ({ page }) => {
|
|
const contactPage = new ContactPage(page);
|
|
|
|
await page.route('**/api/contact', async route => {
|
|
await route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ success: true, message: '消息已发送' })
|
|
});
|
|
});
|
|
|
|
await page.addInitScript(() => {
|
|
sessionStorage.setItem('csrf_token', 'test-csrf-token');
|
|
});
|
|
|
|
await contactPage.navigate();
|
|
await contactPage.fillContactForm({
|
|
name: formData.valid.name,
|
|
email: formData.valid.email,
|
|
phone: formData.valid.phone,
|
|
message: formData.valid.message,
|
|
subject: '测试主题'
|
|
});
|
|
await contactPage.submitForm();
|
|
|
|
await page.waitForTimeout(3000);
|
|
const formExists = await page.locator('form').count();
|
|
expect(formExists).toBeGreaterThan(0);
|
|
});
|
|
|
|
test('联系表单 - 必填字段验证', async ({ page }) => {
|
|
const contactPage = new ContactPage(page);
|
|
|
|
await page.addInitScript(() => {
|
|
sessionStorage.setItem('csrf_token', 'test-csrf-token');
|
|
});
|
|
|
|
await contactPage.navigate();
|
|
await contactPage.fillContactForm({
|
|
name: '',
|
|
email: '',
|
|
phone: '',
|
|
message: '',
|
|
subject: ''
|
|
});
|
|
await contactPage.submitForm();
|
|
|
|
await page.waitForTimeout(1000);
|
|
const nameInput = await page.locator('[data-testid="name-input"]');
|
|
const hasError = await nameInput.evaluate(el => {
|
|
return window.getComputedStyle(el).borderColor === 'rgb(196, 30, 58)' ||
|
|
el.getAttribute('aria-invalid') === 'true';
|
|
});
|
|
expect(hasError).toBe(true);
|
|
});
|
|
|
|
test('联系表单 - 邮箱格式验证', async ({ page }) => {
|
|
const contactPage = new ContactPage(page);
|
|
|
|
await page.addInitScript(() => {
|
|
sessionStorage.setItem('csrf_token', 'test-csrf-token');
|
|
});
|
|
|
|
await contactPage.navigate();
|
|
await contactPage.fillContactForm({
|
|
name: '测试用户',
|
|
email: formData.invalid.email,
|
|
phone: '13800138000',
|
|
message: '测试消息',
|
|
subject: '测试主题'
|
|
});
|
|
await contactPage.submitForm();
|
|
|
|
await page.waitForTimeout(1000);
|
|
const emailInput = await page.locator('[data-testid="email-input"]');
|
|
const hasError = await emailInput.evaluate(el => {
|
|
return window.getComputedStyle(el).borderColor === 'rgb(196, 30, 58)' ||
|
|
el.getAttribute('aria-invalid') === 'true';
|
|
});
|
|
expect(hasError).toBe(true);
|
|
});
|
|
|
|
test('联系表单 - API错误处理', async ({ page }) => {
|
|
const contactPage = new ContactPage(page);
|
|
|
|
await page.route('**/api/contact', async route => {
|
|
await route.fulfill({
|
|
status: 500,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ success: false, message: '服务器错误' })
|
|
});
|
|
});
|
|
|
|
await page.addInitScript(() => {
|
|
sessionStorage.setItem('csrf_token', 'test-csrf-token');
|
|
});
|
|
|
|
await contactPage.navigate();
|
|
await contactPage.fillContactForm({
|
|
name: formData.valid.name,
|
|
email: formData.valid.email,
|
|
phone: formData.valid.phone,
|
|
message: formData.valid.message,
|
|
subject: '测试主题'
|
|
});
|
|
await contactPage.submitForm();
|
|
|
|
await page.waitForTimeout(3000);
|
|
const submitButton = await page.locator('[data-testid="submit-button"]');
|
|
const isDisabled = await submitButton.isDisabled();
|
|
expect(isDisabled).toBe(false);
|
|
});
|
|
});
|