s2f/frontend/e2e/pages.spec.ts

import { test, expect } from "@playwright/test";

/**
 * 导出中心、知识库、系统设置页面 E2E 测试
 *
 * 测试页面渲染和基本交互
 * 通过注入 localStorage 模拟登录状态
 */

const MOCK_USER = {
  id: 1,
  email: "admin@xingchen.com",
  full_name: "管理员",
  role: "管理员",
  permissions: [],
  company_id: 1,
};

const MOCK_AUTH_STATE = {
  state: {
    user: MOCK_USER,
    token: "mock-jwt-token",
    isAuthenticated: true,
  },
  version: 0,
};

test.beforeEach(async ({ page }) => {
  // 在页面加载前注入 localStorage 模拟登录状态
  await page.addInitScript((authData) => {
    localStorage.setItem("auth-storage", JSON.stringify(authData));
    localStorage.setItem("auth_token", authData.state.token);
    localStorage.setItem("company_id", String(authData.state.user.company_id));
  }, MOCK_AUTH_STATE);
});

test.describe("导出中心", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/exports");

    // 验证标题存在
    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });

  test("快捷导出按钮存在", async ({ page }) => {
    await page.goto("/exports");

    // 验证导出相关内容存在
    await expect(page.locator("text=/导出|成本|凭证/").first()).toBeVisible({ timeout: 15000 });
  });
});

test.describe("企业知识库", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/knowledge");

    // 验证页面加载
    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });

  test("搜索功能存在", async ({ page }) => {
    await page.goto("/knowledge");

    // 验证搜索输入框存在
    await expect(page.locator('input').first()).toBeVisible({ timeout: 15000 });
  });

  test("分类筛选存在", async ({ page }) => {
    await page.goto("/knowledge");

    // 验证分类按钮存在
    await expect(page.locator("text=/全部|分类/").first()).toBeVisible({ timeout: 15000 });
  });
});

test.describe("系统设置", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/settings");

    // 验证页面加载
    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });

  test("设置选项卡存在", async ({ page }) => {
    await page.goto("/settings");

    // 验证选项卡存在
    await expect(page.locator("text=/个人资料|资料/").first()).toBeVisible({ timeout: 15000 });
  });

  test.skip("切换选项卡", async ({ page }) => {
    // TODO: AuthGuard 在 zustand persist hydrate 完成前就重定向到 /login
    // 需要修改 AuthGuard 添加 hydrate 等待逻辑后启用此测试
    await page.goto("/settings");
    await page.waitForTimeout(3000);

    await page.evaluate(() => {
      const buttons = document.querySelectorAll('button');
      for (const btn of buttons) {
        if (btn.textContent?.includes('企业信息') && btn.textContent?.length < 20) {
          btn.click();
          break;
        }
      }
    });

    await page.waitForTimeout(1000);
    const hasFieldName = await page.locator("text=企业名称").count();
    expect(hasFieldName).toBeGreaterThan(0);
  });
});

test.describe("凭证管理", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/vouchers");

    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });
});

test.describe("成本分析", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/analysis");

    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });
});

test.describe("任务列表", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/tasks");

    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });
});

test.describe("异常处理", () => {
  test("页面正确渲染", async ({ page }) => {
    await page.goto("/exceptions");

    await expect(page.locator("h1, h2").first()).toBeVisible({ timeout: 15000 });
  });
});