diff --git a/e2e/journeys/mobile/mobile-user-journey.spec.ts b/e2e/journeys/mobile/mobile-user-journey.spec.ts new file mode 100644 index 0000000..ba637a0 --- /dev/null +++ b/e2e/journeys/mobile/mobile-user-journey.spec.ts @@ -0,0 +1,60 @@ +import { test, expect, devices } from '@playwright/test'; +import { FrontendHomePage, FrontendContactPage } from '../../pages/frontend'; +import { TestDataFactory } from '../../fixtures/test-data-factory'; + +test.use({ ...devices['Pixel 5'] }); + +test.describe('移动端用户旅程 @journey @mobile', () => { + let homePage: FrontendHomePage; + let contactPage: FrontendContactPage; + + test.beforeEach(async ({ page }) => { + homePage = new FrontendHomePage(page); + contactPage = new FrontendContactPage(page); + }); + + test('移动端用户通过汉堡菜单导航', async ({ page }) => { + await test.step('步骤1: 在移动端视口打开首页', async () => { + await homePage.goto(); + await homePage.expectMobileMenuButtonVisible(); + }); + + await test.step('步骤2: 点击汉堡菜单', async () => { + await homePage.clickMobileMenuButton(); + await homePage.expectMobileMenuOpen(); + }); + + await test.step('步骤3: 导航到产品页面', async () => { + await homePage.clickMobileMenuItem('产品服务'); + await page.waitForURL(/\/products/); + await expect(page.locator('h1')).toBeVisible(); + }); + + await test.step('步骤4: 再次打开菜单,导航到联系页面', async () => { + await homePage.clickMobileMenuButton(); + await homePage.clickMobileMenuItem('联系我们'); + await page.waitForURL(/\/contact/); + }); + }); + + test('移动端用户提交联系表单', async () => { + const contactData = TestDataFactory.createContactForm({ + name: '移动端测试用户', + email: 'mobile@example.com', + }); + + await test.step('步骤1: 移动端访问联系页面', async () => { + await contactPage.goto(); + await contactPage.expectContactFormVisible(); + }); + + await test.step('步骤2: 填写表单(触摸优化)', async () => { + await contactPage.fillForm(contactData); + }); + + await test.step('步骤3: 提交并验证', async () => { + await contactPage.submitForm(); + await contactPage.expectSubmitSuccess(); + }); + }); +});