mini-starter/web/tests/e2e/specs/admin/bank-name-integration.spec.ts

import { test, expect } 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 }) => {
    await adminLoginPage.goto();
    await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
    await adminLoginPage.expectLoginSuccess();
  });

  test('调试并验证删除功能', async ({ page }) => {
    // 监听 API
    page.on('response', async (response) => {
      const url = response.url();
      if (url.includes('/api/v1/bank-names')) {
        const status = response.status();
        console.log('   [API] ' + status + ' ' + url);
        if (status === 200) {
          try {
            const body = await response.text();
            const data = JSON.parse(body);
            console.log('   [API] data.length: ' + (data.data?.length || 0));
          } catch (e) {
            console.log('   [API] 无法解析响应');
          }
        }
      }
    });
    
    console.log('1. 导航到银行名称管理页面...');
    await page.goto('http://localhost:8080/admin/bank-names');
    await page.waitForLoadState('domcontentloaded');
    
    // 轮询等待数据加载
    console.log('2. 等待数据加载...');
    let maxWait = 30;
    for (let i = 0; i < maxWait; i++) {
      const tbodyRows = await page.locator('tbody tr').count();
      if (tbodyRows > 0) {
        console.log('   ✓ 数据已加载，找到 ' + tbodyRows + ' 行');
        break;
      }
      if (i === maxWait - 1) {
        console.log('   ⚠ 数据未加载，等待超时');
        
        // 检查页面上的数据
        const pageInfo = await page.evaluate(() => {
          return {
            url: window.location.href,
            title: document.title,
            bodyText: document.body?.textContent?.substring(0, 500)
          };
        });
        console.log('   页面信息: ' + JSON.stringify(pageInfo).substring(0, 200));
        
        test.skip();
        return;
      }
      await page.waitForTimeout(500);
    }
    
    // 现在执行删除测试
    console.log('3. 查找删除按钮...');
    const deleteButtons = page.locator('button[data-testid^="delete-button-"]');
    const count = await deleteButtons.count();
    console.log('   找到 ' + count + ' 个删除按钮');
    
    expect(count, '应该找到至少一个删除按钮').toBeGreaterThan(0);
    
    // 获取第一个删除按钮
    const firstButton = deleteButtons.first();
    const firstTestId = await firstButton.getAttribute('data-testid');
    console.log('   使用删除按钮: ' + firstTestId);
    
    // 提取银行 ID
    const bankId = firstTestId?.replace('delete-button-', '') || '';
    
    // 获取删除前的记录数量
    const tableRows = page.locator('tr[data-testid^="type-row-"]');
    const initialCount = await tableRows.count();
    console.log('   删除前有 ' + initialCount + ' 条记录');
    
    // 点击删除按钮
    console.log('4. 点击删除按钮...');
    await firstButton.click();
    await page.waitForTimeout(1500);
    
    await page.screenshot({ path: 'test-results/bank-delete-integration-2-confirm.png' });
    
    // 验证删除对话框出现
    console.log('5. 验证删除对话框...');
    const deleteDialog = page.locator('[data-testid="delete-dialog"]');
    await expect(deleteDialog, '删除对话框应该出现').toBeVisible({ timeout: 5000 });
    console.log('   ✓ 删除对话框已出现');
    
    // 点击确认删除
    console.log('6. 点击确认删除...');
    const confirmButton = page.locator('[data-testid="delete-confirm-button"]');
    await confirmButton.click();
    
    // 等待删除完成
    await page.waitForTimeout(5000);
    
    await page.screenshot({ path: 'test-results/bank-delete-integration-3-after.png' });
    
    // 检查结果
    console.log('7. 检查删除结果...');
    
    // 检查是否有错误提示
    const errorToast = page.locator('[data-sonner-toast][data-type="error"]');
    const hasError = await errorToast.isVisible({ timeout: 1000 }).catch(() => false);
    
    if (hasError) {
      const errorText = await errorToast.innerText();
      console.log('   错误提示: "' + errorText + '"');
      
      if (errorText.includes('foreign key constraint') || errorText.includes('外键约束')) {
        console.log('   ⚠ 外键约束错误 - 该记录被引用，无法删除');
        console.log('   ✓ 删除功能本身工作正常，只是该记录不能被删除');
        
        // 验证对话框仍然显示
        const dialogStillVisible = await deleteDialog.isVisible().catch(() => false);
        expect(dialogStillVisible, '外键约束错误时对话框应保持打开').toBe(true);
        console.log('   ✓ 对话框保持打开状态');
        return;
      }
      
      throw new Error('删除失败: ' + errorText);
    }
    
    // 验证删除对话框已关闭
    const dialogStillVisible = await deleteDialog.isVisible().catch(() => false);
    console.log('   删除对话框是否仍可见: ' + dialogStillVisible);
    
    expect(dialogStillVisible, '删除成功后对话框应该关闭').toBe(false);
    console.log('   ✓ 删除对话框已关闭');
    
    // 验证记录数量减少
    const finalCount = await tableRows.count();
    console.log('   删除后有 ' + finalCount + ' 条记录');
    
    expect(finalCount, '记录数量应该减少').toBeLessThan(initialCount);
    console.log('   ✓ 记录数量已减少');
    
    // 验证已删除的记录不再显示
    if (bankId) {
      const deletedRow = page.locator(`tr[data-testid="type-row-${bankId}"]`);
      const deletedRowVisible = await deletedRow.isVisible().catch(() => false);
      expect(deletedRowVisible, '已删除的记录不应再显示').toBe(false);
      console.log('   ✓ 已删除的记录不再显示');
    }
    
    console.log('8. 测试完成 ✓');
  });
});