diff --git a/jest.config.js b/jest.config.js index 7a6fcbc01..f4355ef93 100644 --- a/jest.config.js +++ b/jest.config.js @@ -18,7 +18,7 @@ module.exports = { testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"], coverageThreshold: { global: { - statements: 85, + statements: 87, }, }, }; diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index a6688a9af..02a50023c 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -1,16 +1,34 @@ -import { shallowMount, flushPromises } from "@vue/test-utils"; -import { getMountOptions } from "@/helpers/unit-test-helper.js"; +// Components import vehicleDamage from "@/layouts/vehicle-damage/vehicle-damage.vue"; import funnelHeader from "@/common-components/funnel-header/funnel-header"; import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; + +// Supporting Files import { settleAllPromises } from "@/helpers/layout-helper.js"; import baseMixin from "@/mixins/base-mixin"; +import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; import { nextTick } from "vue"; // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ - settleAllPromises: jest.fn(), + settleAllPromises: jest.fn(), +})); + +// Mock fetchCmsContentForPage +jest.mock("@/helpers/cms-content-helper", () => ({ + fetchCmsContentForPage: jest.fn(), +})); + +// Mock Store +jest.mock("@/store", () => ({ + getters: { + vehicle: { + carId: "C00000000" + } + } })); describe("vehicle-damage.vue", () => { @@ -18,7 +36,7 @@ describe("vehicle-damage.vue", () => { //Arrange const pageHeaderWidgetHeaderText = "Select Damage"; - const { wrapper, apiPromise } = setupMocks( { pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText }); + const { wrapper, apiPromise } = setupMocks({ pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText }); //Act vehicleDamage.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-damage" } }, undefined, (c) => c(wrapper.vm)); @@ -32,94 +50,120 @@ describe("vehicle-damage.vue", () => { }); describe("vehicle-damage.vue", () => { - test("Page logo image is initailized with api data", async (done) => { - - //Arrange - const SiteHeaderWidget = { - LogoImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", - } - const { wrapper, apiPromise } = setupMocks( { SiteHeaderWidget: SiteHeaderWidget}); - - //Act - vehicleDamage.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-damage" } }, undefined, (c) => c(wrapper.vm)); - - //Assert - apiPromise.finally(() => { - expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith(SiteHeaderWidget); - done(); - }); - }); - }); + test("Page logo image is initailized with api data", async (done) => { - describe("vehicle-damage.vue", () => { - test("Vehicle image is initailized with api data", async (done) => { - - //Arrange - const VehicleBannerWidget = { - GenericVehicleImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", - } - const { wrapper, apiPromise } = setupMocks( { VehicleBannerWidget: VehicleBannerWidget}); - - //Act - vehicleDamage.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-damage" } }, undefined, (c) => c(wrapper.vm)); - - //Assert - apiPromise.finally(() => { - expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith(VehicleBannerWidget); - done(); - }); + //Arrange + const SiteHeaderWidget = { + LogoImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + } + const { wrapper, apiPromise } = setupMocks({ SiteHeaderWidget: SiteHeaderWidget }); + + //Act + vehicleDamage.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-damage" } }, undefined, (c) => c(wrapper.vm)); + + //Assert + apiPromise.finally(() => { + expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith(SiteHeaderWidget); + done(); }); }); +}); + +describe("vehicle-damage.vue", () => { + test("Vehicle image is initailized with api data", async (done) => { + + //Arrange + const VehicleBannerWidget = { + GenericVehicleImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", + } + const { wrapper, apiPromise } = setupMocks({ VehicleBannerWidget: VehicleBannerWidget }); + + //Act + vehicleDamage.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-damage" } }, undefined, (c) => c(wrapper.vm)); + + //Assert + apiPromise.finally(() => { + expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith(VehicleBannerWidget); + done(); + }); + }); +}); + +describe("vehicle-damage.vue", () => { + test("CarId set, arePagePrerequisitesValid should be true ", async () => { + + //Arrange + const { wrapper } = setupMocks({}); + + //Act + vehicleDamage.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-damage" } }, undefined, (c) => c(wrapper.vm)); + + let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); + await nextTick(); + + //Assert + expect(arePagePrerequisitesValid).toBe(true); + }); +}); function setupMocks({ - pageHeaderWidgetHeaderText = {}, - mountOptionsMockData = {}, - }) { - - //Mock api responses - baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn(); - baseMixin.methods.dispatchNonBlockingStoreAction.mockImplementation(() => { - return Promise.resolve({ data: ['Front Window', 'Back Window', 'Side Window'] }); - }); - const apiResponses = { - cmsContent: { - FunnelSubHeaderWidget: pageHeaderWidgetHeaderText, - VehicleBannerWidget: - { - GenericVehicleImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", - }, - FunnelHeaderWidget: - { - LogoImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", - }, + pageHeaderWidgetHeaderText = {}, + mountOptionsMockData = {}, +}) { + + //Mock api responses + baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn(); + baseMixin.methods.dispatchNonBlockingStoreAction.mockImplementation(() => { + return Promise.resolve({ data: ['Front Window', 'Back Window', 'Side Window'] }); + }); + const apiResponses = { + cmsContent: { + FunnelSubHeaderWidget: pageHeaderWidgetHeaderText, + VehicleBannerWidget: + { + GenericVehicleImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", }, - damageOptions: ['Front Window', 'Back Window', 'Side Window'], - }; - const apiPromise = Promise.resolve(apiResponses); - settleAllPromises.mockImplementation(() => apiPromise); - - //Mock damage initialize methods - funnelHeader.methods = { - initializeComponent: jest.fn(), - }; - vehicleBanner.methods = { - initializeComponent: jest.fn(), - }; - funnelSubHeader.methods = { - initializeComponent: jest.fn(), - }; - const mountOptions = getMountOptions(mountOptionsMockData); - const wrapper = shallowMount(vehicleDamage, mountOptions); - const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" }); - funnelHeaderWrapper.vm.initializeComponent = funnelHeader.methods.initializeComponent; - const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" }); - vehicleBannerWrapper.vm.initializeComponent = vehicleBanner.methods.initializeComponent; - const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader" }); - funnelSubHeaderWrapper.vm.initializeComponent = funnelSubHeader.methods.initializeComponent; - - return { wrapper, apiPromise }; - } \ No newline at end of file + FunnelHeaderWidget: + { + LogoImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + }, + }, + damageOptions: ['Front Window', 'Back Window', 'Side Window'], + }; + + const apiPromise = Promise.resolve(apiResponses); + + settleAllPromises.mockImplementation(() => apiPromise); + fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); + + //Mock damage initialize methods + funnelHeader.methods = { + initializeComponent: jest.fn(), + }; + + vehicleBanner.methods = { + initializeComponent: jest.fn(), + }; + + funnelSubHeader.methods = { + initializeComponent: jest.fn(), + }; + + const mountOptions = getMountOptions(mountOptionsMockData); + const wrapper = shallowMount(vehicleDamage, mountOptions); + + const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" }); + funnelHeaderWrapper.vm.initializeComponent = funnelHeader.methods.initializeComponent; + + const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" }); + vehicleBannerWrapper.vm.initializeComponent = vehicleBanner.methods.initializeComponent; + + const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader" }); + funnelSubHeaderWrapper.vm.initializeComponent = funnelSubHeader.methods.initializeComponent; + + return { wrapper, apiPromise }; +} \ No newline at end of file diff --git a/src/layouts/vehicle-make/vehicle-make.spec.js b/src/layouts/vehicle-make/vehicle-make.spec.js index 41a7939ad..8043b94d7 100644 --- a/src/layouts/vehicle-make/vehicle-make.spec.js +++ b/src/layouts/vehicle-make/vehicle-make.spec.js @@ -9,11 +9,11 @@ import { settleAllPromises } from "@/helpers/layout-helper.js"; import { nextTick } from "vue"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; -// Mock Store + jest.mock("@/store", () => ({ getters: { - vehicle: { - year: 2019, + vehicle: { + year: 2019 } } })); @@ -28,6 +28,9 @@ jest.mock("@/helpers/layout-helper.js", () => ({ settleAllPromises: jest.fn(), })); +beforeEach(() => { + jest.resetModules(); +}); describe("vehicle-make.vue", () => { test("Make question component is initized with api data", async (done) => { @@ -40,7 +43,7 @@ describe("vehicle-make.vue", () => { makeQuestionInitialData: makeQuestionInitialData, }); - + //Act vehicleMake.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); @@ -58,7 +61,7 @@ describe("vehicle-make.vue", () => { //Arrange const pageHeaderWidgetHeaderText = "Select a make to get started"; const { wrapper, apiPromise } = setupMocks({ pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText }); - + //Act vehicleMake.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); @@ -79,7 +82,7 @@ describe("vehicle-make.vue", () => { "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", } const { wrapper, apiPromise } = setupMocks({ SiteHeaderWidget: SiteHeaderWidget }); - + //Act vehicleMake.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); @@ -100,7 +103,7 @@ describe("vehicle-make.vue", () => { "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", } const { wrapper, apiPromise } = setupMocks({ VehicleBannerWidget: VehicleBannerWidget }); - + //Act vehicleMake.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); @@ -124,7 +127,7 @@ describe("vehicle-make.vue", () => { }, }, }); - + //Act vehicleMake.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); wrapper.vm.backButtonAction(); @@ -139,13 +142,10 @@ describe("vehicle-make.vue", () => { }); describe("vehicle-make.vue", () => { - test("arePagePrerequisitesValid", async (done) => { + test("Year set, arePagePrerequisitesValid should be true ", async () => { //Arrange - const { wrapper, apiPromise } = setupMocks({ - pageHeaderWidgetHeaderText: "Select a make to get started", - mountOptionsMockData: {}, - }); + const { wrapper } = setupMocks({}); //Act vehicleMake.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); @@ -154,10 +154,7 @@ describe("vehicle-make.vue", () => { await nextTick(); //Assert - apiPromise.finally(() => { - expect(arePagePrerequisitesValid).toBe(true); - done(); - }); + expect(arePagePrerequisitesValid).toBe(true); }); }); @@ -187,7 +184,7 @@ function setupMocks({ }, makeQuestionInitialData: makeQuestionInitialData, }; - + const apiPromise = Promise.resolve(apiResponses); fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); diff --git a/src/layouts/vehicle-make/vehicle-make.vue b/src/layouts/vehicle-make/vehicle-make.vue index ee90b2d36..111b16e5f 100644 --- a/src/layouts/vehicle-make/vehicle-make.vue +++ b/src/layouts/vehicle-make/vehicle-make.vue @@ -78,7 +78,6 @@ export default { this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route); }, arePagePrerequisitesValid() { - console.log(store.getters.vehicle); return store.getters.vehicle.year !== null; }, }, diff --git a/src/layouts/vehicle-model/vehicle-model.spec.js b/src/layouts/vehicle-model/vehicle-model.spec.js index 861303ac8..1187220b7 100644 --- a/src/layouts/vehicle-model/vehicle-model.spec.js +++ b/src/layouts/vehicle-model/vehicle-model.spec.js @@ -1,25 +1,45 @@ -import { shallowMount, flushPromises } from "@vue/test-utils"; -import { getMountOptions } from "@/helpers/unit-test-helper.js"; +// Components import vehicleModel from "@/layouts/vehicle-model/vehicle-model.vue"; import modelQuestion from "@/layouts/vehicle-model/model-question/model-question"; import funnelHeader from "@/common-components/funnel-header/funnel-header"; import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; + +// Supporting files import { settleAllPromises } from "@/helpers/layout-helper.js"; +import { shallowMount, flushPromises } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; import { nextTick } from "vue"; +import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; + // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ settleAllPromises: jest.fn(), })); + +// Mock fetchCmsContentForPage +jest.mock("@/helpers/cms-content-helper", () => ({ + fetchCmsContentForPage: jest.fn(), +})); + +// Mock Store +jest.mock("@/store", () => ({ + getters: { + vehicle: { + make: "Acura" + } + } +})); + describe("vehicle-model.vue", () => { test("Model question component is initized with api data", async (done) => { //Arange const buttonQuestionContent = { QuestionText: "What model is your vehicle?" }; const modelQuestionInitialData = ["accord", "civic", "insight"]; - const { wrapper, apiPromise } = setupMocks( { - buttonQuestionContent: buttonQuestionContent, + const { wrapper, apiPromise } = setupMocks({ + buttonQuestionContent: buttonQuestionContent, modelQuestionInitialData: modelQuestionInitialData, - } ); + }); //Act vehicleModel.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-model" } }, undefined, (c) => c(wrapper.vm)); //Assert @@ -33,7 +53,7 @@ describe("vehicle-model.vue", () => { test("Page header is initailized with api data", async (done) => { //Arrange const pageHeaderWidgetHeaderText = "Select a model to get started"; - const { wrapper, apiPromise } = setupMocks( { pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText }); + const { wrapper, apiPromise } = setupMocks({ pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText }); //Act vehicleModel.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-model" } }, undefined, (c) => c(wrapper.vm)); //Assert @@ -50,7 +70,7 @@ describe("vehicle-model.vue", () => { LogoImage: "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", } - const { wrapper, apiPromise } = setupMocks( { SiteHeaderWidget: SiteHeaderWidget}); + const { wrapper, apiPromise } = setupMocks({ SiteHeaderWidget: SiteHeaderWidget }); //Act vehicleModel.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-model" } }, undefined, (c) => c(wrapper.vm)); //Assert @@ -67,7 +87,7 @@ describe("vehicle-model.vue", () => { GenericVehicleImage: "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", } - const { wrapper, apiPromise } = setupMocks( { VehicleBannerWidget: VehicleBannerWidget}); + const { wrapper, apiPromise } = setupMocks({ VehicleBannerWidget: VehicleBannerWidget }); //Act vehicleModel.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-model" } }, undefined, (c) => c(wrapper.vm)); //Assert @@ -80,7 +100,7 @@ describe("vehicle-model.vue", () => { describe("vehicle-model.vue", () => { test("BackButtonAction triggers a router.navigate change", async (done) => { //Arrange - const { wrapper, apiPromise } = setupMocks( { + const { wrapper, apiPromise } = setupMocks({ pageHeaderWidgetHeaderText: "Select a model to get started", mountOptionsMockData: { router: { @@ -99,6 +119,23 @@ describe("vehicle-model.vue", () => { }); }); }); +describe("vehicle-model.vue", () => { + test("Make set, arePagePrerequisitesValid should be true ", async () => { + + //Arrange + const { wrapper } = setupMocks({}); + + //Act + vehicleModel.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-model" } }, undefined, (c) => c(wrapper.vm)); + + let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); + await nextTick(); + + //Assert + expect(arePagePrerequisitesValid).toBe(true); + }); +}); + function setupMocks({ buttonQuestionContent = {}, modelQuestionInitialData = {}, @@ -110,21 +147,24 @@ function setupMocks({ cmsContent: { FunnelSubHeaderWidget: pageHeaderWidgetHeaderText, VehicleModelQuestion: buttonQuestionContent, - VehicleBannerWidget: - { - GenericVehicleImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", - }, - FunnelHeaderWidget: - { - LogoImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", - }, + VehicleBannerWidget: + { + GenericVehicleImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", + }, + FunnelHeaderWidget: + { + LogoImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + }, }, modelQuestionInitialData: modelQuestionInitialData, }; const apiPromise = Promise.resolve(apiResponses); + settleAllPromises.mockImplementation(() => apiPromise); + fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); + //Mock model question methods modelQuestion.methods = { loadInitialData: jest.fn(), @@ -141,13 +181,18 @@ function setupMocks({ }; const mountOptions = getMountOptions(mountOptionsMockData); const wrapper = shallowMount(vehicleModel, mountOptions); + const modelQuestionWrapper = wrapper.findComponent({ name: "modelQuestion" }); modelQuestionWrapper.vm.initializeComponent = modelQuestion.methods.initializeComponent; + const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" }); funnelHeaderWrapper.vm.initializeComponent = funnelHeader.methods.initializeComponent; + const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" }); vehicleBannerWrapper.vm.initializeComponent = vehicleBanner.methods.initializeComponent; + const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader" }); funnelSubHeaderWrapper.vm.initializeComponent = funnelSubHeader.methods.initializeComponent; + return { wrapper, apiPromise }; } \ No newline at end of file diff --git a/src/layouts/vehicle-style/vehicle-style.spec.js b/src/layouts/vehicle-style/vehicle-style.spec.js index 31c1b2487..d408ceb9d 100644 --- a/src/layouts/vehicle-style/vehicle-style.spec.js +++ b/src/layouts/vehicle-style/vehicle-style.spec.js @@ -1,19 +1,37 @@ -import { shallowMount, flushPromises } from "@vue/test-utils"; -import { getMountOptions } from "@/helpers/unit-test-helper.js"; -import { storeActions } from "@/constants/store-actions"; +// Components import vehicleStyle from "@/layouts/vehicle-style/vehicle-style.vue"; import funnelHeader from "@/common-components/funnel-header/funnel-header"; import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; import styleQuestion from "@/layouts/vehicle-style/style-question/style-question"; + +// Supporting files import { settleAllPromises } from "@/helpers/layout-helper.js"; import { nextTick } from "vue"; +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; +import { storeActions } from "@/constants/store-actions"; +import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ settleAllPromises: jest.fn(), })); +// Mock fetchCmsContentForPage +jest.mock("@/helpers/cms-content-helper", () => ({ + fetchCmsContentForPage: jest.fn(), +})); + +// Mock Store +jest.mock("@/store", () => ({ + getters: { + vehicle: { + model: "TL" + } + } +})); + describe("vehicle-style.vue", () => { test("Style question component is initized with api data", async (done) => { @@ -162,6 +180,22 @@ describe("vehicle-style.vue", () => { }); }); +describe("vehicle-style.vue", () => { + test("Model set, arePagePrerequisitesValid should be true ", async () => { + + //Arrange + const { wrapper } = setupMocks({}); + + //Act + vehicleStyle.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-style" } }, undefined, (c) => c(wrapper.vm)); + + let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); + await nextTick(); + + //Assert + expect(arePagePrerequisitesValid).toBe(true); + }); +}); function setupMocks({ vehicleStyleQuestionCmsContent = {}, styleQuestionInitialData = {}, @@ -187,31 +221,42 @@ function setupMocks({ }, styleQuestionInitialData: styleQuestionInitialData, }; + const apiPromise = Promise.resolve(apiResponses); + settleAllPromises.mockImplementation(() => apiPromise); + fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); //Mock style question methods styleQuestion.methods = { loadInitialData: jest.fn(), initializeComponent: jest.fn(), }; + funnelHeader.methods = { initializeComponent: jest.fn(), }; + vehicleBanner.methods = { initializeComponent: jest.fn(), }; + funnelSubHeader.methods = { initializeComponent: jest.fn(), }; + const mountOptions = getMountOptions(mountOptionsMockData); const wrapper = shallowMount(vehicleStyle, mountOptions); + const styleQuestionWrapper = wrapper.findComponent({ name: "styleQuestion" }); styleQuestionWrapper.vm.initializeComponent = styleQuestion.methods.initializeComponent; + const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" }); funnelHeaderWrapper.vm.initializeComponent = funnelHeader.methods.initializeComponent; + const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" }); vehicleBannerWrapper.vm.initializeComponent = vehicleBanner.methods.initializeComponent; + const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader" }); funnelSubHeaderWrapper.vm.initializeComponent = funnelSubHeader.methods.initializeComponent; diff --git a/src/layouts/vehicle-year/vehicle-year.spec.js b/src/layouts/vehicle-year/vehicle-year.spec.js index df0668c31..c386bf4d4 100644 --- a/src/layouts/vehicle-year/vehicle-year.spec.js +++ b/src/layouts/vehicle-year/vehicle-year.spec.js @@ -77,6 +77,24 @@ describe("vehicle-year.vue", () => { }); }); + +describe("vehicle-year.vue", () => { + test("arePagePrerequisitesValid should be true ", async () => { + + //Arrange + const { wrapper } = setupMocks({}); + + //Act + vehicleYear.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-make" } }, undefined, (c) => c(wrapper.vm)); + + let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); + await nextTick(); + + //Assert + expect(arePagePrerequisitesValid).toBe(true); + }); +}); + function setupMocks({ vehicleYearQuestionCmsContent = {}, yearQuestionInitialData = {}, diff --git a/src/mixins/base-mixin.spec.js b/src/mixins/base-mixin.spec.js index e9ccbdc5b..42281c4d7 100644 --- a/src/mixins/base-mixin.spec.js +++ b/src/mixins/base-mixin.spec.js @@ -1,6 +1,8 @@ import baseMixin from "@/mixins/base-mixin"; import { storeActions } from "@/constants/store-actions.js"; import { widgetNames } from "@/constants/widget-names.js"; +import { storeMutations } from "@/constants/store-mutations.js"; +import { navigationScenarios } from "@/router/router-constants/navigation-scenarios"; import store from "@/store"; describe("baseMixin.js", () => { @@ -23,7 +25,54 @@ describe("baseMixin.js", () => { expect(store.dispatch).toBeCalledWith(type, payload); }); + + test("computed: storeActions should be equal to import object", () => { + // Arrange + const mixIn = getMixInInstance({}); + + // Act + let storeActionsForTest = mixIn.computed.storeActions(); + + // Assert + expect(storeActionsForTest).toEqual(storeActions); + }); + + test("computed: storeMutations should be equal to import object", () => { + // Arrange + const mixIn = getMixInInstance({}); + + // Act + let storeMutationsForTest = mixIn.computed.storeMutations(); + + // Assert + expect(storeMutationsForTest).toEqual(storeMutations); + }); + + test("computed: navigationScenarios should be equal to import object", () => { + // Arrange + const mixIn = getMixInInstance({}); + + // Act + let navigationScenariosForTest = mixIn.computed.navigationScenarios(); + + // Assert + expect(navigationScenariosForTest).toEqual(navigationScenarios); + }); + + test("computed: widgetNames should be equal to import object", () => { + // Arrange + const mixIn = getMixInInstance({}); + + // Act + let widgetNamesForTest = mixIn.computed.widgetNames(); + + // Assert + expect(widgetNamesForTest).toEqual(widgetNames); + }); + }); + + function getMixInInstance({ isDispatchSuccess = true }) { // Mock Store const storeDispatch = jest.fn();