diff options
Diffstat (limited to 'tests/unit/AppHeader.spec.js')
-rw-r--r-- | tests/unit/AppHeader.spec.js | 71 |
1 files changed, 38 insertions, 33 deletions
diff --git a/tests/unit/AppHeader.spec.js b/tests/unit/AppHeader.spec.js index 52e45437..f4e3626b 100644 --- a/tests/unit/AppHeader.spec.js +++ b/tests/unit/AppHeader.spec.js @@ -1,4 +1,4 @@ -import { shallowMount, createLocalVue, createWrapper } from '@vue/test-utils'; +import { mount, createLocalVue, createWrapper } from '@vue/test-utils'; import Vue from 'vue'; import Vuex from 'vuex'; import AppHeader from '@/components/AppHeader'; @@ -10,12 +10,12 @@ localVue.use(Vuex); describe('AppHeader.vue', () => { const actions = { - 'global/getHostStatus': sinon.spy(), - 'eventLog/getEventLogData': sinon.spy() + 'global/getHostStatus': jest.fn(), + 'eventLog/getEventLogData': jest.fn() }; const store = new Vuex.Store({ actions }); - const wrapper = shallowMount(AppHeader, { + const wrapper = mount(AppHeader, { store, localVue, mocks: { @@ -23,50 +23,55 @@ describe('AppHeader.vue', () => { } }); - // Reset spy for each test. Otherwise mutiple actions - // are dispatched in each test + // Reset dispatch between tests so that multiple + // actions are not dispatched for each test beforeEach(() => { - store.dispatch = sinon.spy(); + store.dispatch = jest.fn(); }); - describe('UI', () => { - it('should check if AppHeader exists', () => { - expect(wrapper.exists()).to.be.true; - }); + it('should exist', () => { + expect(wrapper.exists()).toBe(true); + }); - it('should check if the skip navigation link exists', () => { - expect(wrapper.get('.link-skip-nav').exists()).to.be.true; - }); + it('should render correctly', () => { + expect(wrapper.element).toMatchSnapshot(); + }); - it('refresh button click should emit refresh event', async () => { - wrapper.get('#app-header-refresh').trigger('click'); - await wrapper.vm.$nextTick(); - expect(wrapper.emitted().refresh).to.exist; - }); + it('refresh button click should emit refresh event', async () => { + wrapper.get('#app-header-refresh').trigger('click'); + await wrapper.vm.$nextTick(); + expect(wrapper.emitted('refresh')).toBeTruthy(); + }); - it('nav-trigger button click should emit toggle:navigation event', async () => { - const rootWrapper = createWrapper(wrapper.vm.$root); - wrapper.get('#app-header-trigger').trigger('click'); - await wrapper.vm.$nextTick(); - expect(rootWrapper.emitted()['toggle:navigation']).to.exist; - }); + it('nav-trigger button click should emit toggle:navigation event', async () => { + const rootWrapper = createWrapper(wrapper.vm.$root); + wrapper.get('#app-header-trigger').trigger('click'); + await wrapper.vm.$nextTick(); + expect(rootWrapper.emitted('toggle:navigation')).toBeTruthy(); + }); - it('logout button should dispatch authentication/logout', async () => { - wrapper.get('#app-header-logout').trigger('click'); - await wrapper.vm.$nextTick(); - expect(store.dispatch).calledWith('authentication/logout'); - }); + it('logout button should dispatch authentication/logout', async () => { + wrapper.get('#app-header-logout').trigger('click'); + await wrapper.vm.$nextTick(); + expect(store.dispatch).toHaveBeenCalledTimes(1); + }); + + it('change:isNavigationOpen event should set isNavigationOpen prop to false', async () => { + const rootWrapper = createWrapper(wrapper.vm.$root); + rootWrapper.vm.$emit('change:isNavigationOpen', false); + await rootWrapper.vm.$nextTick(); + expect(wrapper.vm.isNavigationOpen).toEqual(false); }); - describe('Methods', () => { + describe('Created lifecycle hook', () => { it('getHostInfo should dispatch global/getHostStatus', () => { wrapper.vm.getHostInfo(); - expect(store.dispatch).calledWith('global/getHostStatus'); + expect(store.dispatch).toHaveBeenCalledTimes(1); }); it('getEvents should dispatch eventLog/getEventLogData', () => { wrapper.vm.getEvents(); - expect(store.dispatch).calledWith('eventLog/getEventLogData'); + expect(store.dispatch).toHaveBeenCalledTimes(1); }); }); }); |