Neo-ZQYY/apps/admin-web/e2e/etl-tasks.spec.ts

/**
 * ETL 任务管理页面 E2E 测试。
 *
 * 验证点：
 * - 5 个 Tab 切换（config、queue、schedule、history、status）
 * - 各 Tab 内容渲染
 * - Tab 与 URL 查询参数同步
 */

import { test, expect } from '@playwright/test';
import { injectAuth, mockAllApis } from './helpers';

test.describe('ETL 任务管理页面', () => {
  test.beforeEach(async ({ page }) => {
    await injectAuth(page);
    await mockAllApis(page);
    await page.goto('/etl-tasks');
    // 等待页面标题渲染
    await expect(page.locator('text=ETL 任务管理').first()).toBeVisible();
  });

  test('默认显示 config Tab', async ({ page }) => {
    // 默认 Tab 为"发起"
    const configTab = page.locator('[role="tab"]', { hasText: '发起' });
    await expect(configTab).toHaveAttribute('aria-selected', 'true');
  });

  test('5 个 Tab 均可见', async ({ page }) => {
    await expect(page.locator('[role="tab"]', { hasText: '发起' })).toBeVisible();
    await expect(page.locator('[role="tab"]', { hasText: '队列' })).toBeVisible();
    await expect(page.locator('[role="tab"]', { hasText: '调度' })).toBeVisible();
    await expect(page.locator('[role="tab"]', { hasText: '历史' })).toBeVisible();
    await expect(page.locator('[role="tab"]', { hasText: '状态' })).toBeVisible();
  });

  test('切换到 queue Tab', async ({ page }) => {
    const queueTab = page.locator('[role="tab"]', { hasText: '队列' });
    await queueTab.click();
    await expect(queueTab).toHaveAttribute('aria-selected', 'true');
    // URL 同步
    await expect(page).toHaveURL(/\?tab=queue/);
  });

  test('切换到 schedule Tab', async ({ page }) => {
    const scheduleTab = page.locator('[role="tab"]', { hasText: '调度' });
    await scheduleTab.click();
    await expect(scheduleTab).toHaveAttribute('aria-selected', 'true');
    // URL 同步
    await expect(page).toHaveURL(/\?tab=schedule/);
  });

  test('切换到 history Tab', async ({ page }) => {
    const historyTab = page.locator('[role="tab"]', { hasText: '历史' });
    await historyTab.click();
    await expect(historyTab).toHaveAttribute('aria-selected', 'true');
    // URL 同步
    await expect(page).toHaveURL(/\?tab=history/);
  });

  test('切换到 status Tab', async ({ page }) => {
    const statusTab = page.locator('[role="tab"]', { hasText: '状态' });
    await statusTab.click();
    await expect(statusTab).toHaveAttribute('aria-selected', 'true');
    // URL 同步
    await expect(page).toHaveURL(/\?tab=status/);
  });

  test('通过 URL 直接访问 queue Tab', async ({ page }) => {
    await page.goto('/etl-tasks?tab=queue');
    const queueTab = page.locator('[role="tab"]', { hasText: '队列' });
    await expect(queueTab).toHaveAttribute('aria-selected', 'true');
  });

  test('通过 URL 直接访问 schedule Tab', async ({ page }) => {
    await page.goto('/etl-tasks?tab=schedule');
    const scheduleTab = page.locator('[role="tab"]', { hasText: '调度' });
    await expect(scheduleTab).toHaveAttribute('aria-selected', 'true');
  });

  test('通过 URL 直接访问 history Tab', async ({ page }) => {
    await page.goto('/etl-tasks?tab=history');
    const historyTab = page.locator('[role="tab"]', { hasText: '历史' });
    await expect(historyTab).toHaveAttribute('aria-selected', 'true');
  });

  test('通过 URL 直接访问 status Tab', async ({ page }) => {
    await page.goto('/etl-tasks?tab=status');
    const statusTab = page.locator('[role="tab"]', { hasText: '状态' });
    await expect(statusTab).toHaveAttribute('aria-selected', 'true');
  });

  test('无效 tab 参数回退到默认 config', async ({ page }) => {
    await page.goto('/etl-tasks?tab=invalid');
    const configTab = page.locator('[role="tab"]', { hasText: '发起' });
    await expect(configTab).toHaveAttribute('aria-selected', 'true');
  });
});