import React from 'react' ; import Enzyme , { ShallowWrapper } from 'enzyme' ; import EnzymeToJson from 'enzyme-to-json' ; import Adapter from 'enzyme-adapter-react-16' ; import TopPanel from './TopPanel' ; Enzyme . configure ( { adapter : new Adapter ( ) } ) ; jest . useFakeTimers ( ) ; const settingsButtonSelector = '#top-panel-settings-button' ; const connectedDevicesListButtonSelector = '#top-panel-connected-devices-list-button' ; describe ( '<TopPanel />' , ( ) => { let wrapper ; beforeEach ( ( ) => { wrapper = Enzyme . shallow ( < TopPanel />); } ) ; afterEach ( ( ) => { jest . clearAllMocks ( ) ; } ) ; it ( 'should match exact snapshot' , ( ) => { expect ( EnzymeToJson ( wrapper ) ) . toMatchSnapshot ( ) ; } ) ; describe ( 'when Settings button in top panel is clicked' , ( ) => { it ( 'should Settings Overlay props isSettingsOpen to true' , ( ) => { wrapper . find ( settingsButtonSelector ) . props ( ) . onClick ( ) ; const settingsOverlay = wrapper . props ( ) . children [ 1 ] ; expect ( settingsOverlay . props . isSettingsOpen ) . toBe ( true ) ; } ) ; } ) ; describe ( 'when Settings panel is opened and when its props.handleClose is called' , ( ) => { it ( 'should Settings Overlay props isSettingsOpen to false' , ( ) => { wrapper . find ( settingsButtonSelector ) . props ( ) . onClick ( ) ; const settingsOverlay = wrapper . props ( ) . children [ 1 ] ; settingsOverlay . props . handleClose ( ) ; const settingsOverlayAfterClose = wrapper . props ( ) . children [ 1 ] ; expect ( settingsOverlayAfterClose . props . isSettingsOpen ) . toBe ( false ) ; } ) ; } ) ; describe ( 'when Connected Devices button in top panel is clicked' , ( ) => { it ( 'should set Connected Devices List Drawer props isOpen to true' , ( ) => { wrapper . find ( connectedDevicesListButtonSelector ) . props ( ) . onClick ( ) ; const connectedDevicesListDrawer = wrapper . props ( ) . children [ 2 ] ; expect ( connectedDevicesListDrawer . props . isOpen ) . toBe ( true ) ; } ) ; } ) ; describe ( "when Connected Devices List Drawer is opened, and when it's props.handleToggle is called" , ( ) => { it ( 'should set Connected Devices List Drawer props isOpen to false' , ( ) => { wrapper . find ( connectedDevicesListButtonSelector ) . props ( ) . onClick ( ) ; const connectedDevicesListDrawer = wrapper . props ( ) . children [ 2 ] ; connectedDevicesListDrawer . props . handleToggle ( ) ; const connectedDevicesListDrawerAfter = wrapper . props ( ) . children [ 2 ] ; expect ( connectedDevicesListDrawerAfter . props . isOpen ) . toBe ( false ) ; } ) ; } ) ; } ) ;