178 lines
5.3 KiB
JavaScript
178 lines
5.3 KiB
JavaScript
const React = require("react");
|
|
const MenuList = require("../../../../src/tui/components/common/MenuList");
|
|
|
|
describe("MenuList Component", () => {
|
|
test("component can be created with default props", () => {
|
|
const component = React.createElement(MenuList, {});
|
|
expect(component).toBeDefined();
|
|
expect(component.type).toBe(MenuList);
|
|
});
|
|
|
|
test("component accepts items array", () => {
|
|
const items = ["Option 1", "Option 2", "Option 3"];
|
|
const component = React.createElement(MenuList, { items });
|
|
|
|
expect(component.props.items).toEqual(items);
|
|
});
|
|
|
|
test("component accepts string items", () => {
|
|
const items = ["Home", "Settings", "Exit"];
|
|
const component = React.createElement(MenuList, { items });
|
|
|
|
expect(component.props.items).toEqual(items);
|
|
});
|
|
|
|
test("component accepts object items with labels", () => {
|
|
const items = [
|
|
{ label: "Home", shortcut: "h" },
|
|
{ label: "Settings", shortcut: "s" },
|
|
{ label: "Exit", shortcut: "q" },
|
|
];
|
|
const component = React.createElement(MenuList, { items });
|
|
|
|
expect(component.props.items).toEqual(items);
|
|
});
|
|
|
|
test("component accepts object items with different properties", () => {
|
|
const items = [
|
|
{ title: "Home", shortcut: "h", description: "Go to home screen" },
|
|
{ name: "Settings", shortcut: "s", description: "Configure app" },
|
|
{ label: "Exit", shortcut: "q", description: "Quit application" },
|
|
];
|
|
const component = React.createElement(MenuList, { items });
|
|
|
|
expect(component.props.items).toEqual(items);
|
|
});
|
|
|
|
test("component accepts selectedIndex prop", () => {
|
|
const component = React.createElement(MenuList, {
|
|
selectedIndex: 2,
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.selectedIndex).toBe(2);
|
|
});
|
|
|
|
test("component accepts onSelect callback", () => {
|
|
const mockOnSelect = jest.fn();
|
|
const component = React.createElement(MenuList, {
|
|
onSelect: mockOnSelect,
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.onSelect).toBe(mockOnSelect);
|
|
});
|
|
|
|
test("component accepts onHighlight callback", () => {
|
|
const mockOnHighlight = jest.fn();
|
|
const component = React.createElement(MenuList, {
|
|
onHighlight: mockOnHighlight,
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.onHighlight).toBe(mockOnHighlight);
|
|
});
|
|
|
|
test("component accepts showShortcuts prop", () => {
|
|
const component = React.createElement(MenuList, {
|
|
showShortcuts: false,
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.showShortcuts).toBe(false);
|
|
});
|
|
|
|
test("component accepts color customization props", () => {
|
|
const component = React.createElement(MenuList, {
|
|
highlightColor: "green",
|
|
normalColor: "cyan",
|
|
shortcutColor: "yellow",
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.highlightColor).toBe("green");
|
|
expect(component.props.normalColor).toBe("cyan");
|
|
expect(component.props.shortcutColor).toBe("yellow");
|
|
});
|
|
|
|
test("component accepts prefix customization", () => {
|
|
const component = React.createElement(MenuList, {
|
|
prefix: "→ ",
|
|
normalPrefix: " ",
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.prefix).toBe("→ ");
|
|
expect(component.props.normalPrefix).toBe(" ");
|
|
});
|
|
|
|
test("component accepts disabled prop", () => {
|
|
const component = React.createElement(MenuList, {
|
|
disabled: true,
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.disabled).toBe(true);
|
|
});
|
|
|
|
test("component accepts width prop", () => {
|
|
const component = React.createElement(MenuList, {
|
|
width: 50,
|
|
items: ["A", "B", "C"],
|
|
});
|
|
|
|
expect(component.props.width).toBe(50);
|
|
});
|
|
|
|
test("component handles empty items array", () => {
|
|
const component = React.createElement(MenuList, { items: [] });
|
|
expect(component.props.items).toEqual([]);
|
|
});
|
|
|
|
test("component handles undefined items", () => {
|
|
const component = React.createElement(MenuList, { items: undefined });
|
|
expect(component.props.items).toBeUndefined();
|
|
});
|
|
|
|
test("component accepts all expected props", () => {
|
|
const fullProps = {
|
|
items: [
|
|
{ label: "Home", shortcut: "h", description: "Go home" },
|
|
{ label: "Settings", shortcut: "s", description: "Configure" },
|
|
],
|
|
selectedIndex: 1,
|
|
onSelect: jest.fn(),
|
|
onHighlight: jest.fn(),
|
|
showShortcuts: true,
|
|
highlightColor: "blue",
|
|
normalColor: "white",
|
|
shortcutColor: "gray",
|
|
prefix: "► ",
|
|
normalPrefix: " ",
|
|
disabled: false,
|
|
width: 60,
|
|
};
|
|
|
|
const component = React.createElement(MenuList, fullProps);
|
|
expect(component).toBeDefined();
|
|
expect(component.props).toMatchObject(fullProps);
|
|
});
|
|
|
|
test("component has correct default values", () => {
|
|
const component = React.createElement(MenuList, {});
|
|
|
|
// Check that defaults are applied correctly in the component
|
|
expect(component.props.items).toBeUndefined(); // Will use default in component
|
|
expect(component.props.selectedIndex).toBeUndefined(); // Will use default in component
|
|
expect(component.props.showShortcuts).toBeUndefined(); // Will use default in component
|
|
expect(component.props.highlightColor).toBeUndefined(); // Will use default in component
|
|
expect(component.props.disabled).toBeUndefined(); // Will use default in component
|
|
});
|
|
|
|
test("component type is correct", () => {
|
|
const component = React.createElement(MenuList, { items: ["A", "B"] });
|
|
expect(typeof MenuList).toBe("function");
|
|
expect(component.type).toBe(MenuList);
|
|
});
|
|
});
|