cascade-select.ts 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. /**
  2. * @license
  3. * Copyright 2025 多八多云端开发环境
  4. *
  5. * 省市区级联选择 E2E 测试工具
  6. *
  7. * @description
  8. * 专门用于省市区三级联动选择的 E2E 测试工具方法。
  9. * 处理级联选择特有的时序问题:选择省份后等待城市选项加载,选择城市后等待区县选项加载。
  10. */
  11. import type { Page } from '@playwright/test';
  12. import { selectRadixOptionAsync } from './radix-select.js';
  13. /**
  14. * 省市区级联选择配置
  15. */
  16. export interface CascadeSelectOptions {
  17. /** 省份 */
  18. province: string;
  19. /** 城市 */
  20. city: string;
  21. /** 区县(可选) */
  22. district?: string;
  23. /** 每级选择的超时时间(毫秒),默认 10000 */
  24. timeout?: number;
  25. /** 级联间等待时间(毫秒),默认 1500(增加以适应网络请求) */
  26. cascadeDelay?: number;
  27. }
  28. /**
  29. * 执行省市区级联选择
  30. *
  31. * @description
  32. * 按顺序选择省份、城市、区县,每级选择后等待一段时间确保下一级选项加载完成。
  33. *
  34. * @example
  35. * ```typescript
  36. * await selectCascade(page, {
  37. * province: '湖北省',
  38. * city: '武汉市',
  39. * district: '武昌区'
  40. * });
  41. * ```
  42. *
  43. * @param page - Playwright Page 对象
  44. * @param options - 级联选择配置
  45. * @throws {Error} 当任何一级选择失败时
  46. */
  47. export async function selectCascade(
  48. page: Page,
  49. options: CascadeSelectOptions
  50. ): Promise<void> {
  51. const {
  52. province,
  53. city,
  54. district,
  55. timeout = 10000,
  56. cascadeDelay = 1500
  57. } = options;
  58. console.debug(`[selectCascade] 开始级联选择: ${province} > ${city}${district ? ' > ' + district : ''}`);
  59. // 1. 选择省份
  60. console.debug(`[selectCascade] 步骤 1/3: 选择省份 "${province}"`);
  61. await selectRadixOptionAsync(page, '省份 *', province, { timeout });
  62. console.debug(`[selectCascade] 省份选择完成`);
  63. // 2. 等待城市选项加载(关键:省份选择后需要等待网络请求返回)
  64. console.debug(`[selectCascade] 等待城市选项加载 (${cascadeDelay}ms)`);
  65. await page.waitForTimeout(cascadeDelay);
  66. // 3. 选择城市
  67. console.debug(`[selectCascade] 步骤 2/3: 选择城市 "${city}"`);
  68. await selectRadixOptionAsync(page, '城市 *', city, { timeout });
  69. console.debug(`[selectCascade] 城市选择完成`);
  70. // 4. 如果需要选择区县
  71. if (district) {
  72. console.debug(`[selectCascade] 等待区县选项加载 (${cascadeDelay}ms)`);
  73. await page.waitForTimeout(cascadeDelay);
  74. console.debug(`[selectCascade] 步骤 3/3: 选择区县 "${district}"`);
  75. await selectRadixOptionAsync(page, '区县', district, { timeout });
  76. console.debug(`[selectCascade] 区县选择完成`);
  77. }
  78. console.debug(`[selectCascade] 级联选择完成`);
  79. }
  80. /**
  81. * 执行省市二级级联选择(不含区县)
  82. *
  83. * @description
  84. * 简化版本的级联选择,只选择省份和城市。
  85. *
  86. * @example
  87. * ```typescript
  88. * await selectProvinceCity(page, '湖北省', '武汉市');
  89. * ```
  90. *
  91. * @param page - Playwright Page 对象
  92. * @param province - 省份名称
  93. * @param city - 城市名称
  94. * @param timeout - 超时时间(毫秒),默认 10000
  95. */
  96. export async function selectProvinceCity(
  97. page: Page,
  98. province: string,
  99. city: string,
  100. timeout = 10000
  101. ): Promise<void> {
  102. await selectCascade(page, { province, city, timeout });
  103. }