kindergarten_java/lesingle-edu-reading-platform-frontend/tests/e2e/admin/07-resources.spec.ts

/**
 * 超管端 E2E 测试 - 资源库
 */

import { test, expect } from '@playwright/test';
import { loginAsAdmin, waitForTable, waitForSuccess } from './helpers';
import { TEST_DATA } from './fixtures';

test.describe('资源库', () => {
  test.beforeEach(async ({ page }) => {
    await loginAsAdmin(page);
    // 导航到资源库列表页面
    await page.goto('/admin/resources');
  });

  test.describe('列表页面', () => {
    test('访问资源库列表页面', async ({ page }) => {
      // 验证页面 URL
      await expect(page).toHaveURL(/\/admin\/resources/);
    });

    test('验证列表加载', async ({ page }) => {
      // 等待表格加载
      await waitForTable(page);

      // 验证表格存在
      const table = page.locator('table, .ant-table');
      await expect(table).toBeVisible();

      // 验证新建按钮存在
      const createButton = page.getByText(/新建资源 | 创建资源 | 上传资源/);
      await expect(createButton).toBeVisible();
    });

    test('搜索功能', async ({ page }) => {
      await waitForTable(page);

      // 输入搜索关键词
      const searchInput = page.getByPlaceholder(/搜索资源名称/);
      if (await searchInput.isVisible()) {
        await searchInput.fill('测试');
        await searchInput.press('Enter');

        // 等待搜索结果
        await page.waitForTimeout(1000);
      }

      // 验证表格仍然存在
      const table = page.locator('table, .ant-table');
      await expect(table).toBeVisible();
    });

    test('筛选功能 - 按类型', async ({ page }) => {
      await waitForTable(page);

      // 选择类型筛选
      const typeSelect = page.getByPlaceholder(/全部类型 | 资源类型/);
      if (await typeSelect.isVisible()) {
        await typeSelect.click();
        await page.getByText('图片').click();

        // 等待筛选结果
        await page.waitForTimeout(1000);
      }

      // 验证表格仍然存在
      const table = page.locator('table, .ant-table');
      await expect(table).toBeVisible();
    });

    test('分页功能', async ({ page }) => {
      await waitForTable(page);

      // 验证分页控件存在
      const pagination = page.locator('.ant-pagination');
      await expect(pagination).toBeVisible();
    });
  });

  test.describe('创建资源', () => {
    test('点击创建按钮', async ({ page }) => {
      await waitForTable(page);

      // 点击新建资源按钮
      const createButton = page.getByText(/新建资源 | 创建资源 | 上传资源/);
      await createButton.click();

      // 验证跳转到创建页面或弹窗显示
      await page.waitForTimeout(1000);

      // 检查是弹窗还是新页面
      const modal = page.locator('.ant-modal');
      const createPage = page.getByText(/上传资源 | 新建资源/);

      if (await modal.isVisible()) {
        await expect(modal).toBeVisible();
      } else {
        await expect(createPage).toBeVisible();
      }
    });

    test('填写资源信息', async ({ page }) => {
      await waitForTable(page);

      // 点击新建资源按钮
      const createButton = page.getByText(/新建资源 | 创建资源 | 上传资源/);
      await createButton.click();
      await page.waitForTimeout(500);

      // 检查是弹窗还是新页面
      const modal = page.locator('.ant-modal');
      const isModal = await modal.isVisible();

      if (isModal) {
        // 在弹窗中填写资源名称
        const nameInput = modal.locator('input[placeholder*="资源名称"]');
        if (await nameInput.isVisible()) {
          await nameInput.fill(TEST_DATA.resource.name);
        }

        // 选择资源类型
        const typeSelect = modal.locator('[placeholder*="资源类型"]');
        if (await typeSelect.isVisible()) {
          await typeSelect.click();
          await page.getByText('图片').click();
        }

        // 填写描述
        const descInput = modal.locator('textarea[placeholder*="描述"]');
        if (await descInput.isVisible()) {
          await descInput.fill(TEST_DATA.resource.description);
        }
      } else {
        // 在页面中填写资源名称
        const nameInput = page.locator('input[placeholder*="资源名称"]');
        if (await nameInput.isVisible()) {
          await nameInput.fill(TEST_DATA.resource.name);
        }

        // 选择资源类型
        const typeSelect = page.locator('[placeholder*="资源类型"]');
        if (await typeSelect.isVisible()) {
          await typeSelect.click();
          await page.getByText('图片').click();
        }

        // 填写描述
        const descInput = page.locator('textarea[placeholder*="描述"]');
        if (await descInput.isVisible()) {
          await descInput.fill(TEST_DATA.resource.description);
        }
      }
    });

    test('上传资源文件', async ({ page }) => {
      await waitForTable(page);

      // 点击新建资源按钮
      const createButton = page.getByText(/新建资源 | 创建资源 | 上传资源/);
      await createButton.click();
      await page.waitForTimeout(500);

      // 检查是弹窗还是新页面
      const modal = page.locator('.ant-modal');
      const isModal = await modal.isVisible();

      // 查找上传组件
      const uploadButton = page.locator('input[type="file"], .ant-upload input[type="file"]');
      if (await uploadButton.isVisible()) {
        // 验证上传组件存在
        await expect(uploadButton).toBeVisible();
      }

      // 或者查找上传区域
      const uploadArea = page.locator('.ant-upload-drag');
      if (await uploadArea.isVisible()) {
        await expect(uploadArea).toBeVisible();
      }
    });

    test('保存资源', async ({ page }) => {
      await waitForTable(page);

      // 点击新建资源按钮
      const createButton = page.getByText(/新建资源 | 创建资源 | 上传资源/);
      await createButton.click();
      await page.waitForTimeout(500);

      // 检查是弹窗还是新页面
      const modal = page.locator('.ant-modal');
      const isModal = await modal.isVisible();

      if (isModal) {
        // 在弹窗中填写资源名称
        const nameInput = modal.locator('input[placeholder*="资源名称"]');
        if (await nameInput.isVisible()) {
          await nameInput.fill(TEST_DATA.resource.name);
        }

        // 选择资源类型
        const typeSelect = modal.locator('[placeholder*="资源类型"]');
        if (await typeSelect.isVisible()) {
          await typeSelect.click();
          await page.waitForTimeout(200);
          await page.getByText('图片').click();
        }

        // 填写描述
        const descInput = modal.locator('textarea[placeholder*="描述"]');
        if (await descInput.isVisible()) {
          await descInput.fill(TEST_DATA.resource.description);
        }

        // 点击确定按钮
        const okButton = modal.locator('button:has-text("确定")');
        if (await okButton.isVisible()) {
          await okButton.click();
          await page.waitForTimeout(2000);
        }
      } else {
        // 在页面中填写资源名称
        const nameInput = page.locator('input[placeholder*="资源名称"]');
        if (await nameInput.isVisible()) {
          await nameInput.fill(TEST_DATA.resource.name);
        }

        // 选择资源类型
        const typeSelect = page.locator('[placeholder*="资源类型"]');
        if (await typeSelect.isVisible()) {
          await typeSelect.click();
          await page.waitForTimeout(200);
          await page.getByText('图片').click();
        }

        // 填写描述
        const descInput = page.locator('textarea[placeholder*="描述"]');
        if (await descInput.isVisible()) {
          await descInput.fill(TEST_DATA.resource.description);
        }

        // 点击保存按钮
        const saveButton = page.getByText(/保存 | 提交/);
        if (await saveButton.isVisible()) {
          await saveButton.click();
          await page.waitForTimeout(2000);
        }
      }
    });
  });

  test.describe('编辑资源', () => {
    test('点击编辑按钮', async ({ page }) => {
      await waitForTable(page);

      // 查找第一个资源的编辑按钮
      const editButton = page.locator('button:has-text("编辑")').first();
      if (await editButton.isVisible()) {
        await editButton.click();

        // 等待编辑弹窗或页面加载
        await page.waitForTimeout(1000);

        // 验证编辑界面显示
        const modal = page.locator('.ant-modal');
        if (await modal.isVisible()) {
          await expect(modal).toBeVisible();
        }
      }
    });

    test('修改资源信息', async ({ page }) => {
      await waitForTable(page);

      // 查找第一个资源的编辑按钮
      const editButton = page.locator('button:has-text("编辑")').first();
      if (await editButton.isVisible()) {
        await editButton.click();
        await page.waitForTimeout(1000);

        // 修改资源描述
        const descInput = page.locator('textarea[placeholder*="描述"]');
        if (await descInput.isVisible()) {
          const originalDesc = await descInput.inputValue();
          await descInput.fill(`${originalDesc}_已修改`);
        }

        // 点击保存按钮
        const saveButton = page.locator('button:has-text("确定")').or(page.getByText(/保存/));
        if (await saveButton.isVisible()) {
          await saveButton.click();
          await page.waitForTimeout(1000);
        }
      }
    });
  });

  test.describe('删除资源', () => {
    test('点击删除按钮', async ({ page }) => {
      await waitForTable(page);

      // 查找第一个资源的删除按钮
      const deleteButton = page.locator('button:has-text("删除")').first();
      if (await deleteButton.isVisible()) {
        await expect(deleteButton).toBeVisible();
      }
    });

    test('确认删除弹窗', async ({ page }) => {
      await waitForTable(page);

      // 查找第一个资源的删除按钮
      const deleteButton = page.locator('button:has-text("删除")').first();
      if (await deleteButton.isVisible()) {
        await deleteButton.click();

        // 等待确认弹窗
        const confirmDialog = page.locator('.ant-modal-confirm');
        await expect(confirmDialog).toBeVisible({ timeout: 5000 });

        // 点击取消，不实际删除
        const cancelButton = page.locator('.ant-modal-confirm button:has-text("取消")');
        if (await cancelButton.isVisible()) {
          await cancelButton.click();
        }
      }
    });
  });
});