Alfred/tests/web/features/inbox/MaterialList.test.tsx

import { screen } from "@testing-library/react";
import { describe, expect, test, vi } from "bun:test";
import { createElement } from "react";

import type { Material } from "../../../../src/shared/api";

import { MaterialList } from "../../../../src/web/features/inbox/components/MaterialList";
import { renderWithProviders } from "../../test-utils";

const MOCK_MATERIALS: Material[] = [
  {
    associatedDate: "2026-06-03",
    createdAt: "2026-06-03T00:00:00.000Z",
    description: "素材一",
    id: "id-1",
    projectId: "project-1",
    status: "pending",
    updatedAt: "2026-06-03T00:00:00.000Z",
  },
  {
    associatedDate: "2026-06-02",
    createdAt: "2026-06-02T00:00:00.000Z",
    description: "素材二",
    id: "id-2",
    projectId: "project-1",
    status: "pending",
    updatedAt: "2026-06-02T00:00:00.000Z",
  },
];

describe("MaterialList", () => {
  test("列表为空时显示暂无素材", () => {
    renderWithProviders(
      createElement(MaterialList, {
        loading: false,
        materials: [],
        onAddClick: vi.fn(),
        onDelete: vi.fn(),
        onSelect: vi.fn(),
        selectedId: null,
      }),
    );
    expect(screen.getByText("暂无素材")).not.toBeNull();
  });

  test("渲染素材卡片列表", () => {
    renderWithProviders(
      createElement(MaterialList, {
        loading: false,
        materials: MOCK_MATERIALS,
        onAddClick: vi.fn(),
        onDelete: vi.fn(),
        onSelect: vi.fn(),
        selectedId: null,
      }),
    );
    expect(screen.getByText("素材一")).not.toBeNull();
    expect(screen.getByText("素材二")).not.toBeNull();
  });

  test("点击新增素材按钮触发 onAddClick", () => {
    const onAddClick = vi.fn();
    renderWithProviders(
      createElement(MaterialList, {
        loading: false,
        materials: [],
        onAddClick,
        onDelete: vi.fn(),
        onSelect: vi.fn(),
        selectedId: null,
      }),
    );
    screen.getByText("新增素材").click();
    expect(onAddClick).toHaveBeenCalledTimes(1);
  });

  test("加载中显示 Skeleton", () => {
    renderWithProviders(
      createElement(MaterialList, {
        loading: true,
        materials: [],
        onAddClick: vi.fn(),
        onDelete: vi.fn(),
        onSelect: vi.fn(),
        selectedId: null,
      }),
    );
    expect(document.querySelector(".ant-skeleton")).not.toBeNull();
  });
});