107 lines
3.1 KiB
TypeScript
107 lines
3.1 KiB
TypeScript
import { describe, expect, it, vi } from "bun:test";
|
|
import { fireEvent } from "@testing-library/react";
|
|
import { createElement } from "react";
|
|
|
|
import { FilterToolbar } from "../../src/web/shared/components/FilterToolbar";
|
|
import { renderWithProviders } from "./test-utils";
|
|
|
|
describe("FilterToolbar", () => {
|
|
it("renders filter Select with placeholder", () => {
|
|
const { getByText } = renderWithProviders(
|
|
createElement(FilterToolbar, {
|
|
filters: [
|
|
{
|
|
key: "status",
|
|
label: "状态",
|
|
onChange: () => {},
|
|
options: [
|
|
{ label: "进行中", value: "active" },
|
|
{ label: "已归档", value: "archived" },
|
|
],
|
|
placeholder: "选择状态",
|
|
},
|
|
],
|
|
}),
|
|
);
|
|
expect(getByText("选择状态")).toBeTruthy();
|
|
});
|
|
|
|
it("renders search input with placeholder", () => {
|
|
const { getByPlaceholderText } = renderWithProviders(
|
|
createElement(FilterToolbar, {
|
|
search: {
|
|
onReset: () => {},
|
|
onSearch: () => {},
|
|
placeholder: "搜索名称",
|
|
},
|
|
}),
|
|
);
|
|
expect(getByPlaceholderText("搜索名称")).toBeTruthy();
|
|
});
|
|
|
|
it("renders reset button", () => {
|
|
const { container } = renderWithProviders(
|
|
createElement(FilterToolbar, {
|
|
search: {
|
|
onReset: () => {},
|
|
onSearch: () => {},
|
|
placeholder: "搜索",
|
|
},
|
|
}),
|
|
);
|
|
const resetBtn = container.querySelector('button[title="重置"]');
|
|
expect(resetBtn).toBeTruthy();
|
|
});
|
|
|
|
it("renders action buttons", () => {
|
|
const { container } = renderWithProviders(
|
|
createElement(FilterToolbar, {
|
|
actions: createElement("button", null, "新建项目"),
|
|
search: {
|
|
onReset: () => {},
|
|
onSearch: () => {},
|
|
placeholder: "搜索",
|
|
},
|
|
}),
|
|
);
|
|
const buttons = container.querySelectorAll("button");
|
|
const hasAction = Array.from(buttons).some((btn) => btn.textContent?.includes("新建项目"));
|
|
expect(hasAction).toBe(true);
|
|
});
|
|
|
|
it("calls onSearch when search entered after typing", () => {
|
|
const onSearch = vi.fn();
|
|
const onReset = vi.fn();
|
|
const { getByPlaceholderText } = renderWithProviders(
|
|
createElement(FilterToolbar, {
|
|
search: {
|
|
keyword: "",
|
|
onReset,
|
|
onSearch,
|
|
placeholder: "搜索名称",
|
|
},
|
|
}),
|
|
);
|
|
const input = getByPlaceholderText("搜索名称");
|
|
fireEvent.change(input, { target: { value: "test" } });
|
|
fireEvent.keyDown(input, { key: "Enter" });
|
|
expect(onSearch).toHaveBeenCalledWith("test");
|
|
});
|
|
|
|
it("calls onReset when reset button clicked", () => {
|
|
const onReset = vi.fn();
|
|
const { container } = renderWithProviders(
|
|
createElement(FilterToolbar, {
|
|
search: {
|
|
onReset,
|
|
onSearch: () => {},
|
|
placeholder: "搜索",
|
|
},
|
|
}),
|
|
);
|
|
const resetBtn = container.querySelector<HTMLButtonElement>('button[title="重置"]');
|
|
resetBtn?.click();
|
|
expect(onReset).toHaveBeenCalled();
|
|
});
|
|
});
|