import { renderHook } from '@testing-library/react-hooks' ; import { getUseSelectPropsMock } from '../mocks' ; import useEnterOrSpaceKeydownHandler from './use-enter-or-space-keydown-handler' ; describe ( 'useEnterOrSpaceKeydownHandler' , ( ) => { it ( 'opens if can open' , ( ) => { const handleSelect = jest . fn ( ) ; const props = { ... getUseSelectPropsMock ( ) , handleSelect } ; const { result } = renderHook ( ( ) => useEnterOrSpaceKeydownHandler ( props ) ) ; const event = new KeyboardEvent ( 'keydown' ) as any ; result . current ( event ) ; expect ( props . selectState . open ) . toHaveBeenCalledTimes ( 1 ) ; } ) ; it ( 'does nothing if open and no option highlighted' , ( ) => { const handleSelect = jest . fn ( ) ; const props = { ... getUseSelectPropsMock ( ) , handleSelect } ; props . selectState . canOpen = false ; props . selectState . highlightedIndex = 0 ; props . selectState . filteredOptions = [ ] ; const { result } = renderHook ( ( ) => useEnterOrSpaceKeydownHandler ( props ) ) ; const event = new KeyboardEvent ( 'keydown' ) as any ; result . current ( event ) ; expect ( props . selectState . open ) . toHaveBeenCalledTimes ( 0 ) ; expect ( props . selectState . close ) . toHaveBeenCalledTimes ( 0 ) ; expect ( handleSelect ) . toHaveBeenCalledTimes ( 0 ) ; } ) ; it ( 'closes if open and an option selected' , ( ) => { const handleSelect = jest . fn ( ) ; const props = { ... getUseSelectPropsMock ( ) , handleSelect } ; props . selectState . canOpen = false ; props . selectState . highlightedIndex = 1 ; props . selectState . filteredOptions = [ { text : 'One' , value : '1' } , { text : 'Two' , value : '2' } , { text : 'Three' , value : '3' } ] ; const { result } = renderHook ( ( ) => useEnterOrSpaceKeydownHandler ( props ) ) ; const event = new KeyboardEvent ( 'keydown' ) as any ; result . current ( event ) ; expect ( props . selectState . close ) . toHaveBeenCalledTimes ( 1 ) ; expect ( handleSelect ) . toHaveBeenCalledWith ( event , { text : 'Two' , value : '2' } ) ; } ) ; } ) ;