ywana-core8 0.1.103 → 0.2.1

package/src/html/switch.test.js

@@ -1,355 +0,0 @@
-import React from 'react'
-import { Switch, Switch2 } from './switch'
-
-// Mock react-switch
-jest.mock('react-switch', () => {
-    return function MockRSwitch(props) {
-        const mockReact = require('react')
-        return mockReact.createElement('div', {
-            'data-testid': 'react-switch',
-            'data-checked': props.checked,
-            'data-disabled': props.disabled,
-            onClick: () => props.onChange && props.onChange(!props.checked)
-        }, 'MockSwitch')
-    }
-})
-
-// Pruebas unitarias para los componentes Switch
-describe('Switch Components', () => {
-    // Mock de los componentes dependientes
-    const mockText = jest.fn()
-    const mockIcon = jest.fn()
-
-    beforeEach(() => {
-        jest.clearAllMocks()
-        
-        // Mock del componente Text
-        jest.doMock('./text', () => ({
-            Text: mockText
-        }))
-        
-        // Mock del componente Icon
-        jest.doMock('./icon', () => ({
-            Icon: mockIcon
-        }))
-        
-        // Mock de console.warn para las pruebas
-        jest.spyOn(console, 'warn').mockImplementation(() => {})
-    })
-
-    afterEach(() => {
-        console.warn.mockRestore()
-    })
-
-    describe('Switch Component', () => {
-        test('component exports correctly', () => {
-            expect(Switch).toBeDefined()
-            expect(typeof Switch).toBe('function')
-        })
-
-        test('component has correct PropTypes', () => {
-            expect(Switch.propTypes).toBeDefined()
-            expect(Switch.propTypes.id).toBeDefined()
-            expect(Switch.propTypes.label).toBeDefined()
-            expect(Switch.propTypes.checked).toBeDefined()
-            expect(Switch.propTypes.disabled).toBeDefined()
-            expect(Switch.propTypes.readOnly).toBeDefined()
-            expect(Switch.propTypes.error).toBeDefined()
-            expect(Switch.propTypes.required).toBeDefined()
-            expect(Switch.propTypes.size).toBeDefined()
-            expect(Switch.propTypes.className).toBeDefined()
-            expect(Switch.propTypes.ariaLabel).toBeDefined()
-            expect(Switch.propTypes.onChange).toBeDefined()
-            expect(Switch.propTypes.onColor).toBeDefined()
-            expect(Switch.propTypes.offColor).toBeDefined()
-        })
-
-        test('component has correct defaultProps', () => {
-            expect(Switch.defaultProps).toBeDefined()
-            expect(Switch.defaultProps.checked).toBe(false)
-            expect(Switch.defaultProps.disabled).toBe(false)
-            expect(Switch.defaultProps.readOnly).toBe(false)
-            expect(Switch.defaultProps.error).toBe(false)
-            expect(Switch.defaultProps.required).toBe(false)
-            expect(Switch.defaultProps.size).toBe('normal')
-            expect(Switch.defaultProps.className).toBe('')
-        })
-
-        test('warns when onChange is not a function', () => {
-            const validateOnChange = (onChange) => {
-                if (onChange && typeof onChange !== 'function') {
-                    console.warn('Switch component: onChange prop should be a function')
-                }
-            }
-
-            validateOnChange('not a function')
-            expect(console.warn).toHaveBeenCalledWith('Switch component: onChange prop should be a function')
-
-            console.warn.mockClear()
-            validateOnChange(() => {})
-            expect(console.warn).not.toHaveBeenCalled()
-        })
-
-        test('size configuration works correctly', () => {
-            const sizeConfig = {
-                small: { height: 16, width: 32, handleDiameter: 14 },
-                normal: { height: 20, width: 48, handleDiameter: 18 },
-                large: { height: 24, width: 56, handleDiameter: 22 }
-            }
-
-            expect(sizeConfig.small.height).toBe(16)
-            expect(sizeConfig.normal.width).toBe(48)
-            expect(sizeConfig.large.handleDiameter).toBe(22)
-        })
-
-        test('change handler works correctly', () => {
-            const mockOnChange = jest.fn()
-            
-            // Simular el comportamiento del change handler
-            const simulateChange = (disabled, readOnly, onChange, id) => {
-                const nextChecked = true
-                const event = {}
-                
-                if (!disabled && !readOnly && onChange) {
-                    onChange(id || 'switch', nextChecked, event)
-                }
-            }
-
-            // Change normal
-            simulateChange(false, false, mockOnChange, 'test')
-            expect(mockOnChange).toHaveBeenCalledWith('test', true, {})
-
-            mockOnChange.mockClear()
-
-            // Change con disabled
-            simulateChange(true, false, mockOnChange, 'test')
-            expect(mockOnChange).not.toHaveBeenCalled()
-
-            // Change con readOnly
-            simulateChange(false, true, mockOnChange, 'test')
-            expect(mockOnChange).not.toHaveBeenCalled()
-        })
-
-        test('accessibility attributes generation works correctly', () => {
-            const generateAriaAttributes = (ariaLabel, label, required, error, id) => {
-                return {
-                    'aria-label': ariaLabel || label || 'Toggle switch',
-                    'aria-required': required,
-                    'aria-invalid': error,
-                    'aria-describedby': error && typeof error === 'string' ? `${id}-error` : undefined
-                }
-            }
-
-            // Atributos básicos
-            const basic = generateAriaAttributes(null, null, false, false, 'test')
-            expect(basic['aria-label']).toBe('Toggle switch')
-            expect(basic['aria-required']).toBe(false)
-            expect(basic['aria-invalid']).toBe(false)
-            expect(basic['aria-describedby']).toBeUndefined()
-
-            // Con label personalizado
-            const withLabel = generateAriaAttributes(null, 'Custom Label', false, false, 'test')
-            expect(withLabel['aria-label']).toBe('Custom Label')
-
-            // Con aria-label personalizado
-            const withAriaLabel = generateAriaAttributes('Custom ARIA', 'Label', false, false, 'test')
-            expect(withAriaLabel['aria-label']).toBe('Custom ARIA')
-
-            // Con error
-            const withError = generateAriaAttributes(null, null, false, 'Error message', 'test')
-            expect(withError['aria-invalid']).toBe('Error message')
-            expect(withError['aria-describedby']).toBe('test-error')
-        })
-    })
-
-    describe('Switch2 Component', () => {
-        test('component exports correctly', () => {
-            expect(Switch2).toBeDefined()
-            expect(typeof Switch2).toBe('function')
-        })
-
-        test('component has correct PropTypes', () => {
-            expect(Switch2.propTypes).toBeDefined()
-            expect(Switch2.propTypes.id).toBeDefined()
-            expect(Switch2.propTypes.label).toBeDefined()
-            expect(Switch2.propTypes.checked).toBeDefined()
-            expect(Switch2.propTypes.disabled).toBeDefined()
-            expect(Switch2.propTypes.readOnly).toBeDefined()
-            expect(Switch2.propTypes.error).toBeDefined()
-            expect(Switch2.propTypes.required).toBeDefined()
-            expect(Switch2.propTypes.size).toBeDefined()
-            expect(Switch2.propTypes.className).toBeDefined()
-            expect(Switch2.propTypes.ariaLabel).toBeDefined()
-            expect(Switch2.propTypes.onChange).toBeDefined()
-        })
-
-        test('component has correct defaultProps', () => {
-            expect(Switch2.defaultProps).toBeDefined()
-            expect(Switch2.defaultProps.checked).toBe(false)
-            expect(Switch2.defaultProps.disabled).toBe(false)
-            expect(Switch2.defaultProps.readOnly).toBe(false)
-            expect(Switch2.defaultProps.error).toBe(false)
-            expect(Switch2.defaultProps.required).toBe(false)
-            expect(Switch2.defaultProps.size).toBe('normal')
-            expect(Switch2.defaultProps.className).toBe('')
-        })
-
-        test('warns when onChange is not a function', () => {
-            const validateOnChange = (onChange) => {
-                if (onChange && typeof onChange !== 'function') {
-                    console.warn('Switch2 component: onChange prop should be a function')
-                }
-            }
-
-            validateOnChange('not a function')
-            expect(console.warn).toHaveBeenCalledWith('Switch2 component: onChange prop should be a function')
-
-            console.warn.mockClear()
-            validateOnChange(() => {})
-            expect(console.warn).not.toHaveBeenCalled()
-        })
-
-        test('icon selection logic works correctly', () => {
-            const getIcon = (checked) => {
-                return checked ? "toggle_on" : "toggle_off"
-            }
-
-            expect(getIcon(true)).toBe('toggle_on')
-            expect(getIcon(false)).toBe('toggle_off')
-        })
-
-        test('CSS classes generation works correctly', () => {
-            const generateClasses = (disabled, readOnly, error, className) => {
-                return [
-                    'switch2',
-                    disabled && 'disabled',
-                    readOnly && 'readonly',
-                    error && 'error',
-                    className || ''
-                ].filter(Boolean).join(' ')
-            }
-
-            expect(generateClasses(false, false, false, '')).toBe('switch2')
-            expect(generateClasses(true, false, false, '')).toBe('switch2 disabled')
-            expect(generateClasses(false, true, false, '')).toBe('switch2 readonly')
-            expect(generateClasses(false, false, true, '')).toBe('switch2 error')
-            expect(generateClasses(false, false, false, 'custom')).toBe('switch2 custom')
-            expect(generateClasses(true, true, true, 'custom')).toBe('switch2 disabled readonly error custom')
-        })
-
-        test('toggle function works correctly', () => {
-            const mockOnChange = jest.fn()
-            
-            // Simular el comportamiento del toggle
-            const simulateToggle = (disabled, readOnly, checked, onChange, id) => {
-                if (!disabled && !readOnly) {
-                    const nextValue = !checked
-                    if (onChange) {
-                        onChange(id || 'switch2', nextValue)
-                    }
-                    return nextValue
-                }
-                return checked
-            }
-
-            // Toggle normal
-            const result1 = simulateToggle(false, false, false, mockOnChange, 'test')
-            expect(result1).toBe(true)
-            expect(mockOnChange).toHaveBeenCalledWith('test', true)
-
-            mockOnChange.mockClear()
-
-            // Toggle con disabled
-            const result2 = simulateToggle(true, false, false, mockOnChange, 'test')
-            expect(result2).toBe(false)
-            expect(mockOnChange).not.toHaveBeenCalled()
-
-            // Toggle con readOnly
-            const result3 = simulateToggle(false, true, false, mockOnChange, 'test')
-            expect(result3).toBe(false)
-            expect(mockOnChange).not.toHaveBeenCalled()
-        })
-
-        test('keyboard event handling works correctly', () => {
-            const mockToggle = jest.fn()
-            
-            // Simular el manejo de eventos de teclado
-            const simulateKeyDown = (key, toggle) => {
-                const event = {
-                    key,
-                    preventDefault: jest.fn()
-                }
-
-                if (event.key === ' ' || event.key === 'Enter') {
-                    event.preventDefault()
-                    toggle()
-                }
-
-                return event
-            }
-
-            // Space key
-            const spaceEvent = simulateKeyDown(' ', mockToggle)
-            expect(spaceEvent.preventDefault).toHaveBeenCalled()
-            expect(mockToggle).toHaveBeenCalled()
-
-            mockToggle.mockClear()
-
-            // Enter key
-            const enterEvent = simulateKeyDown('Enter', mockToggle)
-            expect(enterEvent.preventDefault).toHaveBeenCalled()
-            expect(mockToggle).toHaveBeenCalled()
-
-            mockToggle.mockClear()
-
-            // Other key (should not trigger)
-            const otherEvent = simulateKeyDown('a', mockToggle)
-            expect(otherEvent.preventDefault).not.toHaveBeenCalled()
-            expect(mockToggle).not.toHaveBeenCalled()
-        })
-
-        test('container attributes generation works correctly', () => {
-            const generateContainerAttributes = (checked, ariaLabel, label, required, error, id, disabled) => {
-                return {
-                    role: 'switch',
-                    'aria-checked': checked,
-                    'aria-label': ariaLabel || label || 'Toggle switch',
-                    'aria-required': required,
-                    'aria-invalid': error,
-                    'aria-describedby': error && typeof error === 'string' ? `${id}-error` : undefined,
-                    tabIndex: disabled ? -1 : 0
-                }
-            }
-
-            const attrs = generateContainerAttributes(true, null, 'Test Label', false, false, 'test', false)
-            expect(attrs.role).toBe('switch')
-            expect(attrs['aria-checked']).toBe(true)
-            expect(attrs['aria-label']).toBe('Test Label')
-            expect(attrs.tabIndex).toBe(0)
-
-            const disabledAttrs = generateContainerAttributes(false, null, null, false, false, 'test', true)
-            expect(disabledAttrs.tabIndex).toBe(-1)
-        })
-
-        test('state synchronization works correctly', () => {
-            // Simular la sincronización de estado con useEffect
-            let internalState = false
-            
-            const syncState = (externalValue) => {
-                internalState = externalValue
-            }
-
-            // Estado inicial
-            syncState(false)
-            expect(internalState).toBe(false)
-
-            // Cambio externo
-            syncState(true)
-            expect(internalState).toBe(true)
-
-            // Otro cambio
-            syncState(false)
-            expect(internalState).toBe(false)
-        })
-    })
-})