No tengo mucha experiencia con Jest y estoy atascado escribiendo pruebas para este componente Hook:

 export default function useKeyUp(key: Key, onKeyUp: Function) { useEffect(() => { const handleUp = (event: KeyboardEvent) => { const { key: releasedKey } = event if (key === releasedKey) { if (onKeyUp) { onKeyUp() } } } window.addEventListener('keyup', handleUp) return () => { window.removeEventListener('keyup', handleUp) } }, [key, onKeyUp]) }

Así es como configuro la prueba:

 const TestComponent = ({key, callback}) => { useKeyUp(key, callback) return ( <div> test </div> ) } test('executes handler on Enter keydown and unsubscribes after unmount', () => { const callback = jest.fn() const testComponent = mount( <TestComponent key={'Enter'} callback={callback} />) document.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' })) expect(callback).toHaveBeenCalledTimes(1) document.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' })) expect(callback).toHaveBeenCalledTimes(1) testComponent.unmount() document.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' })) expect(callback).toHaveBeenCalledTimes(1) })

Falla en el paso uno, la función se ejecuta 0 veces en ese momento. Al depurarlo, veo que la clave no está undefined , pero ¿por qué, cuando la envío como accesorios al componente y la devolución de llamada funciona bien?