fix: update form tests to properly handle toast component and async UI updates

test-framework/dev-audit/forms/forms.spec.ts

@@ -1,11 +1,28 @@
 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 contactPage.navigate();
     await contactPage.fillContactForm({
       name: formData.valid.name,
@@ -16,9 +33,12 @@ test.describe('表单验证测试', () => {
     });
     await contactPage.submitForm();
 
-    await page.waitForTimeout(3000);
-    const successMessage = await contactPage.getFormSuccessMessage();
-    expect(successMessage).toContain('消息已发送');
+    await contactPage.waitForToast();
+    const toastMessage = await contactPage.getToastMessage();
+    expect(toastMessage.message).toContain('成功');
+    expect(toastMessage.type).toBe('success');
+
+    await contactPage.waitForToastHidden();
   });
 
   test('联系表单 - 必填字段验证', async ({ page }) => {
@@ -34,7 +54,7 @@ test.describe('表单验证测试', () => {
     });
     await contactPage.submitForm();
 
-    await page.waitForTimeout(1000);
+    await page.waitForTimeout(500);
     const errorMessage = await contactPage.getFormErrorMessage();
     expect(errorMessage).toBeTruthy();
   });
@@ -52,8 +72,37 @@ test.describe('表单验证测试', () => {
     });
     await contactPage.submitForm();
 
-    await page.waitForTimeout(1000);
+    await page.waitForTimeout(500);
     const errorMessage = await contactPage.getFormErrorMessage();
     expect(errorMessage).toContain('邮箱');
   });
+
+  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 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 contactPage.waitForToast();
+    const toastMessage = await contactPage.getToastMessage();
+    expect(toastMessage.message).toContain('失败');
+    expect(toastMessage.type).toBe('error');
+
+    await contactPage.waitForToastHidden();
+  });
 });