import { getContentBoxStyle } from './dropdownHelper' ; describe ( 'dropdownHelper' , ( ) => { describe ( 'getConetentBoxStyle' , ( ) => { it ( 'returns bottom style when the bottom side of the trigger has enough space to display content' , ( ) => { const triggerRect = { top : 100 , bottom : 140 , left : 0 , right : 120 } ; const contentSize = { width : 300 , height : 400 } ; const windowSize = { width : 1000 , height : 800 } ; const scroll = { top : 0 , left : 0 } ; expect ( getContentBoxStyle ( triggerRect , contentSize , windowSize , scroll ) ) . toEqual ( { top : '135px' , left : '-5px' , maxHeight : '' , } ) ; } ) ; it ( 'returns top style when the bottom side of the trigger does not have enough space to display content but top side has' , ( ) => { const triggerRect = { top : 600 , bottom : 640 , left : 0 , right : 120 } ; const contentSize = { width : 300 , height : 400 } ; const windowSize = { width : 1000 , height : 800 } ; const scroll = { top : 0 , left : 0 } ; expect ( getContentBoxStyle ( triggerRect , contentSize , windowSize , scroll ) ) . toEqual ( { top : '205px' , left : '-5px' , maxHeight : '' , } ) ; } ) ; it ( 'return bottom style including maxHeight when both of the top and the bottom side does not have enough space to display content and the trigger is in the upper side of the screen' , ( ) => { const triggerRect = { top : 100 , bottom : 140 , left : 0 , right : 120 } ; const contentSize = { width : 300 , height : 400 } ; const windowSize = { width : 1000 , height : 370 } ; const scroll = { top : 0 , left : 0 } ; expect ( getContentBoxStyle ( triggerRect , contentSize , windowSize , scroll ) ) . toEqual ( { top : '135px' , left : '-5px' , maxHeight : '220px' , } ) ; } ) ; it ( 'return top style including maxHeight when both of the top and the bottom side does not have enough space to display content and the trigger is in the lower side of the screen' , ( ) => { const triggerRect = { top : 200 , bottom : 240 , left : 0 , right : 120 } ; const contentSize = { width : 300 , height : 400 } ; const windowSize = { width : 1000 , height : 370 } ; const scroll = { top : 0 , left : 0 } ; expect ( getContentBoxStyle ( triggerRect , contentSize , windowSize , scroll ) ) . toEqual ( { top : '15px' , left : '-5px' , maxHeight : '190px' , } ) ; } ) ; it ( 'returns left style when the trigger is in the right side of the screen' , ( ) => { const triggerRect = { top : 100 , bottom : 140 , left : 500 , right : 620 } ; const contentSize = { width : 300 , height : 400 } ; const windowSize = { width : 1000 , height : 800 } ; const scroll = { top : 0 , left : 0 } ; expect ( getContentBoxStyle ( triggerRect , contentSize , windowSize , scroll ) ) . toEqual ( { top : '135px' , left : '325px' , maxHeight : '' , } ) ; } ) ; it ( 'returns style considering scroll position' , ( ) => { const triggerRect = { top : 100 , bottom : 140 , left : 0 , right : 120 } ; const contentSize = { width : 300 , height : 400 } ; const windowSize = { width : 1000 , height : 800 } ; const scroll = { top : 500 , left : 600 } ; expect ( getContentBoxStyle ( triggerRect , contentSize , windowSize , scroll ) ) . toEqual ( { top : '635px' , left : '595px' , maxHeight : '' , } ) ; } ) ; } ) ; } ) ;