From 913be03e9475a84e968ee244f0c3bb7d51af7af6 Mon Sep 17 00:00:00 2001 From: carlosjr Date: Wed, 20 Apr 2022 13:58:53 +0200 Subject: [PATCH] front unit tests amends for darkMode and setUser modifications --- src/components/__tests__/UserPanel.spec.js | 61 +++++++++++--------- src/composables/__tests__/useRole.spec.js | 19 +++++- src/composables/__tests__/useSession.spec.js | 53 +++++++++-------- src/composables/useRole.js | 2 +- src/composables/useSession.js | 2 +- src/composables/useState.js | 6 +- src/pages/Login/__tests__/Login.spec.js | 11 +++- 7 files changed, 93 insertions(+), 61 deletions(-) diff --git a/src/components/__tests__/UserPanel.spec.js b/src/components/__tests__/UserPanel.spec.js index 3d5182890..4283ce3ab 100644 --- a/src/components/__tests__/UserPanel.spec.js +++ b/src/components/__tests__/UserPanel.spec.js @@ -10,38 +10,47 @@ jest.mock('vue-router', () => ({ }), })); -describe('UserPanel', () => { - describe('onMounted', () => { - it.only('should define the user into state', async () => { - const userMock = { - user: { - id: 1, - name: 'myName', - nickname: 'myNickName' - }, - roles: [] - } - jest.spyOn(axios, 'get').mockResolvedValue({ data: userMock }); - const { vm } = createWrapper(UserPanel); +describe('UserPanel onMounted()', () => { + it('should define the user into state', async () => { + const userMock = { + user: { + id: 1, + name: 'myName', + nickname: 'myNickName', + lang: 'en', + userConfig: { + darkMode: 'false' + } + }, + roles: [] + } + const expectedUserData = { + id: 1, + name: 'myName', + nickname: 'myNickName', + lang: 'en', + darkMode: 'false' + } - await flushPromises() + jest.spyOn(axios, 'get').mockResolvedValue({ data: userMock }); + const { vm } = createWrapper(UserPanel); - const expectedUser = expect.objectContaining(userMock.user) - expect(vm.state.getUser().value).toEqual(expectedUser); - }); + await flushPromises() - it('should logout and notify the expected error', async () => { - jest.spyOn(axios, 'get').mockRejectedValue(new Error('error')); + expect(vm.state.getUser().value).toEqual(expectedUserData); + }); - const { vm } = createWrapper(UserPanel); + it('should logout and notify the expected error', async () => { + jest.spyOn(axios, 'get').mockRejectedValue(new Error('error')); - jest.spyOn(vm.quasar, 'notify'); + const { vm } = createWrapper(UserPanel); - await flushPromises() + jest.spyOn(vm.quasar, 'notify'); - expect(vm.quasar.notify).toHaveBeenCalledWith(expect.objectContaining( - { 'type': 'negative' } - )); - }); + await flushPromises() + + expect(vm.quasar.notify).toHaveBeenCalledWith(expect.objectContaining( + { 'type': 'negative' } + )); }); }); diff --git a/src/composables/__tests__/useRole.spec.js b/src/composables/__tests__/useRole.spec.js index bf2129107..562456669 100644 --- a/src/composables/__tests__/useRole.spec.js +++ b/src/composables/__tests__/useRole.spec.js @@ -19,10 +19,25 @@ describe('useRole', () => { } } ]; - const expectedUser = { id: 1 } + const fetchedUser = { + id: 999, + name: `T'Challa`, + nickname: 'Black Panther', + lang: 'en', + userConfig: { + darkMode: false, + } + } + const expectedUser = { + id: 999, + name: `T'Challa`, + nickname: 'Black Panther', + lang: 'en', + darkMode: false, + } const expectedRoles = ['salesPerson', 'admin'] jest.spyOn(axios, 'get').mockResolvedValue({ - data: { roles: rolesData, user: expectedUser } + data: { roles: rolesData, user: fetchedUser } }); jest.spyOn(role.state, 'setUser'); diff --git a/src/composables/__tests__/useSession.spec.js b/src/composables/__tests__/useSession.spec.js index 52b31f59c..387c34fae 100644 --- a/src/composables/__tests__/useSession.spec.js +++ b/src/composables/__tests__/useSession.spec.js @@ -36,11 +36,15 @@ describe('session', () => { id: 999, name: `T'Challa`, nickname: 'Black Panther', + lang: 'en', + darkMode: false, } const expectedUser = { id: 0, name: '', nickname: '', + lang: '', + darkMode: null, } let user = state.getUser(); @@ -60,20 +64,29 @@ describe('session', () => { }); describe('login', () => { - it('should fetch the user roles and then set token in the sessionStorage', async () => { - const rolesData = [ - { - role: { - name: 'salesPerson' - } - }, - { - role: { - name: 'admin' - } + const expectedUser = { + id: 999, + name: `T'Challa`, + nickname: 'Black Panther', + lang: 'en', + userConfig: { + darkMode: false, + } + } + const rolesData = [ + { + role: { + name: 'salesPerson' } - ]; - const expectedUser = { id: 1 } + }, + { + role: { + name: 'admin' + } + } + ]; + + it('should fetch the user roles and then set token in the sessionStorage', async () => { const expectedRoles = ['salesPerson', 'admin'] jest.spyOn(axios, 'get').mockResolvedValue({ data: { roles: rolesData, user: expectedUser } @@ -96,20 +109,6 @@ describe('session', () => { }); it('should fetch the user roles and then set token in the localStorage', async () => { - - const rolesData = [ - { - role: { - name: 'salesPerson' - } - }, - { - role: { - name: 'admin' - } - } - ]; - const expectedUser = { id: 1 } const expectedRoles = ['salesPerson', 'admin'] jest.spyOn(axios, 'get').mockResolvedValue({ data: { roles: rolesData, user: expectedUser } diff --git a/src/composables/useRole.js b/src/composables/useRole.js index 14ccd957f..84e46b319 100644 --- a/src/composables/useRole.js +++ b/src/composables/useRole.js @@ -12,7 +12,7 @@ export function useRole() { id: data.user.id, name: data.user.name, nickname: data.user.nickname, - language: data.user.lang || 'es', + lang: data.user.lang || 'es', darkMode: data.user.userConfig.darkMode, } state.setUser(userData); diff --git a/src/composables/useSession.js b/src/composables/useSession.js index e844145af..62cb8a28b 100644 --- a/src/composables/useSession.js +++ b/src/composables/useSession.js @@ -30,7 +30,7 @@ export function useSession() { id: 0, name: '', nickname: '', - language: '', + lang: '', darkMode: null, }); } diff --git a/src/composables/useState.js b/src/composables/useState.js index 652f1d64a..d4f7994bc 100644 --- a/src/composables/useState.js +++ b/src/composables/useState.js @@ -4,7 +4,7 @@ const user = ref({ id: 0, name: '', nickname: '', - language: '', + lang: '', darkMode: null, }); @@ -19,7 +19,7 @@ export function useState() { id: user.value.id, name: user.value.name, nickname: user.value.nickname, - language: user.value.language, + lang: user.value.lang, darkMode: user.value.darkMode, }; }); @@ -30,7 +30,7 @@ export function useState() { id: data.id, name: data.name, nickname: data.nickname, - language: data.lang, + lang: data.lang, darkMode: data.darkMode, }; } diff --git a/src/pages/Login/__tests__/Login.spec.js b/src/pages/Login/__tests__/Login.spec.js index 36323d1ed..970ff138f 100644 --- a/src/pages/Login/__tests__/Login.spec.js +++ b/src/pages/Login/__tests__/Login.spec.js @@ -18,8 +18,17 @@ describe('Login', () => { }); it('should successfully set the token into session', async () => { + const expectedUser = { + id: 999, + name: `T'Challa`, + nickname: 'Black Panther', + lang: 'en', + userConfig: { + darkMode: false, + } + } jest.spyOn(axios, 'post').mockResolvedValue({ data: { token: 'token' } }); - jest.spyOn(axios, 'get').mockResolvedValue({ data: { roles: [], user: { id: 1 } } }); + jest.spyOn(axios, 'get').mockResolvedValue({ data: { roles: [], user: expectedUser } }); jest.spyOn(vm.quasar, 'notify') expect(vm.session.getToken()).toEqual('');