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 26a16e78d..1fc27fb52 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 @@ -108,9 +108,90 @@ describe("glass-part-question.vue", () => { expect(wrapper.vm.selectedPartNumber).toEqual(null); }); + test("default is selected if only one option", async () => { + // Arrange + store.getters.pageData.mockReset(); + store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [{glassName: "Stationary", glassLocation: "Rear", parts: [{ partNumber: "DB12209GTYN", color: "Green Tint"}]}] }); + const { wrapper } = setupMocks(featureListData); + + // Act + await wrapper.vm.$nextTick(); + await wrapper.setData({ selectedTint: "Green Tint" }); + // take emitted value, pass down as modelValue + // yes, yes, it's not ideal + await wrapper.setProps({ modelValue: wrapper.emitted()["update:modelValue"][0][0] }) + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.selectedPartNumber).toBe("DB12209GTYN"); + }); + + test("default is not selected if more than one option", async () => { + // Arrange + store.getters.pageData.mockReset(); + store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [{glassName: "Stationary", glassLocation: "Rear", parts: [{ partNumber: "DB12209GTYN", color: "Green Tint"}, { partNumber: "DB12209GTYNXXX", color: "Green Tint"}]}] }); + const { wrapper } = setupMocks(featureListData); + + // Act + await wrapper.vm.$nextTick(); + await wrapper.setData({ selectedTint: "Green Tint" }); + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.emitted()["update:modelValue"]).toBeFalsy(); + expect(wrapper.vm.selectedPartNumber).toBeFalsy(); + }) + + const partsForSelectedTintTestCases = [ + ["Rear", "Stationary", "Green Tint", [{ partNumber: "Glass1", color: "Green Tint"}, { partNumber: "Glass3", color: "Green Tint"}, { partNumber: "Glass4", color: "Green Tint"}, { partNumber: "Glass6", color: "Green Tint"} ]], + ["Rear", "Stationary", "Blue Tint", [{ partNumber: "Glass2", color: "Blue Tint"}, { partNumber: "Glass5", color: "Blue Tint"}]], + ["Rear", "Stationary", "Red Tint", [{ partNumber: "Glass7", color: "Red Tint"}]], + ["Windshield", "Single", "Green Tint", [{ partNumber: "Windshield1", color: "Green Tint"}, { partNumber: "Windshield2", color: "Green Tint"}]], + ["Windshield", "Single", "Blue Tint", []], + ["Driver", "Quarter", "Green Tint", []] + ]; + test.each(partsForSelectedTintTestCases)("partsForSelectedTint returns correct parts", async (glassLocation, glassName, selectedTint, expectedResults) => { + // Arrange + store.getters.pageData.mockReset(); + store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [ + { + glassName: "Stationary", + glassLocation: "Rear", + parts: [ + { partNumber: "Glass1", color: "Green Tint"}, + { partNumber: "Glass2", color: "Blue Tint"}, + { partNumber: "Glass3", color: "Green Tint"}, + { partNumber: "Glass4", color: "Green Tint"}, + { partNumber: "Glass5", color: "Blue Tint"}, + { partNumber: "Glass6", color: "Green Tint"}, + { partNumber: "Glass7", color: "Red Tint"} + ] + }, + { + glassName: "Single", + glassLocation: "Windshield", + parts: [{ partNumber: "Windshield1", color: "Green Tint"}, { partNumber: "Windshield2", color: "Green Tint"}] + } + ]}); + const { wrapper } = setupMocks({ + glassLocationProp: glassLocation, + glassNameProp: glassName, + colorAnswersProp: [], + }); + + // Act + await wrapper.setData({ selectedTint: selectedTint }); + + console.log(expectedResults) + console.log(wrapper.vm.partsForSelectedTint) + + // Assert + expect(expectedResults).toEqual(wrapper.vm.partsForSelectedTint); + }); }); + function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelValueProp }) { //Mock store store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [{glassName: "Stationary", glassLocation: "Rear", parts: []}] }); @@ -135,6 +216,7 @@ function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelV }; const wrapper = shallowMount(glassPartQuestion, mountOptions); + require = jest.fn(); return { wrapper }; } \ No newline at end of file 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 1c5dd1ae7..608cf55cb 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 @@ -116,10 +116,11 @@ export default { }, partsForSelectedTint() { - return this.PartDataFromApi.partsOrQuestions?.filter(dataForGlassLocationAndName => + const matchingGlass = this.PartDataFromApi.partsOrQuestions?.filter(dataForGlassLocationAndName => dataForGlassLocationAndName.glassName == this.glassName && - dataForGlassLocationAndName.glassLocation == this.glassLocation)[0] - .parts?.filter(part => part.color == this.selectedTint) ?? []; + dataForGlassLocationAndName.glassLocation == this.glassLocation); + const matchingGlassParts = matchingGlass?.length == 1 ? matchingGlass[0].parts : []; + return matchingGlassParts.filter(part => part.color == this.selectedTint) ?? []; }, // Creates a map of the feature list data in the correct Name/Value