diff --git a/src/layouts/order-confirmation/order-confirmation.spec.js b/src/layouts/order-confirmation/order-confirmation.spec.js new file mode 100644 index 00000000..79e4ea41 --- /dev/null +++ b/src/layouts/order-confirmation/order-confirmation.spec.js @@ -0,0 +1,125 @@ +// Components +import orderConfirmation from '@/layouts/order-confirmation/order-confirmation.vue'; + +// Supporting Files +import { getMountOptions } from '@/helpers/unit-test-helper.js'; +import { useMainStore } from '@/store/index.js'; +import settleAllPromises from '@/helpers/layout-helper.js'; +import { fetchCmsContentForPage } from '@/helpers/cms-content-helper'; +import { mount } from '@vue/test-utils'; +import { createTestingPinia } from '@pinia/testing'; + +jest.mock('@/helpers/layout-helper.js', () => jest.fn()); + +jest.mock('@/helpers/cms-content-helper', () => ({ + fetchCmsContentForPage: jest.fn() +})); + +const mockMixin = { + methods: { + getCmsContent: jest.fn().mockImplementation(() => ''), + setCmsContent: jest.fn() + } +}; + +const footerStub = { + render: () => {}, + methods: { + updateButtonText: jest.fn() + } +}; + +function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRun = () => {}) { + const mountOptions = getMountOptions({ + router: { + navigate: jest.fn(), + navigateToExternalUrl: jest.fn() + } + }); + + mountOptions.global.stubs = { + siteFooter: footerStub + }; + const testingPinia = createTestingPinia({ + initialState: { + main: mainInitialState + } + }); + useMainStore(testingPinia); + methodToRun(); + + mountOptions.global.plugins = [testingPinia]; + mountOptions.mixins = [mockMixin]; + mountOptions.data = () => ( + initialData + ); + + const apiResponses = { + supportingItems: [] + }; + const apiPromise = Promise.resolve(apiResponses); + settleAllPromises.mockImplementation(() => apiPromise); + fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); + + const wrapper = mount(orderConfirmation, mountOptions); + return { wrapper }; +} + +describe('OrderConfirmation.vue', () => { + describe('Rendering', () => { + test('Should render Site Header', () => { + // Arrange + const { wrapper } = getMountedComponent({}); + + // Act + const siteHeader = wrapper.findComponent({ ref: 'siteHeader' }); + + // Assert + expect(siteHeader.exists()).toBe(true); + }); + test('If Advanced flow, should display Site Footer', () => { + // Arrange + const carrierReturnUrl = 'testURL'; + const initialStore = { + issConfig: { + successReturnURL: carrierReturnUrl + } + }; + const { wrapper } = getMountedComponent(initialStore); + + // Act + const siteFooter = wrapper.findComponent({ ref: 'siteFooter' }); + + // Assert + expect(siteFooter.exists()).toBe(true); + }); + test('If Essential flow, should not display Site Footer', () => { + // Arrange + const { wrapper } = getMountedComponent(); + + // Act + const siteFooter = wrapper.findComponent({ ref: 'siteFooter' }); + + // Assert + expect(siteFooter.isVisible()).toBe(false); + }); + }); + describe('Navigation', () => { + test('If Advanced flow, forward button action navigates to carrier URL', () => { + // Arrange + const carrierReturnUrl = 'testURL'; + const initialStore = { + issConfig: { + successReturnURL: carrierReturnUrl + } + }; + const { wrapper } = getMountedComponent(initialStore); + + // Act + wrapper.vm.forwardButtonAction(); + + // Assert + expect(wrapper.vm.$router.navigateToExternalUrl).toHaveBeenCalledWith(carrierReturnUrl); + }); + }) +}); diff --git a/src/layouts/order-confirmation/order-confirmation.vue b/src/layouts/order-confirmation/order-confirmation.vue index 21abb3cf..cd06c4f1 100644 --- a/src/layouts/order-confirmation/order-confirmation.vue +++ b/src/layouts/order-confirmation/order-confirmation.vue @@ -6,15 +6,18 @@ @invalidSubmit="onInvalidSubmit">
Placeholder for order confirmation page