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 be741f90..ad35c306 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 @@ -9,6 +9,7 @@ const featureListData = { ColorAnswerText: "Green Tint", FeatureAnswers: [ { FeatureAnswerText: "heated glass, solar, 1 hole", PartNumber: "DB12209GTYN" }, + ], }, { @@ -72,7 +73,6 @@ describe("glass-part-question.vue", () => { test("Should emit updateModelValue, and have correct attributes", async () => { //Arrange - featureListData.pageData = { partsOrQuestions: [ { @@ -90,7 +90,6 @@ describe("glass-part-question.vue", () => { const listCard = await wrapper.findComponent({ name: "buttonQuestion", }); - console.log(listCard) await wrapper.setData({ selectedTint: "Green Tint" }); // to trigger the computed setter wrapper.vm.selectedPartNumber = "DB12209GTYN"; @@ -102,17 +101,29 @@ describe("glass-part-question.vue", () => { expect(listCard.attributes("groupname")).toBe("Rear-Stationary"); expect(listCard.attributes("validationrules")).toBe("Rear-Stationary-tint-required"); }); -/* + test("ResetTintAndPartSelections, should reset data elements ", async () => { //Arrange + + featureListData.pageData = { + partsOrQuestions: [ + { + glassName: "Stationary", + glassLocation: "Rear", + parts: [{ partNumber: "DB12209GTYN", color: "Green Tint" }, + { partNumber: "DB12209GTYN2", color: "Green Tint" } + ], + }, + ], + }; const { wrapper } = setupMocks(featureListData); //Act await wrapper.vm.$nextTick(); - await wrapper.setData({ selectedTint: "Green Tint", selectedPartNumber: "test" }); + await wrapper.setData({ selectedTint: "Green Tint", selectedPartNumber: "DB12209GTYN" }); expect(wrapper.vm.selectedTint).toEqual("Green Tint"); - expect(wrapper.vm.selectedPartNumber).toEqual("test"); + expect(wrapper.vm.selectedPartNumber).toEqual("DB12209GTYN"); await wrapper.vm.ResetTintAndPartSelections(); @@ -122,8 +133,7 @@ describe("glass-part-question.vue", () => { test("default is selected if only one option", async () => { // Arrange - store.getters.pageData.mockReset(); - store.getters.pageData.mockReturnValueOnce({ + featureListData.pageData = { partsOrQuestions: [ { glassName: "Stationary", @@ -131,7 +141,7 @@ describe("glass-part-question.vue", () => { parts: [{ partNumber: "DB12209GTYN", color: "Green Tint" }], }, ], - }); + }; const { wrapper } = setupMocks(featureListData); // Act @@ -148,8 +158,7 @@ describe("glass-part-question.vue", () => { test("default is not selected if more than one option", async () => { // Arrange - store.getters.pageData.mockReset(); - store.getters.pageData.mockReturnValueOnce({ + featureListData.pageData = { partsOrQuestions: [ { glassName: "Stationary", @@ -160,7 +169,7 @@ describe("glass-part-question.vue", () => { ], }, ], - }); + }; const { wrapper } = setupMocks(featureListData); // Act @@ -213,35 +222,36 @@ describe("glass-part-question.vue", () => { async (glassLocation, glassName, selectedTint, expectedResults) => { // Arrange - useMainStore().applicationUser.pageData = { - 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 pageData = { 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: [], + pageData }); // Act @@ -251,15 +261,11 @@ describe("glass-part-question.vue", () => { expect(expectedResults).toEqual(wrapper.vm.partsForSelectedTint); } ); - */ + }); function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelValueProp, pageData }) { - //Mock store - const store = useMainStore(); - store.applicationUser.pageData = pageData ?? { - partsOrQuestions: [{ glassName: "Stationary", glassLocation: "Rear", parts: [] }], - }; + const mountOptions = getMountOptions({ route: { @@ -274,9 +280,15 @@ function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelV glassLocation: glassLocationProp, colorAnswers: colorAnswersProp, modelValue: modelValueProp, + }; const wrapper = shallowMount(glassPartQuestion, mountOptions); + //Mock store + const partsOrQuestions = pageData ?? { partsOrQuestions: [{ glassName: "Stationary", glassLocation: "Rear", parts: [] }] }; + useMainStore().pageData = jest.fn(); + useMainStore().pageData.mockReturnValueOnce(partsOrQuestions); + return { wrapper }; } 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 67040080..7257c08c 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 @@ -158,7 +158,7 @@ export default { }, PartDataFromApi() { - return this.mainStore.applicationUser.pageData[this.$route.query.iisPage] ?? {}; + return this.mainStore.pageData(this.$route.query.iisPage) ?? {}; }, }, methods: {