const React = require("react"); const { FormInput, SimpleFormInput, } = require("../../../../src/tui/components/common/FormInput.jsx"); describe("FormInput Component", () => { it("should create FormInput component with basic props", () => { const component = React.createElement(FormInput, { label: "Test Label", value: "test value", }); expect(component).toBeDefined(); expect(component.type).toBe(FormInput); expect(component.props.label).toBe("Test Label"); expect(component.props.value).toBe("test value"); }); it("should accept required prop", () => { const component = React.createElement(FormInput, { label: "Required Field", required: true, }); expect(component.props.required).toBe(true); }); it("should accept help text", () => { const component = React.createElement(FormInput, { label: "Test Field", helpText: "This is help text", }); expect(component.props.helpText).toBe("This is help text"); }); it("should accept validation function", () => { const mockValidation = jest.fn(); const component = React.createElement(FormInput, { label: "Validated Field", validation: mockValidation, }); expect(component.props.validation).toBe(mockValidation); }); it("should accept input type", () => { const component = React.createElement(FormInput, { label: "Email Field", type: "email", }); expect(component.props.type).toBe("email"); }); it("should accept maxLength prop", () => { const component = React.createElement(FormInput, { label: "Short Text", maxLength: 10, }); expect(component.props.maxLength).toBe(10); }); it("should accept disabled prop", () => { const component = React.createElement(FormInput, { label: "Disabled Field", disabled: true, }); expect(component.props.disabled).toBe(true); }); it("should accept showError prop", () => { const component = React.createElement(FormInput, { label: "No Error Display", showError: false, }); expect(component.props.showError).toBe(false); }); it("should accept select type with options", () => { const options = [ { label: "Option 1", value: "opt1" }, { label: "Option 2", value: "opt2" }, ]; const component = React.createElement(FormInput, { label: "Select Field", type: "select", options: options, }); expect(component.props.type).toBe("select"); expect(component.props.options).toBe(options); }); it("should accept callback functions", () => { const mockOnChange = jest.fn(); const mockOnSubmit = jest.fn(); const mockOnFocus = jest.fn(); const mockOnBlur = jest.fn(); const component = React.createElement(FormInput, { label: "Callback Field", onChange: mockOnChange, onSubmit: mockOnSubmit, onFocus: mockOnFocus, onBlur: mockOnBlur, }); expect(component.props.onChange).toBe(mockOnChange); expect(component.props.onSubmit).toBe(mockOnSubmit); expect(component.props.onFocus).toBe(mockOnFocus); expect(component.props.onBlur).toBe(mockOnBlur); }); it("should accept placeholder and mask", () => { const component = React.createElement(FormInput, { label: "Masked Field", placeholder: "Enter value", mask: "***", }); expect(component.props.placeholder).toBe("Enter value"); expect(component.props.mask).toBe("***"); }); }); describe("SimpleFormInput Component", () => { it("should create SimpleFormInput component", () => { const component = React.createElement(SimpleFormInput, { label: "Simple Field", value: "simple value", }); expect(component).toBeDefined(); expect(component.type).toBe(SimpleFormInput); expect(component.props.label).toBe("Simple Field"); expect(component.props.value).toBe("simple value"); }); it("should accept onChange callback", () => { const mockOnChange = jest.fn(); const component = React.createElement(SimpleFormInput, { label: "Simple Field", onChange: mockOnChange, }); expect(component.props.onChange).toBe(mockOnChange); }); it("should accept required prop", () => { const component = React.createElement(SimpleFormInput, { label: "Required Simple", required: true, }); expect(component.props.required).toBe(true); }); it("should accept placeholder", () => { const component = React.createElement(SimpleFormInput, { label: "Simple Field", placeholder: "Enter text", }); expect(component.props.placeholder).toBe("Enter text"); }); });