import { test, expect } from '@playwright/test';
import { 
  FrontendHomePage, 
  FrontendNewsPage, 
  FrontendProductPage, 
  FrontendContactPage 
} from '../pages/frontend';
import { TestDataFactory } from '../fixtures/test-data-factory';

test.describe('访客浏览旅程 @journey @visitor', () => {
  let homePage: FrontendHomePage;
  let newsPage: FrontendNewsPage;
  let productPage: FrontendProductPage;
  let contactPage: FrontendContactPage;

  test.beforeEach(async ({ page }) => {
    homePage = new FrontendHomePage(page);
    newsPage = new FrontendNewsPage(page);
    productPage = new FrontendProductPage(page);
    contactPage = new FrontendContactPage(page);
  });

  test('访客浏览首页并了解公司信息', async () => {
    await test.step('步骤1: 访问首页', async () => {
      await homePage.goto();
      await expect(homePage.page).toHaveTitle(/四川睿新致远科技有限公司/);
    });

    await test.step('步骤2: 查看Hero区域', async () => {
      await homePage.expectHeroVisible();
    });

    await test.step('步骤3: 滚动查看服务介绍', async () => {
      await homePage.scrollToSection('services');
    });

    await test.step('步骤4: 查看产品展示', async () => {
      await homePage.scrollToSection('products');
    });

    await test.step('步骤5: 查看最新资讯', async () => {
      await homePage.scrollToSection('news');
    });
  });

  test('访客浏览新闻列表并查看详情', async () => {
    await test.step('步骤1: 访问新闻列表页', async () => {
      await newsPage.goto();
    });

    await test.step('步骤2: 查看新闻列表', async () => {
      await newsPage.expectNewsListVisible();
    });

    await test.step('步骤3: 点击第一条新闻', async () => {
      await newsPage.clickFirstNews();
      await newsPage.expectNewsDetailVisible();
    });
  });

  test('访客浏览产品并了解详情', async () => {
    await test.step('步骤1: 访问产品列表页', async () => {
      await productPage.goto();
    });

    await test.step('步骤2: 查看产品列表', async () => {
      await productPage.expectProductListVisible();
    });

    await test.step('步骤3: 点击第一个产品', async () => {
      await productPage.clickFirstProduct();
      await productPage.expectProductDetailVisible();
    });
  });

  test('访客查看联系信息并提交表单', async () => {
    const contactData = TestDataFactory.createContactForm();

    await test.step('步骤1: 访问联系页面', async () => {
      await contactPage.goto();
    });

    await test.step('步骤2: 查看联系信息', async () => {
      await contactPage.expectContactInfoVisible();
    });

    await test.step('步骤3: 填写联系表单', async () => {
      await contactPage.fillForm(contactData);
    });
  });
});