diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index 7a4f3e6be..fe567ef55 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -119,7 +119,7 @@ export default { methods: { arePagePrerequisitesValid() { return store.getters.vehicle.carId !== null; - }, + }, resetDependentState() { store.dispatch(storeActions.RESET_PARTS_STATE_AND_DEPENDENCIES); }, diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js index ec687023c..a6ef4e586 100644 --- a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js @@ -4,6 +4,9 @@ import glassPartQuestion from "@/layouts/vehicle-parts/glass-part-question/glass import store from "@/store"; jest.mock("@/store", () => { return {}; }, { virtual: true }); +store.getters = { + pageData: jest.fn() +}; const featureListData = { colorAnswersProp: [ @@ -93,9 +96,9 @@ describe("glass-part-question.vue", () => { //Act await wrapper.vm.$nextTick(); - wrapper.setData({selectedTint: {"Rear-Stationary" : 'Green Tint' } }); + wrapper.setData({ selectedTint: { "Rear-Stationary": 'Green Tint' } }); - expect(wrapper.vm.selectedTint).toStrictEqual({"Rear-Stationary": 'Green Tint'}); + expect(wrapper.vm.selectedTint).toStrictEqual({ "Rear-Stationary": 'Green Tint' }); await wrapper.vm.ResetTintAndPartSelections(); expect(wrapper.vm.selectedTint).toStrictEqual({}); @@ -107,7 +110,19 @@ describe("glass-part-question.vue", () => { function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelValueProp }) { //Mock store - const mountOptions = getMountOptions({}); + store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: {}}); + store.getters.lineItems = { glassParts: {} } + + const mountOptions = getMountOptions({ + store: { + getters: store.getters, + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + }); mountOptions.propsData = { glassName: glassNameProp, diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue index fcf27d3ba..7e8639ee0 100644 --- a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue @@ -147,10 +147,29 @@ export default { }, // Reset selections when tint changes for the same glass to ensure proper selection. + // Also checks if only a single part is present for the tint. ResetTintAndPartSelections() { + this.selectedTint = {}; this.selectedPart = {}; + this.AutoSelectIfSinglePart(); }, + + // Check if only a single part is present for the tint and set the v-model if it is. + AutoSelectIfSinglePart(){ + // Check if the selected tint only has a single feature + const partsData = this.$store.getters.pageData(this.$route.query.fmgPage); + + Object.keys(partsData.partsOrQuestions).forEach((key) => { + const currentGlassSelection = partsData.partsOrQuestions[key]; + + if (currentGlassSelection.glassName === this.glassName && currentGlassSelection.glassLocation === this.glassLocation) { + if (currentGlassSelection.parts.length === 1) { + this.selectedPart = { [currentGlassSelection.glassLocation]: [currentGlassSelection.parts[0].partNumber]}; + } + } + }); + } }, }; diff --git a/src/layouts/vehicle-parts/vehicle-parts.spec.js b/src/layouts/vehicle-parts/vehicle-parts.spec.js index 5d22a458c..74196c524 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.spec.js +++ b/src/layouts/vehicle-parts/vehicle-parts.spec.js @@ -8,13 +8,10 @@ import glassPartQuestion from "@/layouts/vehicle-parts/glass-part-question/glass // 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"; -import { storeActions } from "@/constants/store-actions"; -import { storeMutations } from "@/constants/store-mutations"; import store from "@/store"; // Mock our module for promises. @@ -70,33 +67,8 @@ describe("vehicle-parts.vue", () => { test("Page header is initialized with api data", async (done) => { //Arrange - store.getters.pageData.mockReturnValueOnce({ - partsOrQuestions: [ - { - glassName: "Stationary", - glassLocation: "Rear", - parts: [ - { - partNumber: "DB12209GTYN", - description: "heated glass, solar, 1 hole", - color: "Green Tint", - requiresRecalibration: false, - requiresCapabilityQuestions: false, - childParts: null - }, - { - partNumber: "DB12209YPYNOEM", - description: "heated glass, solar, 1 hole", - color: "Gray Tint Privacy", - requiresRecalibration: false, - requiresCapabilityQuestions: false, - childParts: null - } - ], - partQuestions: null - } - ] - }); + store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.getters.lineItems = { glassParts: {} } const pageHeaderWidgetHeaderText = "Select Parts"; const { wrapper, apiPromise } = setupMocks( @@ -117,6 +89,7 @@ describe("vehicle-parts.vue", () => { } }); + //Act vehicleParts.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-parts" } }, @@ -139,6 +112,7 @@ describe("vehicle-parts.vue", () => { }; store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.getters.lineItems = { glassParts: {} } const { wrapper, apiPromise } = setupMocks( { @@ -181,6 +155,7 @@ describe("vehicle-parts.vue", () => { }; store.getters.pageData.mockReturnValue(basePartResponse); + store.getters.lineItems = { glassParts: {} } const { wrapper, apiPromise } = setupMocks( { @@ -219,6 +194,8 @@ describe("vehicle-parts.vue", () => { //Arrange store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.getters.lineItems = { glassParts: {} } + const { wrapper } = setupMocks({ mountOptionsMockData: { router: { @@ -250,10 +227,48 @@ describe("vehicle-parts.vue", () => { expect(arePagePrerequisitesValid).toBe(true); }); + test("Initial data, should populate this.glassParts", async () => { + + //Arrange + store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.getters.lineItems = { glassParts: { 0: { partNumber: 'DB12209YPYNOEM'} } } + + const { wrapper } = setupMocks({ + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters + }, + } + }); + + //Act + vehicleParts.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + await nextTick(); + + //Assert + expect(wrapper.vm.glassParts).toEqual({ "Rear-Stationary": { "Rear": ['DB12209YPYNOEM'] } }); + }); + test("BackButtonAction triggers a router.navigate change", async () => { //Arrange store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.getters.lineItems = { glassParts: {} } + const { wrapper } = setupMocks({ mountOptionsMockData: { router: { @@ -290,6 +305,9 @@ describe("vehicle-parts.vue", () => { //Arrange store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.getters.lineItems = { glassParts: {} } + + store.commit = jest.fn(); const { wrapper } = setupMocks({ diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 0ccfd9c4e..7c0efeda7 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -1,26 +1,42 @@ diff --git a/src/ux-components/radio/radio.spec.js b/src/ux-components/radio/radio.spec.js index 113d534c6..c815b1ace 100644 --- a/src/ux-components/radio/radio.spec.js +++ b/src/ux-components/radio/radio.spec.js @@ -77,7 +77,7 @@ describe("radio.vue", () => { }); wrapper.vm.handleCheckChange(); // Assert - expect(wrapper.emitted()["isCheckedChanged"][0]).toEqual([{"buttonID": "List Card Checkbox", value: "List Card Checkbox", checkValue: Boolean}]); + expect(wrapper.emitted()["isCheckedChanged"][0]).toEqual([{"buttonID": "List Card Checkbox", value: "List Card Checkbox", checkValue: false}]); }); it("Should set checkValue data if selectedButtonIDs has value(s)", async () => {