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