1import { mount, createWrapper } from '@vue/test-utils'; 2import AppNavigation from '@/components/AppNavigation'; 3import Vue from 'vue'; 4import { BootstrapVue } from 'bootstrap-vue'; 5 6describe('AppNavigation.vue', () => { 7 let wrapper; 8 Vue.use(BootstrapVue); 9 10 wrapper = mount(AppNavigation, { 11 mocks: { 12 $t: key => key 13 } 14 }); 15 16 it('should exist', async () => { 17 expect(wrapper.exists()).toBe(true); 18 }); 19 20 it('should render correctly', () => { 21 expect(wrapper.element).toMatchSnapshot(); 22 }); 23 24 it('should render with nav-container open', () => { 25 wrapper.vm.isNavigationOpen = true; 26 expect(wrapper.element).toMatchSnapshot(); 27 }); 28 29 it('Nav Overlay cliick should emit change:isNavigationOpen event', async () => { 30 const rootWrapper = createWrapper(wrapper.vm.$root); 31 const navOverlay = wrapper.find('#nav-overlay'); 32 navOverlay.trigger('click'); 33 await wrapper.vm.$nextTick(); 34 expect(rootWrapper.emitted('change:isNavigationOpen')).toBeTruthy(); 35 }); 36 37 it('toggle:navigation event should toggle isNavigation data prop value', async () => { 38 const rootWrapper = createWrapper(wrapper.vm.$root); 39 wrapper.vm.isNavigationOpen = false; 40 rootWrapper.vm.$emit('toggle:navigation'); 41 expect(wrapper.vm.isNavigationOpen).toBe(true); 42 rootWrapper.vm.$emit('toggle:navigation'); 43 expect(wrapper.vm.isNavigationOpen).toBe(false); 44 }); 45}); 46