ywana-core8 0.1.103 → 0.2.1

package/src/html/form.test.js

@@ -1,369 +0,0 @@
-import React from 'react'
-import { Form } from './form'
-
-// Pruebas unitarias para el componente Form
-describe('Form Component', () => {
-    // Mock de los componentes dependientes
-    const mockText = jest.fn()
-
-    beforeEach(() => {
-        jest.clearAllMocks()
-        
-        // Mock del componente Text
-        jest.doMock('./text', () => ({
-            Text: mockText
-        }))
-        
-        // Mock de console.warn para las pruebas
-        jest.spyOn(console, 'warn').mockImplementation(() => {})
-        jest.spyOn(console, 'error').mockImplementation(() => {})
-    })
-
-    afterEach(() => {
-        console.warn.mockRestore()
-        console.error.mockRestore()
-    })
-
-    test('component exports correctly', () => {
-        expect(Form).toBeDefined()
-        expect(typeof Form).toBe('function')
-    })
-
-    test('component has correct PropTypes', () => {
-        expect(Form.propTypes).toBeDefined()
-        expect(Form.propTypes.id).toBeDefined()
-        expect(Form.propTypes.title).toBeDefined()
-        expect(Form.propTypes.columns).toBeDefined()
-        expect(Form.propTypes.children).toBeDefined()
-        expect(Form.propTypes.outlined).toBeDefined()
-        expect(Form.propTypes.disabled).toBeDefined()
-        expect(Form.propTypes.loading).toBeDefined()
-        expect(Form.propTypes.autoComplete).toBeDefined()
-        expect(Form.propTypes.noValidate).toBeDefined()
-        expect(Form.propTypes.className).toBeDefined()
-        expect(Form.propTypes.onChange).toBeDefined()
-        expect(Form.propTypes.onSubmit).toBeDefined()
-        expect(Form.propTypes.onReset).toBeDefined()
-        expect(Form.propTypes.onValidationChange).toBeDefined()
-    })
-
-    test('component has correct defaultProps', () => {
-        expect(Form.defaultProps).toBeDefined()
-        expect(Form.defaultProps.columns).toBe(1)
-        expect(Form.defaultProps.outlined).toBe(false)
-        expect(Form.defaultProps.disabled).toBe(false)
-        expect(Form.defaultProps.loading).toBe(false)
-        expect(Form.defaultProps.autoComplete).toBe('on')
-        expect(Form.defaultProps.noValidate).toBe(false)
-        expect(Form.defaultProps.className).toBe('')
-    })
-
-    test('warns when children prop is missing', () => {
-        const validateChildren = (children) => {
-            if (!children) {
-                console.warn('Form component: children prop is required')
-            }
-        }
-        
-        validateChildren(null)
-        expect(console.warn).toHaveBeenCalledWith('Form component: children prop is required')
-
-        console.warn.mockClear()
-        validateChildren('some children')
-        expect(console.warn).not.toHaveBeenCalled()
-    })
-
-    test('isEmpty function works correctly', () => {
-        const isEmpty = (value) => value === void 0 || value === null || value === ''
-
-        expect(isEmpty(undefined)).toBe(true)
-        expect(isEmpty(null)).toBe(true)
-        expect(isEmpty('')).toBe(true)
-        expect(isEmpty('text')).toBe(false)
-        expect(isEmpty(0)).toBe(false)
-        expect(isEmpty(false)).toBe(false)
-        expect(isEmpty([])).toBe(false)
-        expect(isEmpty({})).toBe(false)
-    })
-
-    test('field initialization works correctly', () => {
-        const mockChildren = [
-            { props: { id: 'field1', value: 'test', required: true } },
-            { props: { id: 'field2', value: '', required: false } },
-            { props: { id: 'field3', value: 'valid', required: true, validation: (v) => v.length > 3 } },
-            { props: {} }, // No id, should be filtered out
-            null // Null child, should be filtered out
-        ]
-
-        const initFields = mockChildren
-            .filter(child => child !== null && child !== '')
-            .map(child => {
-                if (!child.props) return null
-                const { id, value, required = false, validation } = child.props
-                if (!id) return null
-                
-                const isEmpty = (value) => value === void 0 || value === null || value === ''
-                const valid = required ? 
-                    validation ? validation(value) : !isEmpty(value) : 
-                    true
-                return { id, value, required, validation, valid }
-            })
-            .filter(field => field !== null)
-
-        expect(initFields).toHaveLength(3)
-        expect(initFields[0]).toEqual({ id: 'field1', value: 'test', required: true, validation: undefined, valid: true })
-        expect(initFields[1]).toEqual({ id: 'field2', value: '', required: false, validation: undefined, valid: true })
-        expect(initFields[2]).toEqual({ id: 'field3', value: 'valid', required: true, validation: expect.any(Function), valid: true })
-    })
-
-    test('field change logic works correctly', () => {
-        const fields = [
-            { id: 'field1', value: 'test', required: true, validation: undefined, valid: true },
-            { id: 'field2', value: '', required: false, validation: undefined, valid: true }
-        ]
-
-        const changeField = (fields, id, value) => {
-            const isEmpty = (value) => value === void 0 || value === null || value === ''
-            
-            return fields.map(field => {
-                if (field.id === id) {
-                    const valid = field.required ? 
-                        field.validation ? field.validation(value) : !isEmpty(value) : 
-                        true
-                    return { ...field, value, valid }
-                }
-                return field
-            })
-        }
-
-        // Change field1 to empty (should be invalid because required)
-        const result1 = changeField(fields, 'field1', '')
-        expect(result1[0].value).toBe('')
-        expect(result1[0].valid).toBe(false)
-
-        // Change field2 to empty (should be valid because not required)
-        const result2 = changeField(fields, 'field2', '')
-        expect(result2[1].value).toBe('')
-        expect(result2[1].valid).toBe(true)
-
-        // Change field1 to valid value
-        const result3 = changeField(fields, 'field1', 'new value')
-        expect(result3[0].value).toBe('new value')
-        expect(result3[0].valid).toBe(true)
-    })
-
-    test('form data generation works correctly', () => {
-        const fields = [
-            { id: 'field1', value: 'test', required: true, valid: true },
-            { id: 'field2', value: '', required: false, valid: true },
-            { id: 'field3', value: null, required: false, valid: true },
-            { id: 'field4', value: undefined, required: false, valid: true },
-            { id: 'field5', value: 0, required: false, valid: true },
-            { id: 'field6', value: false, required: false, valid: true }
-        ]
-
-        const formData = fields.reduce((data, { id, value }) => {
-            if (value !== undefined && value !== null) {
-                data[id] = value
-            }
-            return data
-        }, {})
-
-        expect(formData).toEqual({
-            field1: 'test',
-            field2: '',
-            field5: 0,
-            field6: false
-        })
-    })
-
-    test('form validation works correctly', () => {
-        const fields1 = [
-            { id: 'field1', value: 'test', required: true, valid: true },
-            { id: 'field2', value: '', required: false, valid: true }
-        ]
-
-        const fields2 = [
-            { id: 'field1', value: 'test', required: true, valid: true },
-            { id: 'field2', value: '', required: true, valid: false }
-        ]
-
-        const isFormValid = (fields) => fields.every(({ valid }) => valid === true)
-
-        expect(isFormValid(fields1)).toBe(true)
-        expect(isFormValid(fields2)).toBe(false)
-    })
-
-    test('CSS classes generation works correctly', () => {
-        const generateClasses = (disabled, loading, className) => {
-            return [
-                'form-grid',
-                disabled && 'disabled',
-                loading && 'loading',
-                className || ''
-            ].filter(Boolean).join(' ')
-        }
-
-        expect(generateClasses(false, false, '')).toBe('form-grid')
-        expect(generateClasses(true, false, '')).toBe('form-grid disabled')
-        expect(generateClasses(false, true, '')).toBe('form-grid loading')
-        expect(generateClasses(true, true, '')).toBe('form-grid disabled loading')
-        expect(generateClasses(false, false, 'custom')).toBe('form-grid custom')
-    })
-
-    test('grid layout generation works correctly', () => {
-        const generateGridLayout = (columns) => {
-            return { 
-                gridTemplateColumns: `repeat(${columns}, 1fr)`,
-                gridAutoRows: 'auto'
-            }
-        }
-
-        expect(generateGridLayout(1)).toEqual({
-            gridTemplateColumns: 'repeat(1, 1fr)',
-            gridAutoRows: 'auto'
-        })
-
-        expect(generateGridLayout(3)).toEqual({
-            gridTemplateColumns: 'repeat(3, 1fr)',
-            gridAutoRows: 'auto'
-        })
-    })
-
-    test('accessibility attributes generation works correctly', () => {
-        const generateAriaAttributes = (loading, isSubmitting, disabled, noValidate, autoComplete) => {
-            return {
-                'aria-busy': loading || isSubmitting,
-                'aria-disabled': disabled,
-                noValidate: noValidate,
-                autoComplete: autoComplete
-            }
-        }
-
-        const basic = generateAriaAttributes(false, false, false, false, 'on')
-        expect(basic['aria-busy']).toBe(false)
-        expect(basic['aria-disabled']).toBe(false)
-        expect(basic.noValidate).toBe(false)
-        expect(basic.autoComplete).toBe('on')
-
-        const loading = generateAriaAttributes(true, false, false, false, 'on')
-        expect(loading['aria-busy']).toBe(true)
-
-        const submitting = generateAriaAttributes(false, true, false, false, 'on')
-        expect(submitting['aria-busy']).toBe(true)
-
-        const disabled = generateAriaAttributes(false, false, true, false, 'on')
-        expect(disabled['aria-disabled']).toBe(true)
-
-        const noValidate = generateAriaAttributes(false, false, false, true, 'off')
-        expect(noValidate.noValidate).toBe(true)
-        expect(noValidate.autoComplete).toBe('off')
-    })
-
-    test('form submission logic works correctly', async () => {
-        const mockOnSubmit = jest.fn().mockResolvedValue()
-        
-        const simulateSubmit = async (disabled, loading, isSubmitting, fields, noValidate, onSubmit) => {
-            const event = {
-                preventDefault: jest.fn(),
-                stopPropagation: jest.fn()
-            }
-            
-            event.preventDefault()
-            event.stopPropagation()
-            
-            if (disabled || loading || isSubmitting) return false
-            
-            const valid = fields.every(({ valid }) => valid === true)
-            if (!valid && !noValidate) return false
-            
-            const formData = fields.reduce((data, { id, value }) => {
-                if (value !== undefined && value !== null) {
-                    data[id] = value
-                }
-                return data
-            }, {})
-            
-            if (onSubmit) {
-                await onSubmit(formData, event)
-            }
-            
-            return true
-        }
-
-        const validFields = [
-            { id: 'field1', value: 'test', valid: true }
-        ]
-
-        const invalidFields = [
-            { id: 'field1', value: '', valid: false }
-        ]
-
-        // Valid form submission
-        const result1 = await simulateSubmit(false, false, false, validFields, false, mockOnSubmit)
-        expect(result1).toBe(true)
-        expect(mockOnSubmit).toHaveBeenCalledWith({ field1: 'test' }, expect.any(Object))
-
-        mockOnSubmit.mockClear()
-
-        // Invalid form submission (should not submit)
-        const result2 = await simulateSubmit(false, false, false, invalidFields, false, mockOnSubmit)
-        expect(result2).toBe(false)
-        expect(mockOnSubmit).not.toHaveBeenCalled()
-
-        // Invalid form submission with noValidate (should submit)
-        const result3 = await simulateSubmit(false, false, false, invalidFields, true, mockOnSubmit)
-        expect(result3).toBe(true)
-        expect(mockOnSubmit).toHaveBeenCalled()
-
-        mockOnSubmit.mockClear()
-
-        // Disabled form (should not submit)
-        const result4 = await simulateSubmit(true, false, false, validFields, false, mockOnSubmit)
-        expect(result4).toBe(false)
-        expect(mockOnSubmit).not.toHaveBeenCalled()
-    })
-
-    test('form reset logic works correctly', () => {
-        const fields = [
-            { id: 'field1', value: 'test', required: true, valid: true },
-            { id: 'field2', value: 'data', required: false, valid: true }
-        ]
-
-        const resetFields = (fields) => {
-            return fields.map(field => ({
-                ...field,
-                value: '',
-                valid: !field.required
-            }))
-        }
-
-        const result = resetFields(fields)
-        expect(result[0]).toEqual({ id: 'field1', value: '', required: true, valid: false })
-        expect(result[1]).toEqual({ id: 'field2', value: '', required: false, valid: true })
-    })
-
-    test('child enhancement works correctly', () => {
-        const enhanceChild = (child, changeField, outlined, disabled, field) => {
-            const enhancedProps = {
-                onChange: changeField,
-                outlined: outlined,
-                disabled: disabled || child.props.disabled,
-                error: field && !field.valid ? (field.required ? 'This field is required' : false) : child.props.error
-            }
-            return enhancedProps
-        }
-
-        const mockChild = { props: { disabled: false, error: false } }
-        const mockField = { valid: false, required: true }
-
-        const result = enhanceChild(mockChild, () => {}, true, false, mockField)
-        expect(result.outlined).toBe(true)
-        expect(result.disabled).toBe(false)
-        expect(result.error).toBe('This field is required')
-
-        const validField = { valid: true, required: true }
-        const result2 = enhanceChild(mockChild, () => {}, false, false, validField)
-        expect(result2.error).toBe(false)
-    })
-})