From cf3043c407d2db9564fb22a9dc07bed6403c40b9 Mon Sep 17 00:00:00 2001 From: Josh Dassinger Date: Tue, 24 Feb 2026 09:00:49 -0600 Subject: [PATCH] INSR-8549 Added getServiceabilityDetails changes to service-zip-modal-question --- .../service-zip-modal-question.spec.js | 130 +++++++++++------- .../service-zip-modal-question.vue | 5 +- 2 files changed, 84 insertions(+), 51 deletions(-) diff --git a/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.spec.js b/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.spec.js index 66efbc1c..cd875b42 100644 --- a/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.spec.js +++ b/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.spec.js @@ -1,9 +1,25 @@ import { mount } from '@vue/test-utils'; import crypto from 'crypto'; import serviceZipModalQuestion from '@/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.vue'; +import { getMountOptions } from '@/helpers/unit-test-helper'; +import { createTestingPinia } from '@pinia/testing'; +import { useMainStore } from '@/store'; +import settleAllPromises from '@/helpers/layout-helper'; +import { fetchCmsContentForPage } from '@/helpers/cms-content-helper'; +import baseMixin from '@/mixins/base-mixin'; global.crypto = crypto; +jest.mock('@/helpers/layout-helper.js', () => jest.fn()); + +// Mock fetchCmsContentForPage +jest.mock('@/helpers/cms-content-helper', () => ({ + fetchCmsContentForPage: jest.fn() +})); +jest.mock('@/global-methods', () => ({ + callHttpClient: jest.fn() +})); + jest.mock('@/digital-components/textbox-question/textbox-question', () => ({ getCmsContent: jest.fn((widgetName, cmsFieldName) => widgetName[cmsFieldName]) })); @@ -71,20 +87,48 @@ const mockModalCmsContent = { FooterText: 'Sample modal footer text here.' }; -const mockMixin = { - methods: { - getCmsContent: jest.fn((widgetName, cmsFieldName) => { - if (widgetName === linkWidgetName) { - return mockLinkCmsContent[cmsFieldName]; - } +function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRunAfterInitializingStore = () => {}, queryString = {}) { + const mountOptions = getMountOptions({ + router: { + navigate: jest.fn() + }, + route: { query: { issPage: 'page-name', ...queryString }, params: {} } + }); - if (widgetName === modalWidgetName) { - return mockModalCmsContent[cmsFieldName]; - } - return null; - }) - } -}; + const testingPinia = createTestingPinia({ + initialState: { + main: mainInitialState + } + }); + useMainStore(testingPinia); + methodToRunAfterInitializingStore(); + useMainStore().getServiceabilityDetails = jest.fn().mockReturnValue(mockGetServiceabilityDetails); + + mountOptions.global.plugins = [testingPinia]; + mountOptions.props = initialData + + const apiResponses = { cmsContent: {} }; + + settleAllPromises.mockImplementation(() => apiResponses); + fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); + + const wrapper = mount(serviceZipModalQuestion, mountOptions); + wrapper.vm.getCmsContent = jest.fn((widgetName, cmsFieldName) => { + if (widgetName === linkWidgetName) { + return mockLinkCmsContent[cmsFieldName]; + } + + if (widgetName === modalWidgetName) { + return mockModalCmsContent[cmsFieldName]; + } + return null; + }); + wrapper.vm.setCmsContent = jest.fn(); + wrapper.vm.$router.navigateWithSpinner = jest.fn(); + wrapper.vm.navigateBack = baseMixin.methods.navigateBack; + + return { wrapper }; +} describe('service-zip-modal-question.vue', () => { it('Initial state on load with existing location info', async () => { @@ -94,15 +138,13 @@ describe('service-zip-modal-question.vue', () => { zipCode: '43235' }; - const wrapper = mount(serviceZipModalQuestion, { - mixins: [mockMixin], - props: { + const { wrapper } = getMountedComponent({}, + { modelValue: serviceZipCodeQuestion, linkWidgetName, modalWidgetName - }, - attachTo: document.body - }); + } + ); // Assert expect(wrapper.html()).not.toEqual(expect.stringContaining(mockLinkCmsContent.BodyText)); @@ -117,15 +159,13 @@ describe('service-zip-modal-question.vue', () => { const zip = '43235'; - const wrapper = mount(serviceZipModalQuestion, { - mixins: [mockMixin], - props: { + const { wrapper } = getMountedComponent({}, + { modelValue: serviceZipCodeQuestion, mobileFeePart: {}, modalWidgetName - }, - attachTo: document.body - }); + } + ); // Act wrapper.vm.internalModel.zipCode = zip; @@ -147,14 +187,12 @@ describe('service-zip-modal-question.vue', () => { const zip = ''; - const wrapper = mount(serviceZipModalQuestion, { - mixins: [mockMixin], - props: { + const { wrapper } = getMountedComponent({}, + { modelValue: serviceZipCodeQuestion, modalWidgetName - }, - attachTo: document.body - }); + } + ); // Act wrapper.vm.internalModel.zipCode = zip; @@ -173,14 +211,12 @@ describe('service-zip-modal-question.vue', () => { const zip = '11111'; - const wrapper = mount(serviceZipModalQuestion, { - mixins: [mockMixin], - props: { + const { wrapper } = getMountedComponent({}, + { modelValue: serviceZipCodeQuestion, modalWidgetName - }, - attachTo: document.body - }); + } + ); // Act wrapper.vm.internalModel.zipCode = zip; @@ -199,14 +235,12 @@ describe('service-zip-modal-question.vue', () => { const zip = ''; - const wrapper = mount(serviceZipModalQuestion, { - mixins: [mockMixin], - props: { + const { wrapper } = getMountedComponent({}, + { modelValue: serviceZipCodeQuestion, modalWidgetName - }, - attachTo: document.body - }); + } + ); // Act wrapper.vm.internalModel.zipCode = zip; @@ -226,14 +260,12 @@ describe('service-zip-modal-question.vue', () => { const zip = '123'; - const wrapper = mount(serviceZipModalQuestion, { - mixins: [mockMixin], - props: { + const { wrapper } = getMountedComponent({}, + { modelValue: serviceZipCodeQuestion, modalWidgetName - }, - attachTo: document.body - }); + } + ); // Act wrapper.vm.internalModel.zipCode = zip; diff --git a/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.vue b/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.vue index 5227af29..b13a0b48 100644 --- a/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.vue +++ b/src/layouts/schedule-page/service-location/service-zip-modal-question/service-zip-modal-question.vue @@ -38,8 +38,9 @@ import textLink from '@/ux-components/text-link/text-link.vue'; import serviceZipQuestion from '@/layouts/schedule-page/service-location/service-zip-question/service-zip-question.vue'; import modal from '@/digital-components/modal/modal.vue'; import alert from '@/ux-components/alert/alert.vue'; +import { useMainStore } from '@/store'; -import { getServiceabilityDetails, getZipCodeData } from '@/helpers/service-location-helper'; +import { getZipCodeData } from '@/helpers/service-location-helper'; export default { name: 'service-zip-modal-question', @@ -153,7 +154,7 @@ export default { const serviceZipCode = this.internalModel.zipCode; // retrieve serviceability details - const serviceabilityDetails = await getServiceabilityDetails(serviceZipCode); + const serviceabilityDetails = await useMainStore().getServiceabilityDetails(serviceZipCode); // update content related to service zip code this.$emit('updated-serviceability', serviceabilityDetails.data);