mini-starter/web/tests/e2e/specs/admin/disability-person-debug.spec.ts

import { TIMEOUTS } from '../../utils/timeouts';
import { test } from '../../utils/test-setup';
import { readFileSync } from 'fs';
import { join, dirname } from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const testUsers = JSON.parse(readFileSync(join(__dirname, '../../fixtures/test-users.json'), 'utf-8'));

test.describe.serial('残疾人管理 - 参数错误调试测试', () => {
  test.beforeEach(async ({ adminLoginPage, disabilityPersonPage }) => {
    // 以管理员身份登录后台
    await adminLoginPage.goto();
    await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
    await adminLoginPage.expectLoginSuccess();
    await disabilityPersonPage.goto();
  });

  test('调试: 新增残疾人时的参数错误问题', async ({ disabilityPersonPage, page }) => {
    // 生成唯一的测试数据 - 使用数据库中实际存在的省份
    const timestamp = Date.now();
    const testData = {
      name: `调试测试_${timestamp}`,
      gender: '男',
      idCard: `11010119900101123${timestamp % 10}`,
      disabilityId: `5110011990010${timestamp % 10}`,
      disabilityType: '视力残疾',
      disabilityLevel: '一级',
      phone: `1380013800${timestamp % 10}`,
      idAddress: '湖北省武汉市测试街道1号',
      province: '湖北省',
      city: '武汉市'
    };

    console.log('\n========== 开始调试测试 ==========');
    console.log('测试数据:', JSON.stringify(testData, null, 2));

    // 1. 打开创建对话框
    console.log('\n[步骤1] 打开新增残疾人对话框...');
    await disabilityPersonPage.openCreateDialog();
    console.log('✓ 对话框已打开');

    // 2. 填写表单 - 简化版，只填必填项和能工作的字段
    console.log('\n[步骤2] 填写表单...');
    await disabilityPersonPage.page.waitForSelector('form#create-form', { state: 'visible', timeout: TIMEOUTS.DIALOG });

    // 填写基本信息 - 使用键盘选择枚举字段
    await disabilityPersonPage.page.getByLabel('姓名 *').fill(testData.name);
    // 性别默认是"男"，跳过
    await disabilityPersonPage.page.getByLabel('身份证号 *').fill(testData.idCard);
    await disabilityPersonPage.page.getByLabel('残疾证号 *').fill(testData.disabilityId);

    // 使用键盘选择残疾类型（第2个选项是"视力残疾"）
    const disabilityTypeCombobox = disabilityPersonPage.page.getByRole('combobox', { name: '残疾类型 *' });
    await disabilityTypeCombobox.click();
    await disabilityPersonPage.page.keyboard.press('ArrowDown'); // 跳过"请选择残疾类型"
    await disabilityPersonPage.page.keyboard.press('ArrowDown'); // 选择"视力残疾"
    await disabilityPersonPage.page.keyboard.press('Enter');

    // 使用键盘选择残疾等级（第2个选项是"一级"）
    const disabilityLevelCombobox = disabilityPersonPage.page.getByRole('combobox', { name: '残疾等级 *' });
    await disabilityLevelCombobox.click();
    await disabilityPersonPage.page.keyboard.press('ArrowDown'); // 跳过"请选择残疾等级"
    await disabilityPersonPage.page.keyboard.press('ArrowDown'); // 选择"一级"
    await disabilityPersonPage.page.keyboard.press('Enter');

    await disabilityPersonPage.page.getByLabel('联系电话 *').fill(testData.phone);
    await disabilityPersonPage.page.getByLabel('身份证地址 *').fill(testData.idAddress);

    // 居住地址 - 异步加载类型，能工作
    await disabilityPersonPage.selectRadixOption('省份 *', testData.province);
    await disabilityPersonPage.page.waitForTimeout(TIMEOUTS.MEDIUM);
    await disabilityPersonPage.selectRadixOption('城市', testData.city);

    console.log('✓ 表单已填写');

    // 3. 提交表单并捕获网络请求
    console.log('\n[步骤3] 提交表单并监听网络请求...');

    const result = await disabilityPersonPage.submitForm();

    console.log('\n========== 网络请求分析 ==========');

    if (result.responses.length === 0) {
      console.log('⚠️  没有捕获到任何相关网络请求！');
    } else {
      result.responses.forEach((resp, index) => {
        console.log(`\n[请求 ${index + 1}]`);
        console.log('  URL:', resp.url);
        console.log('  方法:', resp.method);
        console.log('  状态码:', resp.status);
        console.log('  OK:', resp.ok);
        console.log('  状态文本:', resp.statusText);

        if (resp.requestBody) {
          console.log('  请求体:', JSON.stringify(resp.requestBody, null, 2));
        }

        if (resp.responseBody) {
          console.log('  响应体:', JSON.stringify(resp.responseBody, null, 2));
        }

        // 关键检查：状态码与响应内容
        console.log('\n  🔍 状态码分析:');
        if (resp.status === 200) {
          console.log('    ✓ HTTP 状态码是 200 (成功)');
          if (resp.responseBody) {
            if (resp.responseBody.message) {
              console.log('    响应消息:', resp.responseBody.message);
            }
            if (resp.responseBody.error) {
              console.log('    ⚠️  响应包含错误信息:', resp.responseBody.error);
            }
          }
        } else if (resp.status === 201) {
          console.log('    ✓ HTTP 状态码是 201 (已创建)');
        } else if (resp.status >= 400) {
          console.log('    ✗ HTTP 错误状态码:', resp.status);
        }

        console.log('\n  响应头:', JSON.stringify(resp.responseHeaders, null, 2));
      });
    }

    console.log('\n========== UI 提示分析 ==========');
    console.log('有错误提示:', result.hasError);
    console.log('有成功提示:', result.hasSuccess);

    if (result.errorMessage) {
      console.log('❌ 错误消息:', result.errorMessage);
    }

    if (result.successMessage) {
      console.log('✅ 成功消息:', result.successMessage);
    }

    // 4. 验证数据是否真的创建成功
    console.log('\n[步骤4] 验证数据是否创建成功...');

    // 关闭对话框（如果还在）
    const dialogVisible = await page.locator('[role="dialog"]').isVisible().catch(() => false);
    if (dialogVisible) {
      await page.keyboard.press('Escape');
      await page.waitForTimeout(TIMEOUTS.MEDIUM);
    }

    // 刷新页面
    await page.reload();
    await page.waitForLoadState('networkidle');
    await disabilityPersonPage.goto();

    // 搜索刚创建的残疾人
    await disabilityPersonPage.searchByName(testData.name);
    await page.waitForTimeout(TIMEOUTS.LONG);

    const personExists = await disabilityPersonPage.personExists(testData.name);

    console.log('\n========== 最终结论 ==========');
    console.log('数据实际创建成功:', personExists);

    if (result.hasError && personExists) {
      console.log('\n🔴 问题确认！');
      console.log('  - 前端显示：创建失败（参数错误）');
      console.log('  - 实际情况：数据已成功创建到数据库');
      console.log('\n  可能原因：');
      console.log('  1. 前端判断响应状态码的逻辑错误');
      console.log('  2. 后端返回 200 但前端期望 201');
      console.log('  3. 响应数据结构不符合前端预期');
      console.log('  4. 前端错误处理逻辑将成功误判为失败');
    } else if (result.hasSuccess && personExists) {
      console.log('\n✅ 测试通过：前端显示成功，数据也创建成功');
    } else if (!result.hasError && !result.hasSuccess) {
      console.log('\n⚠️  没有任何提示消息');
    }

    console.log('================================\n');
  });
});