1import { mount, createLocalVue, createWrapper } from '@vue/test-utils'; 2import Vue from 'vue'; 3import Vuex from 'vuex'; 4import AppHeader from '@/components/AppHeader'; 5 6// Silencing warnings about undefined Bootsrap-vue components 7Vue.config.silent = true; 8const localVue = createLocalVue(); 9localVue.use(Vuex); 10 11describe('AppHeader.vue', () => { 12 const actions = { 13 'global/getServerStatus': jest.fn(), 14 'eventLog/getEventLogData': jest.fn(), 15 'authentication/resetStoreState': jest.fn(), 16 'global/getSystemInfo': jest.fn(), 17 }; 18 19 // VueX requires that all modules be present, even if they aren't used 20 // in the test, so invent a Fake auth module and install it. 21 const modules = { 22 authentication: { 23 namespaced: true, 24 }, 25 }; 26 27 const store = new Vuex.Store({ actions, modules }); 28 const wrapper = mount(AppHeader, { 29 store, 30 localVue, 31 mocks: { 32 $t: (key) => key, 33 }, 34 }); 35 36 // Reset dispatch between tests so that multiple 37 // actions are not dispatched for each test 38 beforeEach(() => { 39 store.dispatch = jest.fn(); 40 }); 41 42 it('should exist', () => { 43 expect(wrapper.exists()).toBe(true); 44 }); 45 46 it('should render correctly', () => { 47 expect(wrapper.element).toMatchSnapshot(); 48 }); 49 50 it('refresh button click should emit refresh event', async () => { 51 wrapper.get('#app-header-refresh').trigger('click'); 52 await wrapper.vm.$nextTick(); 53 expect(wrapper.emitted('refresh')).toBeTruthy(); 54 }); 55 56 it('nav-trigger button click should emit toggle-navigation event', async () => { 57 const rootWrapper = createWrapper(wrapper.vm.$root); 58 wrapper.get('#app-header-trigger').trigger('click'); 59 await wrapper.vm.$nextTick(); 60 expect(rootWrapper.emitted('toggle-navigation')).toBeTruthy(); 61 }); 62 63 it('logout button should dispatch authentication/logout', async () => { 64 wrapper.get('[data-test-id="appHeader-link-logout"]').trigger('click'); 65 await wrapper.vm.$nextTick(); 66 expect(store.dispatch).toHaveBeenCalledTimes(1); 67 }); 68 69 it('change:isNavigationOpen event should set isNavigationOpen prop to false', async () => { 70 const rootWrapper = createWrapper(wrapper.vm.$root); 71 rootWrapper.vm.$emit('change-is-navigation-open', false); 72 await rootWrapper.vm.$nextTick(); 73 expect(wrapper.vm.isNavigationOpen).toEqual(false); 74 }); 75 76 describe('Created lifecycle hook', () => { 77 it('getSystemInfo should dispatch global/getSystemInfo', () => { 78 wrapper.vm.getSystemInfo(); 79 expect(store.dispatch).toHaveBeenCalledTimes(1); 80 }); 81 82 it('getEvents should dispatch eventLog/getEventLogData', () => { 83 wrapper.vm.getEvents(); 84 expect(store.dispatch).toHaveBeenCalledTimes(1); 85 }); 86 }); 87}); 88