mini-starter/web/tests/e2e/specs/admin/bank-name-search.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('输入中文后按 Enter 键不应该刷新页面', async ({ page }) => {
    console.log('1. 导航到银行名称管理页面...');
    await page.goto('http://localhost:8080/admin/bank-names');
    await page.waitForLoadState('domcontentloaded');
    await page.waitForTimeout(1000);
    
    console.log('2. 查找搜索输入框...');
    const searchInput = page.getByTestId('search-input');
    await expect(searchInput).toBeVisible();
    
    console.log('3. 输入中文"中国"...');
    await searchInput.fill('中国');
    await page.waitForTimeout(500);
    
    const beforeValue = await searchInput.inputValue();
    console.log('输入后的值:', beforeValue);
    
    console.log('4. 按 Enter 键...');
    await searchInput.press('Enter');
    await page.waitForTimeout(1000);
    
    const afterValue = await searchInput.inputValue();
    console.log('按 Enter 后的值:', afterValue);
    
    // 验证搜索内容保持不变
    expect(afterValue).toBe('中国');
    
    // 清空搜索内容
    await searchInput.fill('');
    await page.waitForTimeout(500);
    
    // 截图验证
    await page.screenshot({ path: 'test-results/bank-search-verification.png' });
    console.log('截图已保存到 test-results/bank-search-verification.png');
  });

  test('应该能够成功删除银行记录', async ({ page }) => {
    console.log('1. 导航到银行名称管理页面...');
    await page.goto('http://localhost:8080/admin/bank-names');
    await page.waitForLoadState('domcontentloaded');
    await page.waitForTimeout(1000);
    
    // 查找删除按钮
    console.log('2. 查找删除按钮...');
    const deleteButtons = page.locator('button[data-testid^="delete-button-"]');
    const count = await deleteButtons.count();
    console.log('   找到 ' + count + ' 个删除按钮');
    
    if (count === 0) {
      console.log('   ⚠ 没有找到删除按钮');
      const tbodyRows = await page.locator('tbody tr').count();
      console.log('   tbody tr 数量: ' + tbodyRows);
      test.skip();
      return;
    }
    
    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('3. 点击删除按钮...');
    await firstButton.click();
    await page.waitForTimeout(1500);
    
    await page.screenshot({ path: 'test-results/bank-delete-final-2-confirm.png' });
    
    // 验证删除对话框出现
    console.log('4. 验证删除对话框...');
    const deleteDialog = page.locator('[data-testid="delete-dialog"]');
    await expect(deleteDialog, '删除对话框应该出现').toBeVisible({ timeout: 5000 });
    console.log('   ✓ 删除对话框已出现');
    
    // 点击确认删除
    console.log('5. 点击确认删除...');
    const confirmButton = page.locator('[data-testid="delete-confirm-button"]');
    await confirmButton.click();
    
    // 等待删除完成
    await page.waitForTimeout(5000);
    
    await page.screenshot({ path: 'test-results/bank-delete-final-3-after.png' });
    
    // 检查结果
    console.log('6. 检查删除结果...');
    
    // 检查是否有错误提示
    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('7. 测试完成 ✓');
  });
});