From 838c202f8df3c2223414641be72e866dd340163f Mon Sep 17 00:00:00 2001 From: Max Date: Mon, 15 Nov 2021 14:56:29 -0500 Subject: [PATCH] Adding store actions to unit testing and changing radio button to take in string --- .../radioQuestion/radioQuestion.spec.js | 2 +- .../radioQuestion/radioQuestion.vue | 2 +- src/constants/storeActions.js | 2 ++ src/helpers/unitTestHelper.js | 9 ++++++--- src/layouts/selectYear/selectYear.spec.js | 7 ++++--- src/layouts/selectYear/selectYear.vue | 15 ++++++++------- src/uxComponents/radio/radio.spec.js | 4 ++-- src/uxComponents/radio/radio.vue | 4 ++-- 8 files changed, 26 insertions(+), 19 deletions(-) diff --git a/src/commonComponents/radioQuestion/radioQuestion.spec.js b/src/commonComponents/radioQuestion/radioQuestion.spec.js index 45a68e306..a9ba7476e 100644 --- a/src/commonComponents/radioQuestion/radioQuestion.spec.js +++ b/src/commonComponents/radioQuestion/radioQuestion.spec.js @@ -7,7 +7,7 @@ describe('radioQuestion.vue', () => { const wrapper = shallowMount(radioQuestion, { propsData: { questionText: 'Question Text', - answers: [2023, 2022, 2021], + answers: ['2023', '2022', '2021'], chooseAnswer: function(test){ console.log(test) } } }); diff --git a/src/commonComponents/radioQuestion/radioQuestion.vue b/src/commonComponents/radioQuestion/radioQuestion.vue index 7e8b16c55..ee4e53f8d 100644 --- a/src/commonComponents/radioQuestion/radioQuestion.vue +++ b/src/commonComponents/radioQuestion/radioQuestion.vue @@ -5,7 +5,7 @@
- +
diff --git a/src/constants/storeActions.js b/src/constants/storeActions.js index e358e4dab..5ef5a3157 100644 --- a/src/constants/storeActions.js +++ b/src/constants/storeActions.js @@ -1,5 +1,7 @@ const storeActions = { GET_ROUTE_INFO_ACTION: "getRouteInfo", + GET_YEARS: 'getYears', + GET_PAGE_DATA: 'getMockPageData', } export { storeActions } \ No newline at end of file diff --git a/src/helpers/unitTestHelper.js b/src/helpers/unitTestHelper.js index 54c1e4d0e..417b47e43 100644 --- a/src/helpers/unitTestHelper.js +++ b/src/helpers/unitTestHelper.js @@ -1,12 +1,14 @@ +import { storeActions } from "@/constants/storeActions"; + export function getMountOptions(mockData) { // Define our mocks to attached to the 'global' object for Vue/Jest. const mocks = {}; mocks.dispatchNonBlockingStoreAction = jest.fn(); mocks.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { - + let actionFilterResult = mockData.actionList.filter(x => x.actionName == actionName); - + if (actionFilterResult.length > 0 && actionFilterResult.length === 1) { return Promise.resolve({ @@ -14,7 +16,8 @@ export function getMountOptions(mockData) { }); } }); - + // Mock store actions from js file + mocks.storeActions = storeActions; const global = { mocks: mocks }; diff --git a/src/layouts/selectYear/selectYear.spec.js b/src/layouts/selectYear/selectYear.spec.js index 052dec4a6..27b84ed5f 100644 --- a/src/layouts/selectYear/selectYear.spec.js +++ b/src/layouts/selectYear/selectYear.spec.js @@ -1,16 +1,17 @@ import { shallowMount } from '@vue/test-utils'; import { nextTick } from 'vue' import { getMountOptions } from '@/helpers/unitTestHelper.js'; +import { storeActions } from '@/constants/storeActions.js' import selectYear from './selectYear.vue'; describe('selectYear.vue', () => { test("Should render the 'pageHeader.Text' data value 'text' prop value for the Header component, 'radioQuestion.Question' data value as 'questionText' prop value for the 'radioQuestion' component and 'years' values for 'answers' prop values for the 'radioQuestion' component.", async () => { - + // Arrange const mockDataAndAction = { actionList: [ { - actionName: "getMockPageData", + actionName: storeActions.GET_PAGE_DATA, data: { "Result": [ { @@ -29,7 +30,7 @@ describe('selectYear.vue', () => { } }, { - actionName: "getYears", + actionName: storeActions.GET_YEARS, data: ['2023', '2022', '2021'] } ] diff --git a/src/layouts/selectYear/selectYear.vue b/src/layouts/selectYear/selectYear.vue index 98c0a240f..3b633b005 100644 --- a/src/layouts/selectYear/selectYear.vue +++ b/src/layouts/selectYear/selectYear.vue @@ -35,13 +35,8 @@ export default { ...mapState(["slideTransition", "carImg", "blurImg", "style"]), }, mounted() { - this.dispatchNonBlockingStoreAction('getYears') - .then( (response) => { - this.years = response.data; - }); - - // Mocking Sitefinity data - this.dispatchNonBlockingStoreAction("getMockPageData", {relativeUrl: 'https://mockey.qa.sagaws.net/service/content/selectYear'}) + // Mocking Sitefinity data to (For Page Header and Radio Question) + this.dispatchNonBlockingStoreAction(this.storeActions.GET_PAGE_DATA, {relativeUrl: 'https://mockey.qa.sagaws.net/service/content/selectYear'}) .then( (response) => { response.data.Result.forEach((m) => { switch (m.Type) { @@ -59,6 +54,12 @@ export default { } }) }); + + // Getting Years list + this.dispatchNonBlockingStoreAction(this.storeActions.GET_YEARS) + .then( (response) => { + this.years = response.data; + }); }, methods: { selectYear(year) { diff --git a/src/uxComponents/radio/radio.spec.js b/src/uxComponents/radio/radio.spec.js index 3d3dd3704..ba59e2650 100644 --- a/src/uxComponents/radio/radio.spec.js +++ b/src/uxComponents/radio/radio.spec.js @@ -6,8 +6,8 @@ describe('radio.vue', () => { // Act const wrapper = shallowMount(radio, { propsData: { - value: 2023, - text: 12 + value: '2023', + text: '12' } }); diff --git a/src/uxComponents/radio/radio.vue b/src/uxComponents/radio/radio.vue index 0399d22c4..eaf181f39 100644 --- a/src/uxComponents/radio/radio.vue +++ b/src/uxComponents/radio/radio.vue @@ -22,8 +22,8 @@ export default { name: "radio", props: { - value: Number, - text: Number + value: String, + text: String }, data() { return {