mini-starter/web/tests/e2e/pages/mini/enterprise-mini.page.ts

import { TIMEOUTS } from '../../utils/timeouts';
import { Page, Locator } from '@playwright/test';

/**
 * 企业小程序 H5 URL
 */
const MINI_BASE_URL = process.env.E2E_BASE_URL || 'http://localhost:8080';
const MINI_LOGIN_URL = `${MINI_BASE_URL}/mini`;

/**
 * 企业小程序 Page Object
 *
 * 用于企业小程序 E2E 测试
 * H5 页面路径: /mini
 *
 * 主要功能：
 * - 小程序登录（手机号 + 密码）
 * - Token 管理
 * - 页面导航和验证
 *
 * @example
 * ```typescript
 * const miniPage = new EnterpriseMiniPage(page);
 * await miniPage.goto();
 * await miniPage.login('13800138000', 'password123');
 * await miniPage.expectLoginSuccess();
 * ```
 */
export class EnterpriseMiniPage {
  readonly page: Page;

  // ===== 页面级选择器 =====
  /** 登录页面容器 */
  readonly loginPage: Locator;
  /** 页面标题 */
  readonly pageTitle: Locator;

  // ===== 登录表单选择器 =====
  /** 手机号输入框 */
  readonly phoneInput: Locator;
  /** 密码输入框 */
  readonly passwordInput: Locator;
  /** 登录按钮 */
  readonly loginButton: Locator;

  // ===== 主页选择器（登录后） =====
  /** 用户信息显示区域 */
  readonly userInfo: Locator;

  constructor(page: Page) {
    this.page = page;

    // 初始化登录页面选择器（使用 data-testid）
    this.loginPage = page.getByTestId('mini-login-page');
    this.pageTitle = page.getByTestId('mini-page-title');

    // 登录表单选择器
    this.phoneInput = page.getByTestId('mini-phone-input');
    this.passwordInput = page.getByTestId('mini-password-input');
    this.loginButton = page.getByTestId('mini-login-button');

    // 主页选择器（登录后可用）
    // 用户信息显示 - 根据实际小程序主页结构调整
    this.userInfo = page.getByTestId('mini-user-info');
  }

  // ===== 导航和基础验证 =====

  /**
   * 导航到企业小程序 H5 登录页面
   */
  async goto(): Promise<void> {
    await this.page.goto(MINI_LOGIN_URL);
    // 使用 auto-waiting 机制，等待页面容器可见
    await this.expectToBeVisible();
  }

  /**
   * 验证登录页面关键元素可见
   */
  async expectToBeVisible(): Promise<void> {
    // 等待页面容器可见
    await this.loginPage.waitFor({ state: 'visible', timeout: TIMEOUTS.PAGE_LOAD });
    // 验证页面标题
    await this.pageTitle.waitFor({ state: 'visible', timeout: TIMEOUTS.ELEMENT_VISIBLE_SHORT });
  }

  // ===== 登录功能方法 =====

  /**
   * 填写手机号
   * @param phone 手机号（11位数字）
   */
  async fillPhone(phone: string): Promise<void> {
    await this.phoneInput.fill(phone);
  }

  /**
   * 填写密码
   * @param password 密码（6-20位）
   */
  async fillPassword(password: string): Promise<void> {
    await this.passwordInput.fill(password);
  }

  /**
   * 点击登录按钮
   */
  async clickLoginButton(): Promise<void> {
    await this.loginButton.click();
  }

  /**
   * 执行登录操作（完整流程）
   * @param phone 手机号
   * @param password 密码
   */
  async login(phone: string, password: string): Promise<void> {
    await this.fillPhone(phone);
    await this.fillPassword(password);
    await this.clickLoginButton();
  }

  /**
   * 验证登录成功
   *
   * 登录成功后应该跳转到主页或显示用户信息
   */
  async expectLoginSuccess(): Promise<void> {
    // 使用 auto-waiting 机制，等待 URL 变化或用户信息显示
    // 小程序登录成功后会跳转到 dashboard 页面

    // 等待 URL 变化，使用 Promise.race 实现超时
    await this.page.waitForURL(
      url => url.pathname.includes('/dashboard') || url.pathname.includes('/pages/yongren/dashboard'),
      { timeout: TIMEOUTS.PAGE_LOAD }
    ).catch(() => {
      // 如果没有跳转，检查是否显示用户信息
      // 注意：此验证将在 Story 12.5 E2E 测试中完全实现
      // 当前仅提供基础结构
    });
  }

  /**
   * 验证登录失败（错误提示显示）
   * @param expectedErrorMessage 预期的错误消息（可选）
   */
  async expectLoginError(expectedErrorMessage?: string): Promise<void> {
    // 使用 auto-waiting 机制，等待错误提示显示
    // Taro 的 showToast 会显示错误消息
    if (expectedErrorMessage) {
      // 等待包含错误消息的元素可见
      await this.page.getByText(expectedErrorMessage, { exact: false }).waitFor({
        state: 'visible',
        timeout: TIMEOUTS.TOAST_LONG
      });
    } else {
      // 验证至少有错误提示出现（Toast、Modal 或 Alert）
      const toastOrModal = this.page.getByRole('alert').or(
        this.page.locator('.taro-toast')
      ).or(
        this.page.locator('.taro-modal')
      );
      await toastOrModal.waitFor({ state: 'visible', timeout: TIMEOUTS.TOAST_LONG });
    }
  }

  // ===== Token 管理方法 =====

  /**
   * 获取当前存储的 token
   * @returns token 字符串，如果不存在则返回 null
   */
  async getToken(): Promise<string | null> {
    const token = await this.page.evaluate(() => {
      return (
        localStorage.getItem('token') ||
        localStorage.getItem('auth_token') ||
        sessionStorage.getItem('token') ||
        sessionStorage.getItem('auth_token') ||
        null
      );
    });
    return token;
  }

  /**
   * 设置 token（用于测试前置条件）
   * @param token token 字符串
   */
  async setToken(token: string): Promise<void> {
    await this.page.evaluate((t) => {
      localStorage.setItem('token', t);
      localStorage.setItem('auth_token', t);
    }, token);
  }

  /**
   * 清除所有认证相关的存储
   */
  async clearAuth(): Promise<void> {
    await this.page.evaluate(() => {
      localStorage.removeItem('token');
      localStorage.removeItem('auth_token');
      sessionStorage.removeItem('token');
      sessionStorage.removeItem('auth_token');
    });
  }

  // ===== 主页元素验证方法 =====

  /**
   * 验证主页元素可见（登录后）
   * 根据实际小程序主页结构调整
   */
  async expectHomePageVisible(): Promise<void> {
    // 使用 auto-waiting 机制，等待主页元素可见
    // 注意：此方法将在 Story 12.5 E2E 测试中使用，当前仅提供基础结构
    // 根据实际小程序主页的 data-testid 调整
    const dashboard = this.page.getByTestId('mini-dashboard');
    await dashboard.waitFor({ state: 'visible', timeout: TIMEOUTS.PAGE_LOAD });
  }

  /**
   * 获取用户信息显示的文本
   * @returns 用户信息文本
   */
  async getUserInfoText(): Promise<string | null> {
    const userInfo = this.userInfo;
    const count = await userInfo.count();
    if (count === 0) {
      return null;
    }
    return await userInfo.textContent();
  }
}